5 Commits

Author SHA1 Message Date
Julio Estrada
c8ea8e2061 fix foit: swap, fallbacks, metric overrides (#145)
- use font-display: swap to avoid invisible text
- add system fallbacks for body/code stacks
- add size-adjust/ascent/descent/line-gap to reduce cls

refs: issue #145
2025-09-29 16:45:47 -04:00
Julio Estrada
5454b1c038 remove visited link color overrides 2025-09-16 14:34:52 -04:00
Julio Estrada
34fb6a94b3 fix: update font source to noto sans italic 2025-09-13 18:30:00 -04:00
Julio Estrada
b4306e4b94 Fix dark mode background for library readme 2025-07-18 12:39:16 -04:00
Tino
36d2ef80b0 Changed the font-variation-settings value for .boostlook .doc .conum[data-value] to "wght" 350, "wdth" 80 2025-07-07 12:05:53 -04:00

View File

@@ -280,8 +280,8 @@
--main-container: 90rem;
/* New Look Typography */
--font-family-body: "Noto Sans";
--font-family-code: "Noto Sans Mono";
--font-family-body: "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
--font-family-code: "Noto Sans Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--font-size-3xs: 0.625rem;
--font-size-2xs: 0.75rem;
--font-size-xs: 0.875rem;
@@ -725,11 +725,15 @@ html:has(.boostlook) {
font-stretch: 62.5% 100%;
/* Variable font weight range */
font-variation-settings: "wght" 400, "wdth" 62.5;
font-display: block;
/* Prevents FOIT */
font-display: swap;
src: url("/static/font/notosans.woff2") format("woff2"),
url("../../../../tools/boostlook/notosans.woff2") format("woff2"),
url("https://cppalliance.org/fonts/NotoSansDisplay.ttf") format("truetype");
/* Metric overrides to reduce CLS on swap */
size-adjust: 100%;
ascent-override: 92%;
descent-override: 22%;
line-gap-override: 0%;
}
/* Noto Sans Display - Italic */
@@ -740,11 +744,15 @@ html:has(.boostlook) {
font-stretch: 62.5% 100%;
/* Variable font weight range */
font-variation-settings: "wght" 400, "wdth" 62.5;
font-display: block;
/* Prevents FOIT */
src: url("/static/font/notosans_mono_ext.woff") format("woff"),
url("../../../../tools/boostlook/notosans_mono_ext.woff") format("woff"),
url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype");
font-display: swap;
src: url("/static/font/notosans_ext.woff2") format("woff2"),
url("../../../../tools/boostlook/notosans_ext.woff2") format("woff2"),
url("https://cppalliance.org/fonts/NotoSansDisplay-Italic.ttf") format("truetype");
/* Metric overrides to reduce CLS on swap */
size-adjust: 100%;
ascent-override: 92%;
descent-override: 22%;
line-gap-override: 0%;
}
/* Noto Sans Mono - Variable Weight */
@@ -755,11 +763,15 @@ html:has(.boostlook) {
font-stretch: 62.5% 100%;
/* Variable font weight range */
font-variation-settings: "wght" 400, "wdth" 62.5;
font-display: block;
/* Prevents FOIT */
font-display: swap;
src: url("/static/font/notosans_mono.woff") format("woff"),
url("../../../../tools/boostlook/notosans_mono.woff") format("woff"),
url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype");
/* Metric overrides to reduce CLS on swap */
size-adjust: 100%;
ascent-override: 92%;
descent-override: 22%;
line-gap-override: 0%;
}
/* Noto Sans Mono - Fixed Weight */
@@ -769,11 +781,15 @@ html:has(.boostlook) {
font-weight: 400;
/* Fixed weight for specific use cases */
font-stretch: 62.5% 100%;
font-display: block;
/* Prevents FOIT */
font-display: swap;
src: url("/static/font/notosans_mono.woff") format("woff"),
url("../../../../tools/boostlook/notosans_mono.woff") format("woff"),
url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype");
/* Metric overrides to reduce CLS on swap */
size-adjust: 100%;
ascent-override: 92%;
descent-override: 22%;
line-gap-override: 0%;
}
/*----------------- Font-Face Declarations end -----------------*/
@@ -1258,12 +1274,6 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
cursor: pointer;
}
/* Link States */
.boostlook p a:visited:not(:hover),
.boostlook table a:visited:not(:hover) {
color: var(--text-main-text-body-tetriary, #62676b);
}
/* Emphasis within code */
.boostlook em,
.boostlook code em {
@@ -1344,8 +1354,10 @@ html.dark .boostlook pre.rouge,
html.dark .boostlook .doc .content pre,
html.dark .boostlook .doc pre.highlight,
html.dark .boostlook .doc .listingblock pre:not(.highlight),
html.dark .boostlook .doc .literalblock pre {
background: var(--atom-one-dark-bg, #282c34);
html.dark .boostlook .doc .literalblock pre,
html.dark .boostlook#libraryReadMe > pre:not(:last-child),
html.dark .boostlook#libraryReadMe div.highlight:has(> pre):not(:is(dd pre, td pre)) {
background: var(--atom-one-dark-bg, #282c34) !important;
}
.boostlook .doc pre {