OTSSigns/OTSSigns-Website
1
0
Fork 0
Code Issues Pull Requests 6 Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

18
theme/assets/css/main.css
View File

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

6
theme/blocks/index.php
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"> <svg viewBox="0 0 800 450" xmlns="http://www.w3.org/2000/svg" class="dashboard-chart" role="img" aria-label="Animated dashboard charts">
<defs> <defs>
<linearGradient id="barGradient" x1="0%" y1="0%" x2="0%" y2="100%"> <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"/> <stop offset="100%" stop-color="#4CAF50" stop-opacity=".8"/>
</linearGradient> </linearGradient>
<linearGradient id="lineGradient" x1="0%" y1="0%" x2="0%" y2="100%"> <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> <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 transform="translate(100,90)">
<g class="pie-segment" transform="rotate(0)"> <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>
<g class="pie-segment" transform="rotate(90)"> <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"/> <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> <text id="pie-center-text" x="0" y="5" text-anchor="middle" font-size="13" font-weight="600" fill="#333">100%</text>
</g> </g>
<g transform="translate(30,170)"> <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> <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"/> <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> <text class="cl" x="12" y="23" font-size="11" fill="#666">Service B</text>

12
theme/inc/theme-defaults.php
View File

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

2
theme/inc/theme-settings.php
View File

@@ -636,7 +636,7 @@ document.addEventListener('DOMContentLoaded', function() {
if (heroText) heroText.style.color = 'rgba(255,255,255,.8)'; if (heroText) heroText.style.color = 'rgba(255,255,255,.8)';
} }
if (btnP) { 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'; btnP.style.borderRadius = (get('oribi_radius_sm') || '6') + 'px';
} }
if (btnA) { if (btnA) {

12
theme/theme.json
View File

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