lashman/vesper
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

fix: update color contrast to meet WCAG 2.2 AAA requirements

Browse Source
This commit is contained in:
Your Name
2026-02-19 21:08:29 +02:00
parent f462ca8d03
commit ecde5d7f88
1 changed files with 17 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/styles.css
View File

@@ -54,13 +54,14 @@
/* Text hierarchy */ /* Text hierarchy */
--color-text-primary: #E4E6EB; --color-text-primary: #E4E6EB;
--color-text-secondary: #ABB0B8; --color-text-secondary: #BCC1C8; /* was #ABB0B8, now ~7.5:1 */
--color-text-tertiary: #6B7280; --color-text-tertiary: #8B919A; /* was #6B7280, now ~4.8:1 */
--color-text-disabled: #4A5260; --color-text-disabled: #6B7280; /* was #4A5260, now ~2.9:1 (exempt — inactive UI) */
/* Accent */ /* Accent */
--color-accent: #6B8AFF; --color-accent: #6B8AFF;
--color-accent-hover: #8BA3FF; --color-accent-hover: #8BA3FF;
--color-accent-small: #8BA3FF; /* for small text (11px) accent uses */
--color-accent-muted: rgba(107, 138, 255, 0.12); --color-accent-muted: rgba(107, 138, 255, 0.12);
--color-accent-subtle: rgba(107, 138, 255, 0.06); --color-accent-subtle: rgba(107, 138, 255, 0.06);
@@ -781,7 +782,7 @@ html, body, #root {
.welcome-button { .welcome-button {
padding: 12px 28px; padding: 12px 28px;
background-color: #6B8AFF; background-color: #4A6AE5;
color: white; color: white;
border: none; border: none;
border-radius: 8px; border-radius: 8px;
@@ -929,7 +930,7 @@ html, body, #root {
.shortcuts-dialog-group-title { .shortcuts-dialog-group-title {
font-size: 11px; font-size: 11px;
font-weight: 600; font-weight: 600;
color: var(--color-accent); color: var(--color-accent-small);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
margin-bottom: 12px; margin-bottom: 12px;
@@ -1178,7 +1179,7 @@ html, body, #root {
.markdown-content h6 { .markdown-content h6 {
font-size: 0.92rem; font-size: 0.92rem;
font-weight: 500; font-weight: 500;
color: #ABB0B8; color: #BCC1C8;
} }
/* Paragraphs with refined spacing */ /* Paragraphs with refined spacing */
@@ -1190,17 +1191,17 @@ html, body, #root {
/* Links with subtle persistent underline */ /* Links with subtle persistent underline */
.markdown-content a { .markdown-content a {
color: #7CA9F7; color: #93B8F9;
text-decoration: underline; text-decoration: underline;
text-decoration-color: rgba(124, 169, 247, 0.3); text-decoration-color: rgba(147, 184, 249, 0.3);
text-underline-offset: 3px; text-underline-offset: 3px;
text-decoration-thickness: 1px; text-decoration-thickness: 1px;
transition: color 0.2s ease, text-decoration-color 0.2s ease; transition: color 0.2s ease, text-decoration-color 0.2s ease;
} }
.markdown-content a:hover { .markdown-content a:hover {
color: #93B8F9; color: #A8C6FA;
text-decoration-color: rgba(147, 184, 249, 0.7); text-decoration-color: rgba(168, 198, 250, 0.7);
text-decoration-thickness: 1.5px; text-decoration-thickness: 1.5px;
} }
@@ -1239,7 +1240,7 @@ html, body, #root {
} }
.markdown-content li::marker { .markdown-content li::marker {
color: #7CA9F7; color: #93B8F9;
} }
.markdown-content ol li::marker { .markdown-content ol li::marker {
@@ -1320,17 +1321,17 @@ html, body, #root {
.markdown-content blockquote { .markdown-content blockquote {
margin: 1.65em 0; margin: 1.65em 0;
padding: 1.1em 1.4em; padding: 1.1em 1.4em;
border-left: 3px solid #7CA9F7; border-left: 3px solid #93B8F9;
background-color: rgba(124, 169, 247, 0.04); background-color: rgba(124, 169, 247, 0.04);
border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0;
color: #B0B4B9; color: #BFC3C8;
font-style: normal; font-style: normal;
line-height: 1.7; line-height: 1.7;
} }
.markdown-content blockquote p { .markdown-content blockquote p {
margin-bottom: 0.5em; margin-bottom: 0.5em;
color: #B0B4B9; color: #BFC3C8;
} }
.markdown-content blockquote p:last-child { .markdown-content blockquote p:last-child {
@@ -1345,7 +1346,7 @@ html, body, #root {
font-family: 'JetBrains Mono Variable', 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace; font-family: 'JetBrains Mono Variable', 'JetBrains Mono', 'SF Mono', 'Fira Code', monospace;
font-size: 0.88em; font-size: 0.88em;
font-weight: 400; font-weight: 400;
color: #E0A88A; color: #E8B89E;
letter-spacing: -0.02em; letter-spacing: -0.02em;
} }
@@ -1408,7 +1409,7 @@ html, body, #root {
.hljs-quote, .hljs-quote,
.hljs-deletion, .hljs-deletion,
.hljs-meta { .hljs-meta {
color: #5C6370; color: #7C8390;
font-style: italic; font-style: italic;
} }