@nu-appdev/northwestern-starlight-theme 1.3.1 → 1.3.2

package/CHANGELOG.md

@@ -7,6 +7,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [1.3.2] - 2026-03-30
+
+### Fixed
+
+- H1/H2 now use Noto Serif (`--nu-font-display`), H3–H6 use Poppins (`--nu-font-heading`). Sizes, weights, and colors match the [Department 4.0 stylesheet](https://common.northwestern.edu/dept/4.0/css/styles.css).
+- Poppins 400 loaded the Light file instead of Regular. Poppins 500 (Medium) added from v4 CDN.
+- Table headers now use `--nu-purple-100` with white text.
+- Table striping moved to odd rows (`#f9f6ff`); dark mode uses `rgb(78 42 132 / 10%)`.
+- `--nu-purple-surface` corrected to `#f9f6ff`, `--nu-purple-surface-subtle` to `#f3f0f7`.
+- Blockquote background uses `#f9f6ff` instead of translucent purple.
+- Horizontal rules use 3px `--nu-purple-10` instead of 1px gray.
+- List markers use `--nu-purple-100` instead of `--nu-purple-40`.
+
 ## [1.3.1] - 2026-03-27
 
 ### Fixed
@@ -130,7 +143,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - OpenAPI plugin compatibility with method badge preservation
 - Reduced motion support for transitions
 
-[Unreleased]: https://github.com/NIT-Administrative-Systems/northwestern-starlight-theme/compare/v1.3.1...HEAD
+[Unreleased]: https://github.com/NIT-Administrative-Systems/northwestern-starlight-theme/compare/v1.3.2...HEAD
+[1.3.2]: https://github.com/NIT-Administrative-Systems/northwestern-starlight-theme/compare/v1.3.1...v1.3.2
 [1.3.1]: https://github.com/NIT-Administrative-Systems/northwestern-starlight-theme/compare/v1.3.0...v1.3.1
 [1.3.0]: https://github.com/NIT-Administrative-Systems/northwestern-starlight-theme/compare/v1.2.0...v1.3.0
 [1.2.0]: https://github.com/NIT-Administrative-Systems/northwestern-starlight-theme/compare/v1.1.1...v1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nu-appdev/northwestern-starlight-theme",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "A Northwestern-branded theme for Astro Starlight",
   "license": "MIT",
   "author": "Danny Foster <danny@northwestern.edu>",

package/src/components/Hero.astro

@@ -130,6 +130,7 @@ const imageWidth = themeConfig.homepage.imageWidth;
         line-height: var(--sl-line-height-headings);
         font-weight: 600;
         color: var(--nu-purple-100);
+        box-shadow: none;
     }
 
     :root:not([data-theme="light"]) h1 {

package/src/styles/components/blockquotes.css

@@ -7,8 +7,9 @@
         padding: 1rem 1.5rem;
         margin: 2rem 0;
         color: var(--nu-color-text);
-        background: rgb(228 224 238 / 42%);
+        background: #f9f6ff;
         border-inline-start: 10px solid var(--nu-purple-100);
+        border-radius: 0 0.75rem 0.75rem 0 !important;
     }
 
     .sl-markdown-content blockquote:not(:where(.not-content *)) p:last-child {

package/src/styles/components/property-table.css

@@ -557,6 +557,7 @@
         .nu-property-table:not(.nu-property-table--table) .nu-property__head {
             flex-direction: column;
             gap: 0.25rem;
+            align-items: flex-start;
         }
 
         .nu-property-table:not(.nu-property-table--table) .nu-property__prop-col {

package/src/styles/components/tables.css

@@ -16,18 +16,20 @@
     }
 
     .sl-markdown-content table:not(:where(.not-content *)) > thead > tr > th {
-        padding: 0.5rem 1rem;
-        font-family: var(--nu-font-heading);
-        font-weight: 600;
-        color: var(--nu-black-80);
+        padding: 0.75rem 0.5rem;
+        font-family: var(--nu-font-body);
+        font-size: 1rem;
+        font-weight: 700;
+        color: #fff;
         text-align: left;
-        background-color: var(--nu-purple-surface);
+        background-color: var(--nu-purple-100);
         border: 1px solid var(--nu-border-color);
+        border-right: 1px solid rgb(255 255 255 / 30%);
+        border-left: 1px solid rgb(255 255 255 / 30%);
     }
 
     :root:not([data-theme="light"]) .sl-markdown-content table:not(:where(.not-content *)) > thead > tr > th {
-        color: var(--nu-color-text);
-        background-color: rgb(78 42 132 / 14%);
+        background-color: rgb(78 42 132 / 40%);
     }
 
     .sl-markdown-content table:not(:where(.not-content *)) > tbody > tr > td {
@@ -46,15 +48,19 @@
         text-align: center;
     }
 
-    .sl-markdown-content table:not(:where(.not-content *)) > tbody > tr:nth-child(even) {
-        background-color: #f3f4f6;
+    .sl-markdown-content table:not(:where(.not-content *)) > tbody > tr:nth-child(odd) {
+        background-color: #f9f6ff;
+    }
+
+    .sl-markdown-content table:not(:where(.not-content *)) > tbody > tr:hover {
+        background-color: #f0f0f0;
+    }
+
+    :root:not([data-theme="light"]) .sl-markdown-content table:not(:where(.not-content *)) > tbody > tr:nth-child(odd) {
+        background-color: rgb(78 42 132 / 10%);
     }
 
-    :root:not([data-theme="light"])
-        .sl-markdown-content
-        table:not(:where(.not-content *))
-        > tbody
-        > tr:nth-child(even) {
-        background-color: #1e1e1e;
+    :root:not([data-theme="light"]) .sl-markdown-content table:not(:where(.not-content *)) > tbody > tr:hover {
+        background-color: rgb(255 255 255 / 5%);
     }
 }

package/src/styles/content.css

@@ -39,7 +39,7 @@
         width: 6px;
         height: 6px;
         content: "";
-        background: var(--nu-purple-40);
+        background: var(--nu-purple-100);
     }
 
     :root:not([data-theme="light"]) .sl-markdown-content ul:not(:where(.not-content *)) > li::before {
@@ -56,10 +56,16 @@
         border-color: var(--nu-purple-30);
     }
 
+    .sl-markdown-content mark:not(:where(.not-content *)),
+    .sl-markdown-content .highlight:not(:where(.not-content *)) {
+        padding: 3px;
+        background: rgb(228 224 238 / 50%);
+    }
+
     .sl-markdown-content hr:not(:where(.not-content *)) {
-        height: 1px;
+        height: 3px;
         margin: 2.5rem 0;
-        background: var(--nu-border-color);
+        background: var(--nu-purple-10);
         border: 0;
     }
 

package/src/styles/typography.css

@@ -78,7 +78,15 @@
     font-family: Poppins;
     font-style: normal;
     font-weight: 400;
-    src: url("https://common.northwestern.edu/v8/css/fonts/Poppins-Light.woff") format("woff");
+    src: url("https://common.northwestern.edu/v8/css/fonts/Poppins-Regular.woff") format("woff");
+    font-display: swap;
+}
+
+@font-face {
+    font-family: Poppins;
+    font-style: normal;
+    font-weight: 500;
+    src: url("https://common.northwestern.edu/dept/4.0/css/fonts/poppins/poppins-v21-latin-500.woff2") format("woff2");
     font-display: swap;
 }
 
@@ -150,18 +158,81 @@
 
     h1,
     h2 {
-        font-family: var(--nu-font-heading);
-    }
-
-    h1 {
-        color: var(--sl-color-text-accent);
+        font-family: var(--nu-font-display);
     }
 
     h3,
     h4,
     h5,
     h6 {
-        font-family: var(--nu-font-body);
+        font-family: var(--nu-font-heading);
+    }
+
+    .main-pane h1 {
+        display: inline;
+        font-size: clamp(2rem, 1rem + 3vw, 2.8125rem);
+        font-weight: 500;
+        line-height: 1.4;
+        color: #000;
+        box-shadow: inset 0 -0.55em 0 0 var(--nu-purple-10);
+        box-decoration-break: clone;
+    }
+
+    :root:not([data-theme="light"]) .main-pane h1 {
+        color: #fff;
+        box-shadow: inset 0 -0.55em 0 0 var(--nu-purple-140);
+    }
+
+    .sl-markdown-content h2 {
+        font-size: 1.875rem;
+        font-weight: 700;
+        line-height: 1.4;
+        color: var(--nu-purple-120);
+    }
+
+    .sl-markdown-content h3 {
+        font-size: 1.625rem;
+        font-weight: 500;
+        line-height: 1.4;
+        color: var(--nu-black-80);
+    }
+
+    .sl-markdown-content h4 {
+        font-size: 1.4375rem;
+        font-weight: 500;
+        line-height: 1.4;
+        color: var(--nu-purple-120);
+    }
+
+    .sl-markdown-content h5 {
+        font-size: 1.25rem;
+        font-weight: 500;
+        line-height: 1.4;
+        color: var(--nu-black-80);
+    }
+
+    .sl-markdown-content h6 {
+        font-size: 1.125rem;
+        font-weight: 500;
+        line-height: 1.4;
+        color: var(--nu-black-80);
+    }
+
+    :root:not([data-theme="light"]) .sl-markdown-content h2 {
+        color: var(--nu-purple-30);
+    }
+
+    :root:not([data-theme="light"]) .sl-markdown-content h3 {
+        color: var(--nu-color-text);
+    }
+
+    :root:not([data-theme="light"]) .sl-markdown-content h4 {
+        color: var(--nu-purple-30);
+    }
+
+    :root:not([data-theme="light"]) .sl-markdown-content h5,
+    :root:not([data-theme="light"]) .sl-markdown-content h6 {
+        color: var(--nu-color-text);
     }
 
     .site-title {

package/src/styles/variables.css

@@ -55,12 +55,12 @@
         --nu-transition-default: 200ms ease;
         --nu-transition-slow: 300ms ease-in-out;
 
-        --nu-purple-surface: #f3f0f7;
-        --nu-purple-surface-subtle: #f7f5f9;
+        --nu-purple-surface: #f9f6ff;
+        --nu-purple-surface-subtle: #f3f0f7;
         --nu-purple-tint: rgb(78 42 132 / 15%);
         --nu-purple-tint-strong: rgb(78 42 132 / 20%);
         --nu-surface-muted: #f9fafb;
-        --nu-hover-bg: #f3f4f6;
+        --nu-hover-bg: #f0f0f0;
 
         --nu-focus-ring: var(--nu-purple-100);
         --nu-focus-border: #a795c2;
@@ -90,10 +90,10 @@
         --nu-focus-ring: var(--nu-purple-100);
         --nu-focus-shadow-color: rgb(78 42 132 / 25%);
 
-        --nu-purple-surface: #f3f0f7;
-        --nu-purple-surface-subtle: #f7f5f9;
+        --nu-purple-surface: #f9f6ff;
+        --nu-purple-surface-subtle: #f3f0f7;
         --nu-surface-muted: #f9fafb;
-        --nu-hover-bg: #f3f4f6;
+        --nu-hover-bg: #f0f0f0;
     }
 
     :root:not([data-theme="light"]),