Solo-Web-Works/CWC
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

✨feature: Update navigation styles
Sync TODOs with Issues / sync_todos (push) Successful in 16s
Details

Browse Source 
Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
Keith Solomon
2026-05-09 14:35:16 -05:00
parent 405f43baf9
commit 9137fdb0f7
4 changed files with 78 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/show-template.php
+10 -8
View File
@@ -157,17 +157,19 @@ class ShowTemplate {
$fudge = isset( $get_footer ) ? $get_footer : $wp_footer; $fudge = isset( $get_footer ) ? $get_footer : $wp_footer;
// phpcs:disable
if ( $fudge === $this->template || $fudge === false ) { if ( $fudge === $this->template || $fudge === false ) {
echo wp_kses_post( "<!-- Active Template: {$this->template} -->\n" ); echo "<!-- Active Template: {$this->template} -->\n";
} else { } else {
echo esc_html( "<!--\n" ); echo "<!--\n";
echo esc_html( "The template loader logic has chosen a different template than what was used.\n\n" ); echo "The template loader logic has chosen a different template than what was used.\n\n";
echo esc_html( "Chosen Template: {$this->template}\n" ); echo "Chosen Template: {$this->template}\n";
echo esc_html( "Actual Template: $fudge\n\n" ); echo "Actual Template: $fudge\n\n";
echo esc_html( "This will usually occur if the template file was overriden using an action on template_redirect.\n" ); echo "This will usually occur if the template file was overriden using an action on template_redirect.\n";
echo esc_html( "This is a best effort guess to catch such scenarios as mentioned above but can be incorrect.\n" ); echo "This is a best effort guess to catch such scenarios as mentioned above but can be incorrect.\n";
echo esc_html( "-->\n" ); echo "-->\n";
} }
// phpcs:enable
} }
} }
styles/base/colors.css
+36 -33
View File
@@ -1,41 +1,44 @@
/* Theme color definitions */ /* Theme color definitions */
@theme { @theme inline {
--color-black: oklch(0% 0 0); --color-black: oklch(0% 0 0);
--color-white: oklch(100% 0 0); --color-white: oklch(100% 0 0);
--color-background: oklch(89.75% 0 0); --color-background: oklch(89.75% 0 0);
--color-text: var(--color-black); --color-text: var(--color-black);
--color-primary: oklch(0.57 0.203362 257.1706); --color-cwc-blue-01: oklch(47.31% 0.1141 242.9);
--color-primary-100: color-mix(in oklch, var(--color-primary) 10%, white); --color-cwc-blue-02: oklch(28.99% 0.0614 237.9);
--color-primary-200: color-mix(in oklch, var(--color-primary) 20%, white);
--color-primary-300: color-mix(in oklch, var(--color-primary) 30%, white);
--color-primary-400: color-mix(in oklch, var(--color-primary) 40%, white);
--color-primary-500: color-mix(in oklch, var(--color-primary) 50%, white);
--color-primary-600: color-mix(in oklch, var(--color-primary) 60%, white);
--color-primary-700: color-mix(in oklch, var(--color-primary) 70%, white);
--color-primary-800: color-mix(in oklch, var(--color-primary) 80%, white);
--color-primary-900: color-mix(in oklch, var(--color-primary) 90%, white);
--color-secondary: oklch(0.56 0.0176 257.23); --color-primary: var(--color-cwc-blue-01);
--color-secondary-100: color-mix(in oklch, var(--color-secondary) 10%, white); --color-primary-100: color-mix(in oklch, var(--color-primary) 10%, white);
--color-secondary-200: color-mix(in oklch, var(--color-secondary) 20%, white); --color-primary-200: color-mix(in oklch, var(--color-primary) 20%, white);
--color-secondary-300: color-mix(in oklch, var(--color-secondary) 30%, white); --color-primary-300: color-mix(in oklch, var(--color-primary) 30%, white);
--color-secondary-400: color-mix(in oklch, var(--color-secondary) 40%, white); --color-primary-400: color-mix(in oklch, var(--color-primary) 40%, white);
--color-secondary-500: color-mix(in oklch, var(--color-secondary) 50%, white); --color-primary-500: color-mix(in oklch, var(--color-primary) 50%, white);
--color-secondary-600: color-mix(in oklch, var(--color-secondary) 60%, white); --color-primary-600: color-mix(in oklch, var(--color-primary) 60%, white);
--color-secondary-700: color-mix(in oklch, var(--color-secondary) 70%, white); --color-primary-700: color-mix(in oklch, var(--color-primary) 70%, white);
--color-secondary-800: color-mix(in oklch, var(--color-secondary) 80%, white); --color-primary-800: color-mix(in oklch, var(--color-primary) 80%, white);
--color-secondary-900: color-mix(in oklch, var(--color-secondary) 90%, white); --color-primary-900: color-mix(in oklch, var(--color-primary) 90%, white);
--color-bodylinks: oklch(0.48 0.0789 211.58); --color-secondary: oklch(0.56 0.0176 257.23);
--color-footlinks: oklch(0.65 0.1104 212.2); --color-secondary-100: color-mix(in oklch, var(--color-secondary) 10%, white);
--color-secondary-200: color-mix(in oklch, var(--color-secondary) 20%, white);
--color-secondary-300: color-mix(in oklch, var(--color-secondary) 30%, white);
--color-secondary-400: color-mix(in oklch, var(--color-secondary) 40%, white);
--color-secondary-500: color-mix(in oklch, var(--color-secondary) 50%, white);
--color-secondary-600: color-mix(in oklch, var(--color-secondary) 60%, white);
--color-secondary-700: color-mix(in oklch, var(--color-secondary) 70%, white);
--color-secondary-800: color-mix(in oklch, var(--color-secondary) 80%, white);
--color-secondary-900: color-mix(in oklch, var(--color-secondary) 90%, white);
--color-success: oklch(64.01% 0.1751 146.7); --color-bodylinks: oklch(0.48 0.0789 211.58);
--color-info: oklch(0.55 0.0922 211.57); --color-footlinks: oklch(0.65 0.1104 212.2);
--color-warning: oklch(84.42% 0.1722 84.93);
--color-danger: oklch(0.5126 0.1865 22.61); --color-success: oklch(64.01% 0.1751 146.7);
--color-light: oklch(98.16% 0.0017 247.8); --color-info: oklch(0.55 0.0922 211.57);
--color-dark: oklch(34.51% 0.0133 248.2); --color-warning: oklch(84.42% 0.1722 84.93);
--color-danger: oklch(0.5126 0.1865 22.61);
--color-light: oklch(98.16% 0.0017 247.8);
--color-dark: oklch(34.51% 0.0133 248.2);
} }
styles/components/site-header.css
+2
View File
@@ -6,6 +6,8 @@
.header__nav-main { .header__nav-main {
max-width: 80.5rem; max-width: 80.5rem;
.nav-main { @apply self-stretch; }
} }
.nav-aux__container { .nav-aux__container {
styles/navigation/nav-main-default.css
+30 -10
View File
@@ -13,24 +13,41 @@
/* desktop */ /* desktop */
@media screen and (min-width: 62.5rem) { @media screen and (min-width: 62.5rem) {
.nav-main .menu-vdi { .nav-main .menu-vdi {
@apply flex items-end justify-end p-0 m-0; @apply flex items-center justify-end p-0 m-0 h-full;
>li { >li {
@apply h-full;
>a, >a,
>.menu-vdi__toggle { >.menu-vdi__toggle {
/* text styles */ /* text styles */
@apply font-semibold text-20px text-white hover:text-light no-underline leading-snug; @apply font-semibold text-20px text-white no-underline leading-snug whitespace-nowrap;
/* spacing & display */ /* spacing & display */
@apply mx-2 p-0 no-underline; @apply flex items-center px-4 -my-4 no-underline;
height: calc(100% + 2rem);
/* interaction */
&:hover {
@apply bg-cwc-blue-02 text-light;
box-shadow: inset 0 -4px 0 #F26B53;
}
} }
&.menu-vdi__item--contact { &.menu-vdi__item--contact {
@apply h-auto;
>a { >a {
@apply mr-0; @apply ml-2 mr-0 my-0;
height: auto;
background: linear-gradient(93.03deg, #F26B53 0%, #D24D32 100%); background: linear-gradient(93.03deg, #F26B53 0%, #D24D32 100%);
border-radius: 20px 4px; border-radius: 1.25rem 0.25rem;
padding: .5rem 2rem; padding: .5rem 2rem;
&:hover {
box-shadow: none;
background: linear-gradient(93.03deg, #F26B53 0%, #D24D32 100%);
}
} }
} }
} }
@@ -46,25 +63,28 @@
.menu-vdi__submenu { .menu-vdi__submenu {
top: calc(100% + 1rem); top: calc(100% + 1rem);
@apply bg-white shadow-lg left-4 w-64 flex-col; @apply bg-cwc-blue-02 shadow-lg left-4 w-64 flex-col;
>li { @apply w-full; } >li {
@apply w-full border-b border-[#D24D32];
&:last-child { @apply border-b-0; }
}
.menu-vdi__item { .menu-vdi__item {
/* text styles */ /* text styles */
@apply font-bold text-18px text-black hover:text-light no-underline leading-snug; @apply font-bold text-18px text-white no-underline leading-snug;
/* spacing & display */ /* spacing & display */
@apply block w-full; @apply block w-full;
/* interaction */ /* interaction */
@apply focus-visible:bg-secondary-200 hover:bg-secondary-200; @apply focus-visible:bg-cwc-blue-01 hover:bg-cwc-blue-01;
a { @apply block w-full; } a { @apply block w-full; }
} }
a.menu-vdi__item, a.menu-vdi__item,
.menu-vdi__item a { @apply p-4; } .menu-vdi__item a { @apply p-4 text-white; }
} }
} }
} }