refactor: update theme color variables in CSS and DefaultPageLayout.php for improved customization and consistency

This commit is contained in:
Zack Spear
2025-04-04 20:08:09 -07:00
parent 33e4814937
commit ae52bda45a
6 changed files with 19 additions and 24 deletions

View File

@@ -57,26 +57,18 @@ function annotate($text) {echo "\n<!--\n",str_repeat("#",strlen($text)),"\n$text
<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/themes/{$theme}.css")?>">
<style>
:root {
<?if ($header):?>
--customer-header-text-color: #<?=$header?>;
<?endif;?>
<?if ($backgnd):?>
--customer-header-background-color: #<?=$backgnd?>;
<?endif;?>
}
<?if ($display['font']):?>
html{font-size:<?=$display['font']?>%}
<?endif;?>
<?if ($header):?>
#header,#header .logo,#header .text-right a{color:#<?=$header?>}
#header .block{background-color:transparent}
<?endif;?>
<?if ($backgnd):?>
#header{background-color:#<?=$backgnd?>}
<?if ($themeHelper->isTopNavTheme()):?>
.nav-tile{background-color:#<?=$backgnd?>}
<?if ($header):?>
.nav-item a,.nav-user a{color:#<?=$header?>}
.nav-item.active:after{background-color:#<?=$header?>}
<?endif;?>
<?endif;?>
<?endif;?>
<?
$nchan = ['webGui/nchan/notify_poller','webGui/nchan/session_check'];
if ($wlan0) $nchan[] = 'webGui/nchan/wlan0';

View File

@@ -366,7 +366,7 @@ textarea {
z-index: 102;
margin: 0;
color: var(--inverse-text-color);
background-color: var(--header-color);
background-color: var(--header-background-color);
background-size: 100% 90px;
background-repeat: no-repeat;
}
@@ -447,7 +447,7 @@ div.title.shift {
margin: 0;
font-size: 1.2rem;
letter-spacing: 1.8px;
background-color: var(--header-color);
background-color: var(--header-background-color);
white-space: nowrap;
overflow-x: auto;
overflow-y: hidden;
@@ -477,7 +477,7 @@ div.title.shift {
padding-bottom: 2px;
}
.nav-item a {
color: var(--inverse-text-color);
color: var(--header-text-color);
background-color: transparent;
text-transform: uppercase;
font-weight: bold;
@@ -1704,7 +1704,6 @@ span#wlan0 {
position: fixed;
height: 90px;
z-index: 100;
background-color: var(--mild-background-color);
border-bottom: 1px solid var(--gray-600);
box-sizing: border-box;
padding-left: 80px;

View File

@@ -64,7 +64,8 @@
--brand-orange: var(--orange-500);
--brand-red: var(--red-800);
--header-color: var(--gray-100);
--header-text-color: var(--customer-header-text-color, var(--inverse-text-color));
--header-background-color: var(--custom-header-background-color, var(--gray-100));
--title-header-background-color: var(--mild-background-color);

View File

@@ -46,7 +46,8 @@
--brand-orange: var(--orange-500);
--brand-red: var(--red-800);
--header-color: var(--gray-100);
--header-text-color: var(--customer-header-text-color, var(--inverse-text-color));
--header-background-color: var(--custom-header-background-color, var(--gray-100));
--title-header-background-color: var(--mild-background-color);

View File

@@ -58,7 +58,8 @@
--brand-orange: var(--orange-500);
--brand-red: var(--red-800);
--header-color: var(--gray-100);
--header-text-color: var(--customer-header-text-color, var(--inverse-text-color));
--header-background-color: var(--custom-header-background-color, var(--gray-100));
--title-header-background-color: var(--mild-background-color);

View File

@@ -47,7 +47,8 @@
--brand-orange: var(--orange-500);
--brand-red: var(--red-800);
--header-color: var(--gray-900);
--header-text-color: var(--customer-header-text-color, var(--inverse-text-color));
--header-background-color: var(--custom-header-background-color, var(--gray-900));
--title-header-background-color: var(--gray-150);