refactor: streamline font URLs, remove comments

- Streamline font source URLs in @font-face declarations - Remove unnecessary comments
fix: enable contextual alternates in code blocks
2026-01-19 16:12:14 +00:00 · 2025-12-18 16:31:19 -05:00 · 2025-12-16 14:32:25 -05:00 · 2025-12-11 18:02:08 -05:00 · 2025-12-11 17:55:35 -05:00 · 2025-12-10 21:46:16 -05:00
7 changed files with 85 additions and 51 deletions
--- a/.github/workflows/sync-boostlook-css.yml
+++ b/.github/workflows/sync-boostlook-css.yml
@@ -16,10 +16,10 @@ jobs:
    if: github.repository == 'boostorg/boostlook'
    steps:
      - name: Checkout current repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v6

      - name: Checkout website-v2 repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v6
        with:
          repository: boostorg/website-v2
          ref: develop
@@ -29,7 +29,7 @@ jobs:
      - name: Set up Python
        uses: actions/setup-python@v4
        with:
-          python-version: "3.11"
+          python-version: "3.13"

      - name: Copy boostlook.css to website-v2
        run: |
--- a/MonaspaceNeon-Regular.woff2
+++ b/MonaspaceNeon-Regular.woff2
--- a/MonaspaceNeon-Var.woff2
+++ b/MonaspaceNeon-Var.woff2
--- a/MonaspaceRadon-Italic.woff2
+++ b/MonaspaceRadon-Italic.woff2
--- a/MonaspaceXenon-Italic.woff2
+++ b/MonaspaceXenon-Italic.woff2
--- a/MonaspaceXenon-Var.woff2
+++ b/MonaspaceXenon-Var.woff2
--- a/boostlook.css
+++ b/boostlook.css
@@ -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: "Monaspace Neon", 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;
@@ -709,7 +709,7 @@ html:has(.boostlook) {
 * Typography Configuration
 * The framework uses Noto Sans family as its primary font system:
 * 1. Noto Sans Display: Main text font with variable weight support
- * 2. Noto Sans Mono: Monospace font for code blocks
+ * 2. Monaspace Neon: Monospace font for code blocks
 *
 * Font Loading Strategy:
 * - Multiple source paths for resilient loading
@@ -723,13 +723,16 @@ html:has(.boostlook) {
  font-style: normal;
  font-weight: 100 900;
  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.woff2") format("woff2"),
-  url("../../../../tools/boostlook/notosans.woff2") format("woff2"),
-  url("https://cppalliance.org/fonts/NotoSansDisplay.ttf") format("truetype");
+  src: url("../font/NotoSansDisplay.ttf") format("truetype"),
+    url("/static/font/notosans.woff2") format("woff2"),
+    url("../../../../tools/boostlook/notosans.woff2") format("woff2"),
+    url("https://cppalliance.org/fonts/NotoSansDisplay.ttf") format("truetype");
+  size-adjust: 100%;
+  ascent-override: 92%;
+  descent-override: 22%;
+  line-gap-override: 0%;
 }

 /* Noto Sans Display - Italic */
@@ -738,42 +741,48 @@ html:has(.boostlook) {
  font-style: italic;
  font-weight: 100 900;
  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");
+  src: url("../font/NotoSansDisplay-Italic.ttf") format("truetype"),
+    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");
+  size-adjust: 100%;
+  ascent-override: 92%;
+  descent-override: 22%;
+  line-gap-override: 0%;
 }

-/* Noto Sans Mono - Variable Weight */
+/* Monaspace Neon - Regular */
@font-face {
-  font-family: "Noto Sans Mono";
-  font-style: normal;
-  font-weight: 100 900;
-  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.woff") format("woff"),
-  url("../../../../tools/boostlook/notosans_mono.woff") format("woff"),
-  url("https://cppalliance.org/fonts/NotoSansMono.ttf") format("truetype");
-}
-
-/* Noto Sans Mono - Fixed Weight */
-@font-face {
-  font-family: "Noto Sans Mono";
+  font-family: "Monaspace Neon";
  font-style: normal;
  font-weight: 400;
-  /* Fixed weight for specific use cases */
-  font-stretch: 62.5% 100%;
  font-display: block;
-  /* Prevents FOIT */
-  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");
+  src: url("../font/MonaspaceNeonFrozen-Regular.ttf") format("truetype"),
+    url("/static/font/MonaspaceNeon-Var.woff2") format("woff2"),
+    url("../../../../tools/boostlook/MonaspaceNeon-Var.woff2") format("woff2"),
+    url("https://cppalliance.org/fonts/MonaspaceNeon-Var.woff2") format("woff2");
+  size-adjust: 100%;
+  ascent-override: 92%;
+  descent-override: 22%;
+  line-gap-override: 0%;
+}
+
+/* Monaspace Xenon - Italic */
+@font-face {
+  font-family: "Monaspace Xenon";
+  font-style: italic;
+  font-weight: 400;
+  font-display: block;
+  src: url("../font/MonaspaceXenonFrozen-Italic.ttf") format("truetype"),
+    url("/static/font/MonaspaceXenon-Var.woff2") format("woff2"),
+    url("../../../../tools/boostlook/MonaspaceXenon-Var.woff2") format("woff2"),
+    url("https://cppalliance.org/fonts/MonaspaceXenon-Var.woff2") format("woff2");
+  size-adjust: 100%;
+  ascent-override: 92%;
+  descent-override: 22%;
+  line-gap-override: 0%;
 }

 /*----------------- Font-Face Declarations end -----------------*/
@@ -1258,15 +1267,17 @@ 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 code em,
+.boostlook code i,
+.boostlook pre em,
+.boostlook pre i {
+  font-family: "Monaspace Xenon", monospace;
+  font-size: inherit;
+  font-style: italic;
 }

-/* Emphasis within code */
-.boostlook em,
-.boostlook code em {
+.boostlook em {
  font-family: inherit;
  font-size: inherit;
  font-style: italic;
@@ -1278,6 +1289,19 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
  font-variation-settings: "wght" 600, "wdth" 80;
 }

+/* Comments within code (inline and blocks) */
+.boostlook code span.c,
+.boostlook code span.ch,
+.boostlook code span.cm,
+.boostlook code span.cp,
+.boostlook code span.cpf,
+.boostlook code span.c1,
+.boostlook code span.cs,
+.boostlook code span.comment {
+  font-family: "Monaspace Xenon", monospace;
+  font-style: italic;
+}
+
 /* Code Block Styling */
 .boostlook .doc .listingblock,
 .boostlook .listingblock {
@@ -1294,7 +1318,7 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
 }

 .boostlook code {
-  font-family: var(--font-family-code, "Noto Sans Mono"), monospace;
+  font-family: var(--font-family-code, "Monaspace Neon"), monospace;
 }

 .boostlook table thead code {
@@ -1306,6 +1330,7 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
 .boostlook .doc .content pre code,
 .boostlook .doc pre.highlight code {
  font-size: var(--typography-font-size-xs, 0.875rem);
+  font-feature-settings: "calt" 1, "liga" 0;
  line-height: var(--typography-line-height-lg, 1.5rem); /* 171.429% */
  letter-spacing: var(--spacing-size-size-0, 0rem);
  color: var(--text-main-text-primary, #18191b);
@@ -1344,8 +1369,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 {
@@ -1759,12 +1786,14 @@ html.dark .boostlook .doc .literalblock pre {
 .boostlook pre span.sh,
 .boostlook pre span.comment,
 .boostlook .hljs-comment,
+.boostlook .cpp-comment,
 .boostlook .hljs-quote,
 .boostlook .hljs-addition,
 .boostlook .hljs-built_in,
 .boostlook .hljs-bullet,
 .boostlook .hljs-code {
  color: var(--atom-one-light-comment, #a0a1a7);
+  font-family: "Monaspace Xenon", monospace;
  font-style: italic;
 }

@@ -1780,12 +1809,15 @@ html.dark .boostlook pre span.sd,
 html.dark .boostlook pre span.sh,
 html.dark .boostlook pre span.comment,
 html.dark .boostlook .hljs-comment,
+html.dark .boostlook .cpp-comment,
 html.dark .boostlook .hljs-quote,
 html.dark .boostlook .hljs-addition,
 html.dark .boostlook .hljs-built_in,
 html.dark .boostlook .hljs-bullet,
 html.dark .boostlook .hljs-code {
  color: var(--atom-one-dark-comment, #5c6370);
+  font-family: "Monaspace Xenon", monospace;
+  font-style: italic;
 }

 .boostlook pre span.s,
@@ -2365,7 +2397,7 @@ html.dark .boostlook .hljs-code {
 .boostlook .dlist dl dt code,
 .boostlook:not(:has(.doc)) .variablelist dl dt code {
  font-variation-settings: "wght" 600, "wdth" 80;
-  font-family: var(--font-family-code, 'Noto Sans Mono');
+  font-family: var(--font-family-code, 'Monaspace Neon');
 }

 .boostlook .dlist dl dd,
@@ -2647,7 +2679,7 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
  justify-content: center;
  font-family: "Noto Sans";
  font-style: normal;
-  font-variation-settings: "wght" 500, "wdth" 80;
+  font-variation-settings: "wght" 350, "wdth" 80;
  line-height: var(--typography-line-height-sm, 1rem);
  font-size: var(--typography-font-size-sm, 1rem);
  text-align: center;
@@ -3486,6 +3518,7 @@ html.is-clipped--nav:has(.boostlook) div#content {
 .boostlook pre.rouge .c1,
 .boostlook pre.rouge .cm { /* Comments */
  color: var(--atom-one-light-comment, #a0a1a7);
+  font-family: "Monaspace Xenon", monospace;
  font-style: italic;
 }

@@ -3517,6 +3550,7 @@ html.dark .boostlook pre.rouge .c,
 html.dark .boostlook pre.rouge .c1,
 html.dark .boostlook pre.rouge .cm {
  color: var(--atom-one-dark-comment, #5c6370);
+  font-family: "Monaspace Xenon", monospace;
  font-style: italic;
 }
Author	SHA1	Message	Date
Julio Estrada	f056e064ea	refactor: streamline font URLs, remove comments - Streamline font source URLs in @font-face declarations - Remove unnecessary comments	2025-12-18 16:31:19 -05:00
Julio Estrada	d264e70b57	fix: enable contextual alternates in code blocks	2025-12-16 14:32:25 -05:00
Julio Estrada	858f832cf5	fix: add cpp-comment class styling support	2025-12-11 18:02:08 -05:00
Julio Estrada	6adfbca7ab	fix: disable ligatures in code blocks	2025-12-11 17:55:35 -05:00
Julio Estrada	db04621383	feat: update to Monaspace variable fonts	2025-12-10 21:46:16 -05:00
Julio Estrada	dec44ce10a	fix: adjust font feature settings	2025-12-10 19:50:44 -05:00
Julio Estrada	ab2d0fda0a	feat: enhance code styling with font feature settings for improved typography	2025-12-10 18:19:57 -05:00
Julio Estrada	8c9f0364d1	refactor: remove Monaspace Radon font references and update to Monaspace Xenon	2025-12-10 16:54:46 -05:00
Julio Estrada	e32c8bda45	feat: update font to Monaspace Xenon Italic	2025-12-10 16:10:38 -05:00
Julio Estrada	76d10265f5	add comment styling with Monaspace Radon font	2025-12-10 01:47:39 -05:00
Julio Estrada	2afbebc0c5	feat: add Monaspace Radon Italic font	2025-12-10 01:25:05 -05:00
Julio Estrada	d0cc6d5e1e	refactor: update monospaced font to Monaspace Neon	2025-12-09 18:19:09 -05:00
Julio Estrada	20ddde5333	fix: update workflow dependencies - Upgrade actions/checkout from v4 to v6 - Upgrade Python from 3.11 to 3.13	2025-11-20 18:40:00 -05:00
Julio Estrada	66401ab4d7	fix: change font-display swap to block Prevent FOUT by blocking text render until fonts load	2025-11-20 14:31:37 -05:00
Julio Estrada	cdfdff1a43	Prioritize local fonts for antora bundles Add local font paths first in @font-face src to check for fonts in antora-bundled projects before remote fallbacks. Required before boostorg/website-v2-docs#545 can merge.	2025-11-19 23:27:51 -05:00
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