fix(structure): Rename assets and inc folders for Linux compatibility
- assets → Assets - inc → Inc Completes the case-sensitivity fixes for Linux servers. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
197
Assets/css/css-global-fonts.css
Normal file
197
Assets/css/css-global-fonts.css
Normal file
@@ -0,0 +1,197 @@
|
||||
/**
|
||||
* Sistema de Tipografías - ROI Theme
|
||||
*
|
||||
* RESPONSABILIDAD: SOLO definición de fuentes y variables tipográficas
|
||||
* - Declaraciones @font-face (comentadas - usar Google Fonts)
|
||||
* - Variables CSS de tipografía (:root)
|
||||
* - Clases utilitarias de fuentes
|
||||
*
|
||||
* NO debe contener:
|
||||
* - Estilos de body (van en style.css)
|
||||
* - Estilos de elementos HTML (van en style.css)
|
||||
* - Variables de colores o espaciados (van en variables.css)
|
||||
*
|
||||
* @package ROI_Theme
|
||||
* @since 1.0.0
|
||||
*/
|
||||
|
||||
/* ============================================
|
||||
SYSTEM FONTS (Por defecto - Recomendado)
|
||||
============================================ */
|
||||
|
||||
:root {
|
||||
/* Stack de fuentes del sistema - Fallback */
|
||||
--font-system: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
||||
Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
|
||||
|
||||
/* Fuente primaria - Poppins según template y documentación */
|
||||
--font-primary: 'Poppins', sans-serif;
|
||||
|
||||
/* Fuente para encabezados - Poppins según template */
|
||||
--font-headings: 'Poppins', sans-serif;
|
||||
|
||||
/* Fuente para código (monospace) */
|
||||
--font-mono: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono',
|
||||
Consolas, 'Courier New', monospace;
|
||||
|
||||
/* Tamaños de fuente base */
|
||||
--font-size-base: 16px;
|
||||
--line-height-base: 1.6;
|
||||
}
|
||||
|
||||
/* ELIMINADO: body, code, pre (movidos a style.css)
|
||||
* Este archivo SOLO debe contener variables y @font-face
|
||||
* Los estilos de elementos HTML van en style.css
|
||||
*/
|
||||
|
||||
/* ============================================
|
||||
POPPINS (Self-hosted)
|
||||
============================================
|
||||
|
||||
Fuentes Poppins alojadas localmente para:
|
||||
- Eliminar dependencia de Google Fonts
|
||||
- Mejorar rendimiento (sin requests externos)
|
||||
- Cumplimiento GDPR (sin tracking de Google)
|
||||
|
||||
Pesos incluidos: 400, 500, 600, 700
|
||||
Formato: WOFF2 (mejor compresión)
|
||||
|
||||
============================================ */
|
||||
|
||||
@font-face {
|
||||
font-family: 'Poppins';
|
||||
src: url('../fonts/poppins-v24-latin-regular.woff2') format('woff2');
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Poppins';
|
||||
src: url('../fonts/poppins-v24-latin-500.woff2') format('woff2');
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Poppins';
|
||||
src: url('../fonts/poppins-v24-latin-600.woff2') format('woff2');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Poppins';
|
||||
src: url('../fonts/poppins-v24-latin-700.woff2') format('woff2');
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
UTILIDADES DE FUENTES
|
||||
============================================ */
|
||||
|
||||
/* Font Weight Utilities */
|
||||
.font-light { font-weight: 300; }
|
||||
.font-regular { font-weight: 400; }
|
||||
.font-medium { font-weight: 500; }
|
||||
.font-semibold { font-weight: 600; }
|
||||
.font-bold { font-weight: 700; }
|
||||
|
||||
/* Font Family Utilities */
|
||||
.font-system {
|
||||
font-family: var(--font-system) !important;
|
||||
}
|
||||
|
||||
.font-mono {
|
||||
font-family: var(--font-mono) !important;
|
||||
}
|
||||
|
||||
/* Font Size Utilities */
|
||||
.text-xs { font-size: 0.75rem; line-height: 1.4; } /* 12px */
|
||||
.text-sm { font-size: 0.875rem; line-height: 1.5; } /* 14px */
|
||||
.text-base { font-size: 1rem; line-height: 1.6; } /* 16px */
|
||||
.text-lg { font-size: 1.125rem; line-height: 1.6; } /* 18px */
|
||||
.text-xl { font-size: 1.25rem; line-height: 1.5; } /* 20px */
|
||||
.text-2xl { font-size: 1.5rem; line-height: 1.4; } /* 24px */
|
||||
.text-3xl { font-size: 1.875rem; line-height: 1.3; } /* 30px */
|
||||
.text-4xl { font-size: 2.25rem; line-height: 1.2; } /* 36px */
|
||||
.text-5xl { font-size: 3rem; line-height: 1.1; } /* 48px */
|
||||
|
||||
/* Line Height Utilities */
|
||||
.leading-none { line-height: 1; }
|
||||
.leading-tight { line-height: 1.25; }
|
||||
.leading-snug { line-height: 1.375; }
|
||||
.leading-normal { line-height: 1.5; }
|
||||
.leading-relaxed { line-height: 1.625; }
|
||||
.leading-loose { line-height: 2; }
|
||||
|
||||
/* Text Transform */
|
||||
.uppercase { text-transform: uppercase; }
|
||||
.lowercase { text-transform: lowercase; }
|
||||
.capitalize { text-transform: capitalize; }
|
||||
.normal-case { text-transform: none; }
|
||||
|
||||
/* Font Smoothing */
|
||||
.text-smooth,
|
||||
.antialiased {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.subpixel-antialiased {
|
||||
-webkit-font-smoothing: auto;
|
||||
-moz-osx-font-smoothing: auto;
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
RESPONSIVE FONT SIZES
|
||||
============================================ */
|
||||
|
||||
/* Móviles (< 768px) */
|
||||
@media (max-width: 767px) {
|
||||
:root {
|
||||
--font-size-base: 15px;
|
||||
}
|
||||
|
||||
/* ELIMINADO: h1-h6 responsive - Template usa Bootstrap defaults */
|
||||
}
|
||||
|
||||
/* Tablets (768px - 1024px) */
|
||||
@media (min-width: 768px) and (max-width: 1024px) {
|
||||
:root {
|
||||
--font-size-base: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Desktop (> 1024px) */
|
||||
@media (min-width: 1025px) {
|
||||
:root {
|
||||
--font-size-base: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ============================================
|
||||
PERFORMANCE NOTES
|
||||
============================================
|
||||
|
||||
System Fonts Benefits:
|
||||
✅ 0 HTTP requests (fuentes ya en el sistema)
|
||||
✅ 0 KB descargados (mejora LCP)
|
||||
✅ Sin FOIT/FOUT (sin parpadeo de texto)
|
||||
✅ Mejor Core Web Vitals
|
||||
✅ Familiar para usuarios (fuentes nativas)
|
||||
|
||||
Custom Fonts (Poppins):
|
||||
⚠️ Requiere descarga (~30-50 KB por peso)
|
||||
⚠️ Impacto en LCP si no se optimiza
|
||||
✅ Branding consistente
|
||||
✅ Diseño específico del template
|
||||
|
||||
Recomendación: Mantener system fonts por defecto.
|
||||
Solo activar Poppins si el branding lo requiere.
|
||||
|
||||
============================================ */
|
||||
Reference in New Issue
Block a user