Update color palette to use new orange primary and green accent colors for improved branding

This commit is contained in:
Matt Batchelder
2026-02-21 13:26:59 -05:00
parent d8c12e3f3b
commit bb30f38090
5 changed files with 25 additions and 25 deletions

View File

@@ -5,11 +5,11 @@
/* ── 1. CSS Variables ───────────────────────────────────────── */
:root,
[data-theme="light"] {
/* ── Light palette - British Racing Green + Monochrome ── */
--color-primary: var(--wp--preset--color--primary, #004225);
--color-primary-dk: var(--wp--preset--color--primary-dk, #002E1A);
--color-primary-lt: var(--wp--preset--color--primary-lt, #E8F5E9);
--color-primary-rgb: 0,66,37;
/* ── Light palette - Orange Primary + Green Accent ── */
--color-primary: var(--wp--preset--color--primary, #D83302);
--color-primary-dk: var(--wp--preset--color--primary-dk, #A22702);
--color-primary-lt: var(--wp--preset--color--primary-lt, #FFF0EB);
--color-primary-rgb: 216,51,2;
--color-accent: var(--wp--preset--color--accent, #4CAF50);
--color-accent-dk: var(--wp--preset--color--accent-dk, #388E3C);
--color-accent-lt: var(--wp--preset--color--accent-lt, #E8F5E9);
@@ -52,10 +52,10 @@
/* ── Dark Mode ────────────────────────────────────────────── */
[data-theme="dark"] {
--color-primary: var(--wp--custom--dark--primary, #4CAF50);
--color-primary-dk: var(--wp--custom--dark--primary-dk, #004225);
--color-primary-lt: var(--wp--custom--dark--primary-lt, rgba(0,66,37,.15));
--color-primary-rgb: 76,175,80;
--color-primary: var(--wp--custom--dark--primary, #FF6B3D);
--color-primary-dk: var(--wp--custom--dark--primary-dk, #D83302);
--color-primary-lt: var(--wp--custom--dark--primary-lt, rgba(216,51,2,.15));
--color-primary-rgb: 255,107,61;
--color-accent: var(--wp--custom--dark--accent, #66BB6A);
--color-accent-dk: var(--wp--custom--dark--accent-dk, #388E3C);
--color-accent-lt: var(--wp--custom--dark--accent-lt, rgba(76,175,80,.12));

View File

@@ -1374,7 +1374,7 @@ function oribi_render_platform_row( $a ) {
<svg viewBox="0 0 800 450" xmlns="http://www.w3.org/2000/svg" class="dashboard-chart" role="img" aria-label="Animated dashboard charts">
<defs>
<linearGradient id="barGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#004225" stop-opacity="1"/>
<stop offset="0%" stop-color="#D83302" stop-opacity="1"/>
<stop offset="100%" stop-color="#4CAF50" stop-opacity=".8"/>
</linearGradient>
<linearGradient id="lineGradient" x1="0%" y1="0%" x2="0%" y2="100%">
@@ -1452,7 +1452,7 @@ function oribi_render_platform_row( $a ) {
<text class="ct" x="100" y="0" font-size="14" font-weight="600" text-anchor="middle" fill="#333">Distribution</text>
<g transform="translate(100,90)">
<g class="pie-segment" transform="rotate(0)">
<path d="M0,0 L0,-55 A55,55 0 0,1 38.89,-38.89 Z" fill="#004225" opacity=".9"/>
<path d="M0,0 L0,-55 A55,55 0 0,1 38.89,-38.89 Z" fill="#D83302" opacity=".9"/>
</g>
<g class="pie-segment" transform="rotate(90)">
<path d="M0,0 L0,-55 A55,55 0 0,1 38.89,-38.89 Z" fill="#4CAF50" opacity=".8"/>
@@ -1467,7 +1467,7 @@ function oribi_render_platform_row( $a ) {
<text id="pie-center-text" x="0" y="5" text-anchor="middle" font-size="13" font-weight="600" fill="#333">100%</text>
</g>
<g transform="translate(30,170)">
<rect x="0" y="0" width="8" height="8" fill="#004225"/>
<rect x="0" y="0" width="8" height="8" fill="#D83302"/>
<text class="cl" x="12" y="8" font-size="11" fill="#666">Service A</text>
<rect x="0" y="15" width="8" height="8" fill="#4CAF50"/>
<text class="cl" x="12" y="23" font-size="11" fill="#666">Service B</text>

View File

@@ -24,9 +24,9 @@ function oribi_get_theme_defaults() {
return [
/* ── Light-mode colour palette ──────────────────────── */
'color_primary' => '#004225',
'color_primary_dk' => '#002E1A',
'color_primary_lt' => '#E8F5E9',
'color_primary' => '#D83302',
'color_primary_dk' => '#A22702',
'color_primary_lt' => '#FFF0EB',
'color_accent' => '#4CAF50',
'color_accent_dk' => '#388E3C',
'color_accent_lt' => '#E8F5E9',
@@ -39,9 +39,9 @@ function oribi_get_theme_defaults() {
'color_bg_alt' => '#F5F5F5',
/* ── Dark-mode colour palette ───────────────────────── */
'dark_primary' => '#4CAF50',
'dark_primary_dk' => '#004225',
'dark_primary_lt' => 'rgba(0,66,37,0.15)',
'dark_primary' => '#FF6B3D',
'dark_primary_dk' => '#D83302',
'dark_primary_lt' => 'rgba(216,51,2,0.15)',
'dark_accent' => '#66BB6A',
'dark_accent_dk' => '#4CAF50',
'dark_accent_lt' => 'rgba(76,175,80,0.15)',

View File

@@ -636,7 +636,7 @@ document.addEventListener('DOMContentLoaded', function() {
if (heroText) heroText.style.color = 'rgba(255,255,255,.8)';
}
if (btnP) {
btnP.style.backgroundColor = get('oribi_color_primary') || '#004225';
btnP.style.backgroundColor = get('oribi_color_primary') || '#D83302';
btnP.style.borderRadius = (get('oribi_radius_sm') || '6') + 'px';
}
if (btnA) {

View File

@@ -32,9 +32,9 @@
"customDuotone": false,
"customGradient": false,
"palette": [
{ "slug": "primary", "color": "#004225", "name": "Primary" },
{ "slug": "primary-dk", "color": "#002E1A", "name": "Primary Dark" },
{ "slug": "primary-lt", "color": "#E8F5E9", "name": "Primary Light" },
{ "slug": "primary", "color": "#D83302", "name": "Primary" },
{ "slug": "primary-dk", "color": "#A22702", "name": "Primary Dark" },
{ "slug": "primary-lt", "color": "#FFF0EB", "name": "Primary Light" },
{ "slug": "accent", "color": "#4CAF50", "name": "Accent" },
{ "slug": "accent-dk", "color": "#388E3C", "name": "Accent Dark" },
{ "slug": "accent-lt", "color": "#E8F5E9", "name": "Accent Light" },
@@ -85,9 +85,9 @@
},
"custom": {
"dark": {
"primary": "#4CAF50",
"primary-dk": "#004225",
"primary-lt": "rgba(0,66,37,0.15)",
"primary": "#FF6B3D",
"primary-dk": "#D83302",
"primary-lt": "rgba(216,51,2,0.15)",
"accent": "#66BB6A",
"accent-dk": "#388E3C",
"accent-lt": "rgba(76,175,80,0.12)",