From eb3ad178c9ad25692b0ff21101dd138f8b540ca3 Mon Sep 17 00:00:00 2001
From: Jonathan Miller <230051081+jmiller-moko@users.noreply.github.com>
Date: Thu, 26 Mar 2026 13:31:02 -0500
Subject: [PATCH] feat: add hero variant and block color variables to standard
 theme files

Adds all 20 hero variant and block color CSS variables to both
light.standard.css and dark.standard.css, matching the custom palette
templates. Users on the standard palette now get hero variants and
block colors out of the box.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/media/css/theme/dark.standard.css  | 34 ++++++++++++++++++++++++++
 src/media/css/theme/light.standard.css | 34 ++++++++++++++++++++++++++
 2 files changed, 68 insertions(+)

diff --git a/src/media/css/theme/dark.standard.css b/src/media/css/theme/dark.standard.css
index 1ac1186..b9dc5c7 100644
--- a/src/media/css/theme/dark.standard.css
+++ b/src/media/css/theme/dark.standard.css
@@ -534,6 +534,40 @@ color-scheme: dark;
 --hero-overlay-text-align: center;
 --hero-overlay-text-color: var(--body-color);
 
+/* ===== HERO VARIANTS ===== */
+/* Primary — deep navy, dark overlay */
+--hero-primary-bg-color: #0d1e3a;
+--hero-primary-overlay: linear-gradient(rgba(13, 30, 58, .65), rgba(13, 30, 58, .65));
+--hero-primary-color: #f1f5f9;
+
+/* Secondary — darker navy, heavier overlay */
+--hero-secondary-bg-color: #080f1e;
+--hero-secondary-overlay: linear-gradient(rgba(8, 15, 30, .80), rgba(8, 15, 30, .80));
+--hero-secondary-color: #f1f5f9;
+
+/* ===== BLOCK COLORS (top-a / top-b / bottom-a / bottom-b) ===== */
+--block-color-1: var(--secondary-bg);
+--block-text-1:  var(--body-color);
+
+--block-color-2: var(--accent-color-primary);
+--block-text-2:  #fff;
+
+--block-color-3: rgba(238, 194, 52, .15);
+--block-text-3:  var(--body-color);
+
+--block-color-4: rgba(74, 166, 100, .15);
+--block-text-4:  var(--body-color);
+
+/* ===== BLOCK COLOR OVERRIDES ===== */
+--block-highlight-bg:   var(--accent-color-primary);
+--block-highlight-text: #fff;
+
+--block-cta-bg:         var(--color-primary);
+--block-cta-text:       #f1f5f9;
+
+--block-alert-bg:       var(--danger, #c23a31);
+--block-alert-text:     #fff;
+
 /* ===== OFFCANVAS ===== */
 --offcanvas-zindex: 1045;
 --offcanvas-width: 400px;
diff --git a/src/media/css/theme/light.standard.css b/src/media/css/theme/light.standard.css
index a34b34e..5f8c934 100644
--- a/src/media/css/theme/light.standard.css
+++ b/src/media/css/theme/light.standard.css
@@ -533,6 +533,40 @@ color-scheme: light;
 --hero-overlay-text-align: center;
 --hero-overlay-text-color: var(--body-color);
 
+/* ===== HERO VARIANTS ===== */
+/* Primary — sky blue, light overlay */
+--hero-primary-bg-color: var(--color-primary);
+--hero-primary-overlay: linear-gradient(rgba(163, 205, 226, .45), rgba(163, 205, 226, .45));
+--hero-primary-color: var(--color-primary);
+
+/* Secondary — navy, stronger overlay */
+--hero-secondary-bg-color: var(--color-primary);
+--hero-secondary-overlay: linear-gradient(rgba(17, 40, 85, .75), rgba(17, 40, 85, .75));
+--hero-secondary-color: #f1f5f9;
+
+/* ===== BLOCK COLORS (top-a / top-b / bottom-a / bottom-b) ===== */
+--block-color-1: var(--color-primary);
+--block-text-1:  var(--body-color);
+
+--block-color-2: var(--accent-color-primary);
+--block-text-2:  #fff;
+
+--block-color-3: var(--warning, #eec234);
+--block-text-3:  var(--body-color);
+
+--block-color-4: var(--success-bg-subtle, #eef7f0);
+--block-text-4:  var(--body-color);
+
+/* ===== BLOCK COLOR OVERRIDES ===== */
+--block-highlight-bg:   var(--accent-color-primary);
+--block-highlight-text: #fff;
+
+--block-cta-bg:         var(--color-primary);
+--block-cta-text:       #fff;
+
+--block-alert-bg:       var(--danger, #a51f18);
+--block-alert-text:     #fff;
+
 /* ===== OFFCANVAS ===== */
 --offcanvas-zindex: 1045;
 --offcanvas-width: 400px;