npm - @cbnventures/docusaurus-preset-nova - Versions diffs - 0.17.0 → 0.18.0 - Mend

@cbnventures/docusaurus-preset-nova 0.17.0 → 0.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1988) hide show

package/build/src/styles/accessibility.css CHANGED Viewed

@@ -1,34 +1,9 @@
 /**
- * Accessibility — Skip-to-content link and screen reader utilities.
+ * Accessibility - Skip-to-content link and screen reader utilities.
  *
  * @since 0.15.0
  */
-/* ============================
- * Skip to Content
- * ============================ */
-[role="region"][aria-label="Skip to main content"] a {
-  position: absolute;
-  top: -100%;
-  left: 0;
-  z-index: 9999;
-  padding: 0.75rem 1.5rem;
-  font-size: 0.875rem;
-  font-weight: 600;
-  color: var(--nova-color-neutral-50);
-  text-decoration: none;
-  background-color: var(--nova-color-primary-600, #2563eb);
-  border-radius: 0 0 0.375rem 0;
-}
-[role="region"][aria-label="Skip to main content"] a:focus {
-  top: 0;
-}
 /* ============================
  * Screen Reader Only
  * ============================ */
@@ -67,15 +42,16 @@
 }
 /* ============================
- * Focus Visible — Base Fallback
+ * Focus Visible - Base Fallback
  * ============================ */
 .nova-back-to-top:focus-visible,
 .nova-toc-collapsible-trigger:focus-visible,
 .nova-toc-collapsible-close:focus-visible,
+.nova-sidebar-mobile-trigger:focus-visible,
+.nova-sidebar-mobile-close:focus-visible,
 .nova-tabs-tab:focus-visible,
 .nova-tag:focus-visible,
-.nova-blog-tags-list-link:focus-visible,
 .nova-search-bar-clear:focus-visible,
 .nova-search-result:focus-visible,
 .nova-code-block-copy:focus-visible,
@@ -96,11 +72,12 @@
 @media (forced-colors: active) {
   .nova-tag,
-  .nova-blog-tags-list-link,
   .nova-tabs-tab,
   .nova-back-to-top,
   .nova-toc-collapsible-trigger,
   .nova-toc-collapsible-close,
+  .nova-sidebar-mobile-trigger,
+  .nova-sidebar-mobile-close,
   .nova-search-bar-clear,
   .nova-code-block-copy,
   .nova-code-block-wrap,

package/build/src/styles/{components → blocks}/app-market-download/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * App Market Download — Section
+ * App Market Download - Section
  * ============================
  */
@@ -11,7 +11,7 @@
 /**
  * ============================
- * App Market Download — Buttons
+ * App Market Download - Buttons
  * ============================
  */
@@ -24,7 +24,7 @@
 /**
  * ============================
- * App Market Download — Button
+ * App Market Download - Button
  * ============================
  */
@@ -36,13 +36,22 @@
   text-decoration: none;
 }
-.nova-app-market-download .nova-app-market-download-button:hover {
+.nova-app-market-download .nova-app-market-download-button:hover,
+.nova-app-market-download .nova-app-market-download-button:focus-visible {
   text-decoration: none;
 }
+/* Iconify SVGs default to the browser's `fill: black` because the source
+   SVGs omit a fill attribute. Force `currentColor` so the Apple/Google
+   marks pick up each preset's button text color (white on dark buttons,
+   ink on light ones) instead of always rendering as solid black. */
+.nova-app-market-download .nova-app-market-download-button svg {
+  fill: currentColor;
+}
 /**
  * ============================
- * App Market Download — Button Text
+ * App Market Download - Button Text
  * ============================
  */

package/build/src/styles/blocks/blog-preview/style.css ADDED Viewed

@@ -0,0 +1,127 @@
+/**
+ * ============================
+ * Blog Preview - Section
+ * ============================
+ */
+.nova-blog-preview {
+  margin-block: var(--nova-section-gap);
+}
+/**
+ * ============================
+ * Blog Preview - Heading
+ * ============================
+ */
+.nova-blog-preview-heading {
+  margin-bottom: 1.5rem;
+}
+/**
+ * ============================
+ * Blog Preview - Description
+ * ============================
+ */
+.nova-blog-preview-description {
+  margin-top: 0;
+}
+/**
+ * ============================
+ * Blog Preview - Card (full-card hit target)
+ *
+ * The whole card is clickable via a pseudo-element on the heading link.
+ * Card is a positioning context; the heading link's `::after` stretches
+ * to fill the card. Per-preset overlays own the visual hover state via
+ * `.nova-blog-preview-card:hover` / `:focus-within`.
+ * ============================
+ */
+.nova-blog-preview-card {
+  position: relative;
+}
+/**
+ * ============================
+ * Blog Preview - Card Heading
+ * ============================
+ */
+.nova-blog-preview-card h3 {
+  margin-top: 0;
+  padding: 0;
+  border: none;
+}
+.nova-blog-preview-card h3 a {
+  color: inherit;
+  text-decoration: none;
+}
+/* Override the preset-level `[data-theme="dark"] a:hover` color flip
+ * (specificity 0,2,1) so the heading link stays inherited on hover —
+ * only `.nova-blog-preview-read-more` should react to card hover. */
+.nova-blog-preview-card h3 a:hover,
+.nova-blog-preview-card h3 a:focus-visible {
+  color: inherit;
+}
+.nova-blog-preview-card h3 a::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+}
+/* Hide the link's own focus ring; the card surfaces focus via :focus-within. */
+.nova-blog-preview-card h3 a:focus-visible {
+  outline: none;
+}
+/**
+ * ============================
+ * Blog Preview - Read-More (decorative, never underlined)
+ *
+ * Read-more is a non-interactive `<span aria-hidden>` - the whole card is
+ * the link. Pin `text-decoration: none` here so preset overlays don't have
+ * to repeat it, and so card hover/focus-within can never reintroduce an
+ * underline.
+ * ============================
+ */
+.nova-blog-preview-read-more,
+.nova-blog-preview-card:hover .nova-blog-preview-read-more,
+.nova-blog-preview-card:focus-within .nova-blog-preview-read-more {
+  text-decoration: none;
+}
+/**
+ * ============================
+ * Blog Preview - Card Time
+ * ============================
+ */
+/**
+ * ============================
+ * Blog Preview - No Posts
+ * ============================
+ */
+.nova-blog-preview-no-posts {
+  margin: 0;
+  color: var(--nova-color-text-muted);
+}
+/**
+ * ============================
+ * Blog Preview - Card Time
+ * ============================
+ */
+.nova-blog-preview-card time {
+  display: block;
+}

package/build/src/styles/{components → blocks}/features/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * Features — Section
+ * Features - Section
  * ============================
  */
@@ -10,7 +10,7 @@
 /**
  * ============================
- * Features — Heading
+ * Features - Heading
  * ============================
  */
@@ -20,7 +20,7 @@
 /**
  * ============================
- * Features — Card Icon
+ * Features - Card Icon
  * ============================
  */

package/build/src/styles/blocks/frame/style.css ADDED Viewed

@@ -0,0 +1,47 @@
+/**
+ * ============================
+ * Frame - Figure Container
+ * ============================
+ */
+.nova-frame {
+  display: block;
+  margin-block: 1.5rem;
+  margin-inline: 0;
+}
+/**
+ * ============================
+ * Frame - Media
+ * ============================
+ */
+.nova-frame-media {
+  display: block;
+  overflow: hidden;
+}
+.nova-frame-media > img,
+.nova-frame-media > picture > img {
+  display: block;
+  width: 100%;
+  height: auto;
+  max-width: 100%;
+}
+/**
+ * ============================
+ * Frame - Caption
+ * ============================
+ */
+.nova-frame-caption {
+  display: block;
+  margin-top: 0.625rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  text-align: center;
+}

package/build/src/styles/{components → blocks}/hero/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * Hero — Section
+ * Hero - Section
  * ============================
  */
@@ -10,7 +10,7 @@
 /**
  * ============================
- * Hero — Actions
+ * Hero - Actions
  * ============================
  */

package/build/src/styles/{components → blocks}/install-strip/style.css RENAMED Viewed

@@ -1,17 +1,18 @@
 /**
  * ============================
- * Install Strip — Section
+ * Install Strip - Section
  * ============================
  */
 .nova-install-strip {
   margin-block: var(--nova-section-gap);
   text-align: center;
+  overflow-anchor: none;
 }
 /**
  * ============================
- * Install Strip — Command
+ * Install Strip - Command
  * ============================
  */
@@ -23,7 +24,7 @@
 /**
  * ============================
- * Install Strip — Block Variant
+ * Install Strip - Block Variant
  * ============================
  */
@@ -33,11 +34,11 @@
 /**
  * ============================
- * Install Strip — Icon Variant
+ * Install Strip - Icon Variant
  * ============================
  */
-/* Two separate floating blocks — no shared wrapper styling. */
+/* Two separate floating blocks - no shared wrapper styling. */
 .nova-install-strip .nova-install-strip-command:not(.nova-install-strip-command-block) {
   align-items: stretch;
   gap: 0.5rem;
@@ -49,7 +50,7 @@
 /**
  * ============================
- * Install Strip — Code
+ * Install Strip - Code
  * ============================
  */
@@ -73,7 +74,7 @@
 /**
  * ============================
- * Install Strip — Copy Button
+ * Install Strip - Copy Button
  * ============================
  */
@@ -96,12 +97,19 @@
 /**
  * ============================
- * Install Strip — Text Copy Button
+ * Install Strip - Text Copy Button
  * ============================
  */
 .nova-install-strip-copy-text {
   width: auto;
   min-width: 4rem;
+  padding: 0.5rem 1rem;
   cursor: pointer;
+  font-family: var(--nova-font-code);
+  font-size: 0.625rem;
+  font-weight: 700;
+  letter-spacing: 0.05em;
+  text-transform: uppercase;
 }

package/build/src/styles/{components → blocks}/spotlight/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * Spotlight — Section
+ * Spotlight - Section
  * ============================
  */
@@ -10,7 +10,7 @@
 /**
  * ============================
- * Spotlight — Inner
+ * Spotlight - Inner
  * ============================
  */
@@ -21,7 +21,7 @@
 /**
  * ============================
- * Spotlight — Heading
+ * Spotlight - Heading
  * ============================
  */
@@ -32,7 +32,7 @@
 /**
  * ============================
- * Spotlight — Code Snippet
+ * Spotlight - Code Snippet
  * ============================
  */
@@ -43,14 +43,14 @@
   font-family: var(--nova-font-code);
   font-size: 0.875rem;
   line-height: 1.7;
-  text-align: left;
+  text-align: left /*! rtl:ignore */;
   overflow-x: auto;
 }
 /**
  * ============================
- * Spotlight — Section Description
+ * Spotlight - Section Description
  * ============================
  */

package/build/src/styles/{components → blocks}/stats/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * Stats — Section
+ * Stats - Section
  * ============================
  */
@@ -10,7 +10,7 @@
 /**
  * ============================
- * Stats — Grid
+ * Stats - Grid
  * ============================
  */
@@ -21,7 +21,7 @@
 /**
  * ============================
- * Stats — Heading
+ * Stats - Heading
  * ============================
  */
@@ -33,7 +33,7 @@
 /**
  * ============================
- * Stats — Description
+ * Stats - Description
  * ============================
  */
@@ -45,7 +45,7 @@
 /**
  * ============================
- * Stats — Value
+ * Stats - Value
  * ============================
  */
@@ -55,7 +55,7 @@
 /**
  * ============================
- * Stats — Label
+ * Stats - Label
  * ============================
  */

package/build/src/styles/{components → blocks}/terminology/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * Terminology — Inline Term
+ * Terminology - Inline Term
  * ============================
  */

package/build/src/styles/{components → blocks}/typewriter/style.css RENAMED Viewed

@@ -1,6 +1,6 @@
 /**
  * ============================
- * Typewriter — Container
+ * Typewriter - Container
  * ============================
  */
@@ -15,7 +15,7 @@
 /**
  * ============================
- * Typewriter — Measure
+ * Typewriter - Measure
  * ============================
  */

package/build/src/styles/grid.css CHANGED Viewed

@@ -1,5 +1,5 @@
 /**
- * Grid — Responsive container, column system, and breakpoint variables.
+ * Grid - Responsive container, column system, and breakpoint variables.
  *
  * @since 0.15.0
  */
@@ -23,6 +23,47 @@
   --nova-layout-docs-max: var(--nova-grid-container-max);
   --nova-layout-blog-max: var(--nova-grid-container-max);
   --nova-layout-footer-max: var(--nova-grid-container-max);
+  /* Sticky chrome offset for hash-anchor scroll, sticky sidebars, and TOC.
+     System default is 0px (no sticky chrome). Each preset MUST override this
+     to match the rendered sticky-navbar height (or 0 if non-sticky) via
+     rename+alias from --nova-{preset}-layout-sticky-top in preset.css.
+     sticky-layout.ts also overrides this at runtime to track dynamic
+     navbar-height changes (e.g. announcement-bar dismissal). */
+  --nova-layout-sticky-top: 0px;
+  /* Navbar items cluster max-width budgets - one value per variant,
+     shared across all 6 presets. Inline items beyond this budget get
+     pushed into a trailing "More" dropdown by `useNavbarOverflow`.
+     Monolith excluded (no desktop items row). Budgets grow at xl
+     (1280px) + xxl (1536px) so wider viewports surface more inline
+     items before falling back to the dropdown. `useNavbarOverflow`
+     re-reads these on every ResizeObserver fire, so the visible slice
+     updates automatically when the viewport crosses a breakpoint. */
+  --nova-navbar-bridge-items-max-width: 25rem;
+  --nova-navbar-compass-items-max-width: 28.125rem;
+  --nova-navbar-canopy-items-max-width: 18.75rem;
+  /* Navbar More dropdown trigger reserved width. `useNavbarOverflow`
+     subtracts this (plus one gap) from the budget when deciding the
+     overflow cutoff, so the trigger fits next to the visible items. */
+  --nova-navbar-more-width: 2.5rem;
+}
+@media (min-width: 1280px) {
+  :root {
+    --nova-navbar-bridge-items-max-width: 32rem;
+    --nova-navbar-compass-items-max-width: 36rem;
+    --nova-navbar-canopy-items-max-width: 24rem;
+  }
+}
+@media (min-width: 1536px) {
+  :root {
+    --nova-navbar-bridge-items-max-width: 40rem;
+    --nova-navbar-compass-items-max-width: 45rem;
+    --nova-navbar-canopy-items-max-width: 30rem;
+  }
 }
 .nova-container {
@@ -39,7 +80,7 @@
 }
 /**
- * Grid — Section container scoping.
+ * Grid - Section container scoping.
  *
  * Each section wrapper re-scopes --nova-grid-container-max for its
  * .nova-container children. Override --nova-layout-*-max in :root
@@ -51,14 +92,7 @@
 .nova-doc-root  { --nova-grid-container-max: var(--nova-layout-docs-max); }
 .nova-blog-root { --nova-grid-container-max: var(--nova-layout-blog-max); }
-@media (min-width: 1024px) {
-  .nova-doc-root > .nova-container,
-  .nova-blog-root > .nova-container {
-    padding-inline: 0;
-  }
-}
-/* Grid — Base column spans */
+/* Grid - Base column spans */
 .nova-col-1 { grid-column: span 1; }
 .nova-col-2 { grid-column: span 2; }
 .nova-col-3 { grid-column: span 3; }
@@ -72,7 +106,7 @@
 .nova-col-11 { grid-column: span 11; }
 .nova-col-12 { grid-column: span 12; }
-/* Grid — xxs (360px) */
+/* Grid - xxs (360px) */
 @media (min-width: 360px) {
   .nova-col-xxs-1 { grid-column: span 1; }
   .nova-col-xxs-2 { grid-column: span 2; }
@@ -88,7 +122,7 @@
   .nova-col-xxs-12 { grid-column: span 12; }
 }
-/* Grid — xs (480px) */
+/* Grid - xs (480px) */
 @media (min-width: 480px) {
   .nova-col-xs-1 { grid-column: span 1; }
   .nova-col-xs-2 { grid-column: span 2; }
@@ -104,7 +138,7 @@
   .nova-col-xs-12 { grid-column: span 12; }
 }
-/* Grid — sm (640px) */
+/* Grid - sm (640px) */
 @media (min-width: 640px) {
   .nova-col-sm-1 { grid-column: span 1; }
   .nova-col-sm-2 { grid-column: span 2; }
@@ -120,7 +154,7 @@
   .nova-col-sm-12 { grid-column: span 12; }
 }
-/* Grid — md (768px) */
+/* Grid - md (768px) */
 @media (min-width: 768px) {
   .nova-col-md-1 { grid-column: span 1; }
   .nova-col-md-2 { grid-column: span 2; }
@@ -136,7 +170,7 @@
   .nova-col-md-12 { grid-column: span 12; }
 }
-/* Grid — lg (1024px) */
+/* Grid - lg (1024px) */
 @media (min-width: 1024px) {
   .nova-col-lg-1 { grid-column: span 1; }
   .nova-col-lg-2 { grid-column: span 2; }
@@ -152,7 +186,7 @@
   .nova-col-lg-12 { grid-column: span 12; }
 }
-/* Grid — xl (1280px) */
+/* Grid - xl (1280px) */
 @media (min-width: 1280px) {
   .nova-col-xl-1 { grid-column: span 1; }
   .nova-col-xl-2 { grid-column: span 2; }
@@ -168,7 +202,7 @@
   .nova-col-xl-12 { grid-column: span 12; }
 }
-/* Grid — xxl (1536px) */
+/* Grid - xxl (1536px) */
 @media (min-width: 1536px) {
   .nova-col-xxl-1 { grid-column: span 1; }
   .nova-col-xxl-2 { grid-column: span 2; }
@@ -184,7 +218,7 @@
   .nova-col-xxl-12 { grid-column: span 12; }
 }
-/* Grid — 3xl (1920px) */
+/* Grid - 3xl (1920px) */
 @media (min-width: 1920px) {
   .nova-col-3xl-1 { grid-column: span 1; }
   .nova-col-3xl-2 { grid-column: span 2; }
@@ -200,7 +234,7 @@
   .nova-col-3xl-12 { grid-column: span 12; }
 }
-/* Grid — 4xl (2560px) */
+/* Grid - 4xl (2560px) */
 @media (min-width: 2560px) {
   .nova-col-4xl-1 { grid-column: span 1; }
   .nova-col-4xl-2 { grid-column: span 2; }