git.admin/roi-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Change font-display from swap to optional to eliminate CLS

Browse Source 
font-display: swap causes layout shift when fonts load and replace fallback.
font-display: optional prevents CLS entirely - if font doesn't load in ~100ms,
fallback is used permanently. With preload, fonts should load in time.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
2025-12-01 12:26:33 -06:00
parent 9f5cc92ec6
commit fb74ccbdc2
2 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
Assets/Css/critical-bootstrap.css
View File

@@ -30,21 +30,21 @@
src: url('/wp-content/themes/roi-theme/Assets/Fonts/poppins-v24-latin-regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
font-display: optional; /* CLS fix: no swap, usa fallback si fuente no carga a tiempo */
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/roi-theme/Assets/Fonts/poppins-v24-latin-600.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
font-display: optional;
}
@font-face {
font-family: 'Poppins';
src: url('/wp-content/themes/roi-theme/Assets/Fonts/poppins-v24-latin-700.woff2') format('woff2');
font-weight: 700;
font-style: normal;
font-display: swap;
font-display: optional;
}
:root {

8
Assets/Css/css-global-fonts.css
View File

@@ -78,7 +78,7 @@
src: url('../Fonts/poppins-v24-latin-regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
font-display: optional;
}
@font-face {
@@ -86,7 +86,7 @@
src: url('../Fonts/poppins-v24-latin-500.woff2') format('woff2');
font-weight: 500;
font-style: normal;
font-display: swap;
font-display: optional;
}
@font-face {
@@ -94,7 +94,7 @@
src: url('../Fonts/poppins-v24-latin-600.woff2') format('woff2');
font-weight: 600;
font-style: normal;
font-display: swap;
font-display: optional;
}
@font-face {
@@ -102,7 +102,7 @@
src: url('../Fonts/poppins-v24-latin-700.woff2') format('woff2');
font-weight: 700;
font-style: normal;
font-display: swap;
font-display: optional;
}
/* ============================================