Added a background for the tabs

Dark and light theme
https://prnt.sc/rXcjFgvOTX7Y
https://prnt.sc/gT8x9Hto1yeL

.github/workflows/sync-boostlook-css.yml

@@ -16,10 +16,10 @@ jobs:
     if: github.repository == 'boostorg/boostlook'
     steps:
       - name: Checkout current repository
-        uses: actions/checkout@v6
+        uses: actions/checkout@v4
 
       - name: Checkout website-v2 repository
-        uses: actions/checkout@v6
+        uses: actions/checkout@v4
         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.13"
+          python-version: "3.11"
 
       - name: Copy boostlook.css to website-v2
         run: |

boostlook.css

@@ -280,8 +280,8 @@
   --main-container: 90rem;
 
   /* New Look Typography */
-  --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-family-body: "Noto Sans";
+  --font-family-code: "Noto Sans Mono";
   --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. Monaspace Neon: Monospace font for code blocks
+ * 2. Noto Sans Mono: Monospace font for code blocks
  *
  * Font Loading Strategy:
  * - Multiple source paths for resilient loading
@@ -723,16 +723,13 @@ 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;
-  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%;
+  /* 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");
 }
 
 /* Noto Sans Display - Italic */
@@ -741,48 +738,42 @@ 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;
-  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%;
+  /* 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");
 }
 
-/* Monaspace Neon - Regular */
+/* Noto Sans Mono - Variable Weight */
 @font-face {
-  font-family: "Monaspace Neon";
+  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-style: normal;
   font-weight: 400;
+  /* Fixed weight for specific use cases */
+  font-stretch: 62.5% 100%;
   font-display: block;
-  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%;
+  /* 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");
 }
 
 /*----------------- Font-Face Declarations end -----------------*/
@@ -1267,17 +1258,15 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
   cursor: pointer;
 }
 
-/* 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;
+/* Link States */
+.boostlook p a:visited:not(:hover),
+.boostlook table a:visited:not(:hover) {
+  color: var(--text-main-text-body-tetriary, #62676b);
 }
 
-.boostlook em {
+/* Emphasis within code */
+.boostlook em,
+.boostlook code em {
   font-family: inherit;
   font-size: inherit;
   font-style: italic;
@@ -1289,19 +1278,6 @@ 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 {
@@ -1318,7 +1294,7 @@ div.source-docs-antora.boostlook:not(:has(.doc)):not(:has(>.boostlook)) > #conte
 }
 
 .boostlook code {
-  font-family: var(--font-family-code, "Monaspace Neon"), monospace;
+  font-family: var(--font-family-code, "Noto Sans Mono"), monospace;
 }
 
 .boostlook table thead code {
@@ -1330,7 +1306,6 @@ 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);
@@ -1369,10 +1344,8 @@ 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,
-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;
+html.dark .boostlook .doc .literalblock pre {
+  background: var(--atom-one-dark-bg, #282c34);
 }
 
 .boostlook .doc pre {
@@ -1786,14 +1759,12 @@ html.dark .boostlook#libraryReadMe div.highlight:has(> pre):not(:is(dd pre, td p
 .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;
 }
 
@@ -1809,15 +1780,12 @@ 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,
@@ -2397,7 +2365,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, 'Monaspace Neon');
+  font-family: var(--font-family-code, 'Noto Sans Mono');
 }
 
 .boostlook .dlist dl dd,
@@ -2679,7 +2647,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" 350, "wdth" 80;
+  font-variation-settings: "wght" 500, "wdth" 80;
   line-height: var(--typography-line-height-sm, 1rem);
   font-size: var(--typography-font-size-sm, 1rem);
   text-align: center;
@@ -3518,7 +3486,6 @@ 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;
 }
 
@@ -3550,7 +3517,6 @@ 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;
 }
 
@@ -3823,13 +3789,6 @@ html.dark .boostlook pre.rouge .cm {
   gap: 0.125rem;
 }
 
-.boostlook .toolbar .spirit-nav .disabled,
-.boostlook:not(:has(.doc)) .spirit-nav .disabled {
-  opacity: 0.35;
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
 .boostlook:not(:has(.doc)) .spirit-nav {
   padding-top: var(--padding-padding-md, 1.125rem);
   justify-content: flex-end;