@conduction/docusaurus-preset 3.14.0 → 3.15.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/docusaurus-preset",
-  "version": "3.14.0",
+  "version": "3.15.1",
   "scripts": {
     "prepack": "node scripts/prepack-bundle-css.js"
   },

package/src/css/brand.css

@@ -311,6 +311,31 @@ a:not(.navbar__link):not(.footer__link-item):not(.button):hover {
   background: transparent;
 }
 
+/* ============================================================
+   Heading anchor hash glyphs.
+
+   Docusaurus auto-generates a hidden `<a class="hash-link">#</a>`
+   inside every h2-h6 so readers can copy a deep link. Default
+   Infima styling renders the glyph in the primary brand colour
+   (cobalt) which is fine for the visible state, but the affordance
+   reads stronger when the hash itself lights up in KNVB orange
+   the moment the cursor touches it.
+
+   We render the glyph in cobalt-300 by default (visible-on-hover
+   of the heading, via the theme's anchorWithStickyNavbar rule)
+   and flip it to var(--c-orange-knvb) the moment the user hovers
+   or focuses the hash itself.
+   ============================================================ */
+.hash-link {
+  color: var(--c-cobalt-300);
+  transition: color 120ms ease;
+}
+.hash-link:hover,
+.hash-link:focus-visible {
+  color: var(--c-orange-knvb);
+  text-decoration: none;
+}
+
 /* ============================================================
    Body grows with content.
 

package/static/img/favicon.svg

@@ -1,14 +1,11 @@
-<?xml version="1.0" encoding="UTF-8"?>
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="-86.6 -100 173.2 200" role="img" aria-label="Conduction avatar">
-  <title>Conduction avatar, drawn as three pointy-top polygons</title>
+  <title>Conduction avatar, drawn as two shapes on a transparent ground</title>
   <!-- viewBox is the bounding box of the outer hex (R=100), no
-       internal padding. Three polygons in the same drawing
+       internal padding. Two shapes in the same drawing
        vocabulary as the watermark hexes:
-         1. Outer hex      cobalt, the frame
-         2. Inner hex      white, the empty interior (so the
-                           logo reads correctly on any ground)
-         3. C-shape        cobalt, sits inside the inner hex -->
-  <polygon fill="#21468B" points="0,-100 86.6,-50 86.6,50 0,100 -86.6,50 -86.6,-50"/>
-  <polygon fill="#FFFFFF" points="0,-74.5 64.5,-37.3 64.5,37.3 0,74.5 -64.5,37.3 -64.5,-37.3"/>
+         1. Hex ring       cobalt, the frame (outer hex with inner hex
+                           punched out as transparent via evenodd fill-rule)
+         2. C-shape        cobalt, sits inside the ring -->
+  <path fill="#21468B" fill-rule="evenodd" d="M 0,-100 L 86.6,-50 L 86.6,50 L 0,100 L -86.6,50 L -86.6,-50 Z M 0,-74.5 L 64.5,-37.3 L 64.5,37.3 L 0,74.5 L -64.5,37.3 L -64.5,-37.3 Z"/>
   <polygon fill="#21468B" points="-0.2,-25.2 20.1,-13.5 43.7,-27.1 -0.2,-52.4 -45.6,-26.2 -45.6,26.2 -0.2,52.4 43.7,27.1 20.1,13.5 -0.2,25.2 -22,12.6 -22,-12.6"/>
 </svg>