Skip to content

Commit f8b9054

Browse files
authored
Merge pull request #1470 from tim-seoss/light_theme_contrast_enhancement
Enhance text contrast of `light` theme to improve accessibility.
2 parents f26116a + 7f59fdd commit f8b9054

File tree

3 files changed

+30
-26
lines changed

3 files changed

+30
-26
lines changed

src/theme/css/chrome.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ a > .hljs {
9393
.menu-title {
9494
display: inline-block;
9595
font-weight: 200;
96-
font-size: 2rem;
96+
font-size: 2.4rem;
9797
line-height: var(--menu-bar-height);
9898
text-align: center;
9999
margin: 0;

src/theme/css/variables.css

+8-8
Original file line numberDiff line numberDiff line change
@@ -92,22 +92,22 @@
9292

9393
.light {
9494
--bg: hsl(0, 0%, 100%);
95-
--fg: #333333;
95+
--fg: hsl(0, 0%, 0%);
9696

9797
--sidebar-bg: #fafafa;
98-
--sidebar-fg: #364149;
98+
--sidebar-fg: hsl(0, 0%, 0%);
9999
--sidebar-non-existant: #aaaaaa;
100-
--sidebar-active: #008cff;
100+
--sidebar-active: #1f1fff;
101101
--sidebar-spacer: #f4f4f4;
102102

103-
--scrollbar: #cccccc;
103+
--scrollbar: #8F8F8F;
104104

105-
--icons: #cccccc;
106-
--icons-hover: #333333;
105+
--icons: #747474;
106+
--icons-hover: #000000;
107107

108-
--links: #4183c4;
108+
--links: #20609f;
109109

110-
--inline-code-color: #6e6b5e;
110+
--inline-code-color: #301900;
111111

112112
--theme-popup-bg: #fafafa;
113113
--theme-popup-border: #cccccc;

src/theme/highlight.css

+21-17
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,18 @@
1-
/* Base16 Atelier Dune Light - Theme */
2-
/* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune) */
3-
/* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */
1+
/*
2+
* An increased contrast highlighting scheme loosely based on the
3+
* "Base16 Atelier Dune Light" theme by Bram de Haan
4+
* (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune)
5+
* Original Base16 color scheme by Chris Kempson
6+
* (https://github.com/chriskempson/base16)
7+
*/
48

5-
/* Atelier-Dune Comment */
9+
/* Comment */
610
.hljs-comment,
711
.hljs-quote {
8-
color: #AAA;
12+
color: #575757;
913
}
1014

11-
/* Atelier-Dune Red */
15+
/* Red */
1216
.hljs-variable,
1317
.hljs-template-variable,
1418
.hljs-attribute,
@@ -19,44 +23,44 @@
1923
.hljs-name,
2024
.hljs-selector-id,
2125
.hljs-selector-class {
22-
color: #d73737;
26+
color: #d70025;
2327
}
2428

25-
/* Atelier-Dune Orange */
29+
/* Orange */
2630
.hljs-number,
2731
.hljs-meta,
2832
.hljs-built_in,
2933
.hljs-builtin-name,
3034
.hljs-literal,
3135
.hljs-type,
3236
.hljs-params {
33-
color: #b65611;
37+
color: #b21e00;
3438
}
3539

36-
/* Atelier-Dune Green */
40+
/* Green */
3741
.hljs-string,
3842
.hljs-symbol,
3943
.hljs-bullet {
40-
color: #60ac39;
44+
color: #008200;
4145
}
4246

43-
/* Atelier-Dune Blue */
47+
/* Blue */
4448
.hljs-title,
4549
.hljs-section {
46-
color: #6684e1;
50+
color: #0030f2;
4751
}
4852

49-
/* Atelier-Dune Purple */
53+
/* Purple */
5054
.hljs-keyword,
5155
.hljs-selector-tag {
52-
color: #b854d4;
56+
color: #9d00ec;
5357
}
5458

5559
.hljs {
5660
display: block;
5761
overflow-x: auto;
58-
background: #f1f1f1;
59-
color: #6e6b5e;
62+
background: #f6f7f6;
63+
color: #000;
6064
padding: 0.5em;
6165
}
6266

0 commit comments

Comments
 (0)