diff --git a/public/assets/css/admin.css b/public/assets/css/admin.css index ef8a85e..435a665 100644 --- a/public/assets/css/admin.css +++ b/public/assets/css/admin.css @@ -11,6 +11,23 @@ min-height: 100vh; } +/* Keep admin header single-row like public header */ +.admin-body header nav { + overflow-x: auto; + white-space: nowrap; + scrollbar-width: thin; +} +.admin-body header nav > a, +.admin-body header nav ul { + flex-shrink: 0; +} +.admin-body header nav, +.admin-body header nav ul, +.admin-body header nav li { + list-style: none; + flex-wrap: nowrap; +} + .admin-body header nav ul [data-nav-logout] a { opacity: 0.6; } diff --git a/public/assets/css/common.css b/public/assets/css/common.css index 8ec11ee..13a9d6e 100644 --- a/public/assets/css/common.css +++ b/public/assets/css/common.css @@ -75,12 +75,10 @@ body > header { flex-shrink: 0; background: linear-gradient( 180deg, - var(--gradient-start) 0%, - var(--gradient-2) 20%, - var(--gradient-3) 40%, - var(--gradient-4) 60%, - var(--gradient-4) 88%, - var(--header-gradient-fade) 96% + var(--gradient-1) 0%, + var(--gradient-2) 33%, + var(--gradient-3) 66%, + var(--gradient-4) 100% ); } @@ -98,7 +96,9 @@ body > header nav { text-transform: uppercase; color: var(--accent-foreground); text-decoration: none; - text-shadow: 0 0 16px var(--header-shadow-strong), 0 0 32px var(--header-shadow-soft); + text-shadow: + 0 0 16px var(--header-shadow-strong), + 0 0 32px var(--header-shadow-soft); } .nav-left { @@ -147,7 +147,9 @@ body > header nav ul a { /* Subtle shadow on all header text to improve legibility against the gradient */ body > header nav > a, body > header nav ul a { - text-shadow: 0 0 16px var(--header-shadow-strong), 0 0 32px var(--header-shadow-soft); + text-shadow: + 0 0 16px var(--header-shadow-strong), + 0 0 32px var(--header-shadow-soft); } body > header nav ul a:hover { @@ -165,6 +167,13 @@ body > header nav ul a[aria-current="page"] { ============================================================ */ .header-search-wrap { padding: 0 0; + background-color: var(--gradient-4); + + background: linear-gradient( + 180deg, + var(--gradient-4) 0%, + #ffffffee 100% + ); } .header-search-wrap form[role="search"] { @@ -173,7 +182,7 @@ body > header nav ul a[aria-current="page"] { gap: var(--space-2xs); padding: var(--space-3xs) var(--space-s); border: 1px solid var(--accent-primary); - border-radius: 0; + border-radius: 10px; background: var(--bg-primary); width: 100%; color: var(--accent-primary); diff --git a/public/assets/css/main.css b/public/assets/css/main.css index 7c922f9..b1b25cd 100644 --- a/public/assets/css/main.css +++ b/public/assets/css/main.css @@ -126,8 +126,8 @@ .card__gradient-author { color: var(--accent-foreground); font-size: var(--step--2); - opacity: .85; - margin-bottom: .25rem; + opacity: 0.85; + margin-bottom: 0.25rem; display: block; } diff --git a/public/assets/css/variables.css b/public/assets/css/variables.css index d86d317..9ad8c3f 100644 --- a/public/assets/css/variables.css +++ b/public/assets/css/variables.css @@ -6,35 +6,35 @@ :root { --step--2: clamp(0.7813rem, 0.7736rem + 0.0341vw, 0.8rem); --step--1: clamp(0.9375rem, 0.9119rem + 0.1136vw, 1rem); - --step-0: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem); - --step-1: clamp(1.35rem, 1.2631rem + 0.3864vw, 1.5625rem); - --step-2: clamp(1.62rem, 1.4837rem + 0.6057vw, 1.9531rem); - --step-3: clamp(1.944rem, 1.7405rem + 0.9044vw, 2.4414rem); - --step-4: clamp(2.3328rem, 2.0387rem + 1.3072vw, 3.0518rem); - --step-5: clamp(2.7994rem, 2.384rem + 1.8461vw, 3.8147rem); + --step-0: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem); + --step-1: clamp(1.35rem, 1.2631rem + 0.3864vw, 1.5625rem); + --step-2: clamp(1.62rem, 1.4837rem + 0.6057vw, 1.9531rem); + --step-3: clamp(1.944rem, 1.7405rem + 0.9044vw, 2.4414rem); + --step-4: clamp(2.3328rem, 2.0387rem + 1.3072vw, 3.0518rem); + --step-5: clamp(2.7994rem, 2.384rem + 1.8461vw, 3.8147rem); } /* @link https://utopia.fyi/space/calculator?c=360,18,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */ :root { - --space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem); + --space-3xs: clamp(0.3125rem, 0.3125rem + 0vw, 0.3125rem); --space-2xs: clamp(0.5625rem, 0.5369rem + 0.1136vw, 0.625rem); - --space-xs: clamp(0.875rem, 0.8494rem + 0.1136vw, 0.9375rem); - --space-s: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem); - --space-m: clamp(1.6875rem, 1.6108rem + 0.3409vw, 1.875rem); - --space-l: clamp(2.25rem, 2.1477rem + 0.4545vw, 2.5rem); - --space-xl: clamp(3.375rem, 3.2216rem + 0.6818vw, 3.75rem); - --space-2xl: clamp(4.5rem, 4.2955rem + 0.9091vw, 5rem); - --space-3xl: clamp(6.75rem, 6.4432rem + 1.3636vw, 7.5rem); + --space-xs: clamp(0.875rem, 0.8494rem + 0.1136vw, 0.9375rem); + --space-s: clamp(1.125rem, 1.0739rem + 0.2273vw, 1.25rem); + --space-m: clamp(1.6875rem, 1.6108rem + 0.3409vw, 1.875rem); + --space-l: clamp(2.25rem, 2.1477rem + 0.4545vw, 2.5rem); + --space-xl: clamp(3.375rem, 3.2216rem + 0.6818vw, 3.75rem); + --space-2xl: clamp(4.5rem, 4.2955rem + 0.9091vw, 5rem); + --space-3xl: clamp(6.75rem, 6.4432rem + 1.3636vw, 7.5rem); /* One-up pairs */ --space-3xs-2xs: clamp(0.3125rem, 0.1847rem + 0.5682vw, 0.625rem); - --space-2xs-xs: clamp(0.5625rem, 0.4091rem + 0.6818vw, 0.9375rem); - --space-xs-s: clamp(0.875rem, 0.7216rem + 0.6818vw, 1.25rem); - --space-s-m: clamp(1.125rem, 0.8182rem + 1.3636vw, 1.875rem); - --space-m-l: clamp(1.6875rem, 1.3551rem + 1.4773vw, 2.5rem); - --space-l-xl: clamp(2.25rem, 1.6364rem + 2.7273vw, 3.75rem); - --space-xl-2xl: clamp(3.375rem, 2.7102rem + 2.9545vw, 5rem); - --space-2xl-3xl: clamp(4.5rem, 3.2727rem + 5.4545vw, 7.5rem); + --space-2xs-xs: clamp(0.5625rem, 0.4091rem + 0.6818vw, 0.9375rem); + --space-xs-s: clamp(0.875rem, 0.7216rem + 0.6818vw, 1.25rem); + --space-s-m: clamp(1.125rem, 0.8182rem + 1.3636vw, 1.875rem); + --space-m-l: clamp(1.6875rem, 1.3551rem + 1.4773vw, 2.5rem); + --space-l-xl: clamp(2.25rem, 1.6364rem + 2.7273vw, 3.75rem); + --space-xl-2xl: clamp(3.375rem, 2.7102rem + 2.9545vw, 5rem); + --space-2xl-3xl: clamp(4.5rem, 3.2727rem + 5.4545vw, 7.5rem); /* Custom pairs */ --space-s-l: clamp(1.125rem, 0.5625rem + 2.5vw, 2.5rem); @@ -42,80 +42,80 @@ :root { /* Fonts */ - --font-body: "BBBDMSans", sans-serif; + --font-body: "BBBDMSans", sans-serif; --font-display: "Ductus", sans-serif; /* Backgrounds */ - --bg-primary: #ffffff; + --bg-primary: #ffffff; --bg-secondary: #f5f5f5; - --bg-tertiary: #e8e8e8; - --bg-active: #d0d0d0; + --bg-tertiary: #e8e8e8; + --bg-active: #d0d0d0; /* Text */ - --text-primary: #111111; + --text-primary: #111111; --text-secondary: #666666; - --text-tertiary: #999999; + --text-tertiary: #999999; /* Borders */ - --border-primary: #dddddd; + --border-primary: #dddddd; --border-secondary: #cccccc; /* Status */ --success: #5cd69d; - --error: #f25a5a; + --error: #f25a5a; --warning: #fbca51; /* Accent */ - --accent-primary: #9557b5; - --accent-secondary: #683d7f; + --accent-primary: #9557b5; + --accent-secondary: #683d7f; --accent-foreground: #ffffff; - --accent-muted: rgba(149, 87, 181, 0.12); - --accent-blue: #41adff; - --accent-green: #4caf50; - --accent-yellow: #f39c12; - --accent-red: #f25a5a; + --accent-muted: rgba(149, 87, 181, 0.12); + --accent-blue: #41adff; + --accent-green: #4caf50; + --accent-yellow: #f39c12; + --accent-red: #f25a5a; /* Gradient (header) */ - --gradient-start: #3c856c; - --gradient-2: #60ecb4; - --gradient-3: #e390ff; - --gradient-4: #9557b5; + --gradient-1: #3c856c; + --gradient-2: #60ecb4; + --gradient-3: #e390ff; + --gradient-4: #9557b5; /* Header decorative */ - --header-gradient-fade: rgba(149, 87, 181, 0); - --header-shadow-strong: rgba(119, 70, 145, 1); - --header-shadow-soft: rgba(119, 70, 145, 0.8); + --header-gradient-fade: rgba(149, 87, 181, 0); + --header-shadow-strong: rgba(119, 70, 145, 1); + --header-shadow-soft: rgba(119, 70, 145, 0.8); --header-nav-active-border: rgba(255, 255, 255, 0.6); /* Search error block */ - --search-error-bg: #fff0f0; + --search-error-bg: #fff0f0; --search-error-border: #cc0000; - --search-error-color: #cc0000; + --search-error-color: #cc0000; /* System page — log/config syntax highlight */ - --sys-syntax-comment: #999999; + --sys-syntax-comment: #999999; --sys-syntax-directive: #1a6fb5; - --sys-syntax-block: #7a2fa0; - --sys-syntax-value: #a05c00; - --sys-syntax-location: #1a7a6b; - --sys-syntax-notice: #3a6ea8; - --sys-syntax-crit: #c0392b; + --sys-syntax-block: #7a2fa0; + --sys-syntax-value: #a05c00; + --sys-syntax-location: #1a7a6b; + --sys-syntax-notice: #3a6ea8; + --sys-syntax-crit: #c0392b; /* Muted alpha overlays — derived from semantic tokens */ - --success-muted-bg: rgba(92, 214, 157, 0.12); - --success-muted-border: rgba(92, 214, 157, 0.35); - --warning-muted-bg: rgba(251, 202, 81, 0.12); - --warning-muted-border: rgba(251, 202, 81, 0.35); - --error-muted-bg: rgba(242, 90, 90, 0.12); - --error-muted-border: rgba(242, 90, 90, 0.35); - --blue-muted-bg: rgba(65, 173, 255, 0.12); - --blue-muted-border: rgba(65, 173, 255, 0.30); - --blue-muted-bg-hover: rgba(65, 173, 255, 0.22); - --yellow-muted-bg: rgba(243, 156, 18, 0.12); - --yellow-muted-border: rgba(243, 156, 18, 0.30); - --yellow-muted-bg-hover:rgba(243, 156, 18, 0.22); - --green-muted-bg: rgba(76, 175, 80, 0.12); - --green-muted-border: rgba(76, 175, 80, 0.30); - --green-muted-bg-hover: rgba(76, 175, 80, 0.22); - --danger-border-muted: rgba(242, 90, 90, 0.35); + --success-muted-bg: rgba(92, 214, 157, 0.12); + --success-muted-border: rgba(92, 214, 157, 0.35); + --warning-muted-bg: rgba(251, 202, 81, 0.12); + --warning-muted-border: rgba(251, 202, 81, 0.35); + --error-muted-bg: rgba(242, 90, 90, 0.12); + --error-muted-border: rgba(242, 90, 90, 0.35); + --blue-muted-bg: rgba(65, 173, 255, 0.12); + --blue-muted-border: rgba(65, 173, 255, 0.30); + --blue-muted-bg-hover: rgba(65, 173, 255, 0.22); + --yellow-muted-bg: rgba(243, 156, 18, 0.12); + --yellow-muted-border: rgba(243, 156, 18, 0.30); + --yellow-muted-bg-hover: rgba(243, 156, 18, 0.22); + --green-muted-bg: rgba(76, 175, 80, 0.12); + --green-muted-border: rgba(76, 175, 80, 0.30); + --green-muted-bg-hover: rgba(76, 175, 80, 0.22); + --danger-border-muted: rgba(242, 90, 90, 0.35); } diff --git a/templates/header.php b/templates/header.php index 4c20032..1a738ca 100644 --- a/templates/header.php +++ b/templates/header.php @@ -55,6 +55,8 @@ $_thesisId = $_GET['id'] ?? null; + +