doc: improve dark theme
This commit aims to fix some readability issues in regards to those are visually impaired, mainly colorblindness. - contrast of the fg/bg have been increased - link and text have been brightened - container objects (like the nav, <pre> background) contrast the primary background more. Signed-off-by: Evan Sarris <evan@theoryware.net>
This commit is contained in:
parent
5077c8381b
commit
8a7e6fe6ea
|
@ -180,26 +180,27 @@ html[data-theme='light'] {
|
||||||
html[data-theme='dark'] {
|
html[data-theme='dark'] {
|
||||||
/* basic theme */
|
/* basic theme */
|
||||||
--background: #222222;
|
--background: #222222;
|
||||||
--foreground: #c4c5c8;
|
--foreground: #DCDDDF;
|
||||||
--color0: #000300; /* black */
|
--color0: #000300; /* black */
|
||||||
--color1: #b44631; /* red */
|
--color1: #F3826C; /* red */
|
||||||
--color2: #6fc24e; /* green */
|
--color2: #6fc24e; /* green */
|
||||||
--color3: #cab14c; /* yellow */
|
--color3: #cab14c; /* yellow */
|
||||||
--color4: #59929d; /* blue */
|
--color4: #81A6C7; /* blue */
|
||||||
--color5: #926090; /* magenta */
|
--color5: #926090; /* magenta */
|
||||||
--color6: #668d96; /* cyan */
|
--color6: #668d96; /* cyan */
|
||||||
--color7: #728c8d; /* white */
|
--color7: #87A9AA; /* white */
|
||||||
--color8: #3f5f47; /* bright black */
|
--color8: #3f5f47; /* bright black */
|
||||||
--color9: #c1605d; /* bright red */
|
--color9: #c1605d; /* bright red */
|
||||||
--colorA: #a9c68e; /* bright green */
|
--colorA: #a9c68e; /* bright green */
|
||||||
--colorB: #decf50; /* bright yellow */
|
--colorB: #decf50; /* bright yellow */
|
||||||
--colorC: #a6bbcb; /* bright blue */
|
--colorC: #a6bbcb; /* bright blue */
|
||||||
--colorD: #ad79a2; /* bright magenta */
|
--colorD: #ad79a2; /* bright magenta */
|
||||||
--colorE: #8aa1af; /* bright cyan */
|
--colorE: #92ABBA; /* bright cyan */
|
||||||
--colorF: #bababa; /* bright white */
|
--colorF: #bababa; /* bright white */
|
||||||
|
|
||||||
/* extended ldoc theme */
|
/* extended ldoc theme */
|
||||||
--background-bright: #201e27;
|
--background-bright: #24242A;
|
||||||
|
--background-bright-alt: #28282F;
|
||||||
--color10: #c4c5c8;
|
--color10: #c4c5c8;
|
||||||
--color11: #00000044;
|
--color11: #00000044;
|
||||||
--color12: var(--color7);
|
--color12: var(--color7);
|
||||||
|
@ -213,16 +214,16 @@ html[data-theme='dark'] {
|
||||||
--color1A: var(--color6);
|
--color1A: var(--color6);
|
||||||
--color1B: #00bcd4;
|
--color1B: #00bcd4;
|
||||||
--color1C: #bababa;
|
--color1C: #bababa;
|
||||||
--color1D: #2c2a37;
|
--color1D: #333140;
|
||||||
--color1E: var(--color4);
|
--color1E: var(--color4);
|
||||||
--color1F: var(--colorE);
|
--color1F: var(--colorA);
|
||||||
--color20: var(--color13);
|
--color20: var(--color13);
|
||||||
--color21: var(--colorE);
|
--color21: var(--colorE);
|
||||||
--color22: var(--colorC);
|
--color22: var(--colorC);
|
||||||
--color23: var(--colorA);
|
--color23: var(--colorA);
|
||||||
--color24: var(--color1D);
|
--color24: var(--color1D);
|
||||||
--color25: var(--background-bright);
|
--color25: var(--background-bright-alt);
|
||||||
--color26: var(--background-bright);
|
--color26: var(--background-bright-alt);
|
||||||
--color27: var(--color1);
|
--color27: var(--color1);
|
||||||
--color28: var(--color23);
|
--color28: var(--color23);
|
||||||
--color29: var(--color20);
|
--color29: var(--color20);
|
||||||
|
@ -239,7 +240,7 @@ html[data-theme='dark'] {
|
||||||
--color40: var(--color1A);
|
--color40: var(--color1A);
|
||||||
|
|
||||||
/* source code theme */
|
/* source code theme */
|
||||||
--color100: var(--background-bright);
|
--color100: var(--background-bright-alt);
|
||||||
--color101: #512b1e;
|
--color101: #512b1e;
|
||||||
--color102: #844631;
|
--color102: #844631;
|
||||||
--color103: #a8660d;
|
--color103: #a8660d;
|
||||||
|
@ -255,7 +256,7 @@ html[data-theme='dark'] {
|
||||||
--color10D: #0e7c6b;
|
--color10D: #0e7c6b;
|
||||||
--color10E: #bbccaa;
|
--color10E: #bbccaa;
|
||||||
--color10F: #fedc56;
|
--color10F: #fedc56;
|
||||||
--color110: #ffffff;
|
--color110: #DCDDDF;
|
||||||
}
|
}
|
||||||
|
|
||||||
html[data-theme='monokai'] {
|
html[data-theme='monokai'] {
|
||||||
|
|
Loading…
Reference in New Issue