Christoph/GitLite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases 46 Wiki Activity

chore(styles): adjust theme color tokens for ink and accent

Browse Source 
Update color token values in src/app.css. The change tweaks muted ink shades
and replaces the accent color hex, affecting primary/hero gradients and the
security-note icon color.

- Modified --color-ink-faint, --color-ink-dim, --color-ink-quiet in theme and
  light theme variants.
- Replaced --color-accent (#0f8fb5 -> #0c7691) and updated its uses in
  .btn-primary gradients, .cred-hero-icon gradient, and .cred-security-note svg.
This commit is contained in:
Christoph
2026-09-17 22:31:46 +02:00
parent 098e9c5fb9
commit e7303116a3
1 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app.css
+11 -11
View File
@@ -3,7 +3,7 @@
@theme {
--color-ink: #f0f1f2;
--color-ink-muted: #c1c3c6;
--color-ink-faint: #7f8389;
--color-ink-faint: #92979e;
--color-ink-dim: #9da1a6;
--color-ink-quiet: #aeb1b5;
@@ -73,9 +73,9 @@
:root[data-theme="light"] {
--color-ink: #172033;
--color-ink-muted: #475569;
--color-ink-faint: #728098;
--color-ink-dim: #5f6f89;
--color-ink-quiet: #66758d;
--color-ink-faint: #647287;
--color-ink-dim: #52607a;
--color-ink-quiet: #5c6a80;
--color-surface: rgba(255, 255, 255, 0.86);
--color-surface-alt: #f3f6fb;
@@ -90,7 +90,7 @@
--color-primary: #315fd6;
--color-primary-dark: #284cb4;
--color-accent: #0f8fb5;
--color-accent: #0c7691;
--color-bar: rgba(248, 251, 255, 0.94);
--color-bar-text: #172033;
@@ -6175,7 +6175,7 @@
:root[data-theme="light"] .btn-primary {
border-color: rgba(49, 95, 214, 0.72);
background: linear-gradient(135deg, #315fd6 0%, #0f8fb5 100%);
background: linear-gradient(135deg, #315fd6 0%, #0c7691 100%);
box-shadow: 0 10px 24px rgba(49, 95, 214, 0.18);
}
@@ -7366,7 +7366,7 @@ input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in s
:root[data-theme="light"] .cred-hero-icon {
border-color: rgba(49,95,214,0.2);
color: #ffffff;
background: linear-gradient(135deg, #4d8dff, #0f8fb5);
background: linear-gradient(135deg, #4d8dff, #0c7691);
box-shadow: 0 12px 26px rgba(49,95,214,0.2), inset 0 1px 0 rgba(255,255,255,0.24);
}
@@ -7380,7 +7380,7 @@ input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in s
background: rgba(15,143,181,0.07);
}
:root[data-theme="light"] .cred-security-note svg { color: #0f8fb5; }
:root[data-theme="light"] .cred-security-note svg { color: #0c7691; }
:root[data-theme="light"] .cred-body {
background: #ffffff;
@@ -8380,8 +8380,8 @@ input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in s
--app-settings-row-bg: #f8fafd;
--color-ink: #172033;
--color-ink-muted: #475569;
--color-ink-faint: #728098;
--color-ink-dim: #5f6f89;
--color-ink-faint: #647287;
--color-ink-dim: #52607a;
--color-surface: #ffffff;
--color-surface-alt: #f7f8fa;
--color-surface-dim: #f8f9fb;
@@ -8461,7 +8461,7 @@ input:focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in s
:root[data-theme="light"][data-appearance="classic"] .btn-primary {
border-color: rgba(49, 95, 214, 0.72);
color: #ffffff;
background: linear-gradient(135deg, #315fd6 0%, #0f8fb5 100%);
background: linear-gradient(135deg, #315fd6 0%, #0c7691 100%);
box-shadow: 0 10px 24px rgba(49, 95, 214, 0.18);
}