Add CSS variable for code block background color
Now the code block background color can be used elsewhere without worrying about the colors getting out of sync.
This commit is contained in:
parent
536873ca26
commit
86c391081c
|
@ -6,7 +6,7 @@ Original by Dempfi (https://github.com/dempfi/ayu)
|
||||||
.hljs {
|
.hljs {
|
||||||
display: block;
|
display: block;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
background: #191f26;
|
background: var(--code-block-bg);
|
||||||
color: #e6e1cf;
|
color: #e6e1cf;
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
|
@ -28,6 +28,7 @@
|
||||||
--links: #0096cf;
|
--links: #0096cf;
|
||||||
|
|
||||||
--inline-code-color: #ffb454;
|
--inline-code-color: #ffb454;
|
||||||
|
--code-block-bg: #191f26;
|
||||||
|
|
||||||
--theme-popup-bg: #14191f;
|
--theme-popup-bg: #14191f;
|
||||||
--theme-popup-border: #5c6773;
|
--theme-popup-border: #5c6773;
|
||||||
|
@ -67,7 +68,8 @@
|
||||||
|
|
||||||
--links: #2b79a2;
|
--links: #2b79a2;
|
||||||
|
|
||||||
--inline-code-color: #c5c8c6;;
|
--inline-code-color: #c5c8c6;
|
||||||
|
--code-block-bg: #1d1f21;
|
||||||
|
|
||||||
--theme-popup-bg: #141617;
|
--theme-popup-bg: #141617;
|
||||||
--theme-popup-border: #43484d;
|
--theme-popup-border: #43484d;
|
||||||
|
@ -108,6 +110,7 @@
|
||||||
--links: #20609f;
|
--links: #20609f;
|
||||||
|
|
||||||
--inline-code-color: #301900;
|
--inline-code-color: #301900;
|
||||||
|
--code-block-bg: #f6f7f6;
|
||||||
|
|
||||||
--theme-popup-bg: #fafafa;
|
--theme-popup-bg: #fafafa;
|
||||||
--theme-popup-border: #cccccc;
|
--theme-popup-border: #cccccc;
|
||||||
|
@ -147,7 +150,8 @@
|
||||||
|
|
||||||
--links: #2b79a2;
|
--links: #2b79a2;
|
||||||
|
|
||||||
--inline-code-color: #c5c8c6;;
|
--inline-code-color: #c5c8c6;
|
||||||
|
--code-block-bg: #1d1f21;
|
||||||
|
|
||||||
--theme-popup-bg: #161923;
|
--theme-popup-bg: #161923;
|
||||||
--theme-popup-border: #737480;
|
--theme-popup-border: #737480;
|
||||||
|
@ -188,6 +192,7 @@
|
||||||
--links: #2b79a2;
|
--links: #2b79a2;
|
||||||
|
|
||||||
--inline-code-color: #6e6b5e;
|
--inline-code-color: #6e6b5e;
|
||||||
|
--code-block-bg: #f6f7f6;
|
||||||
|
|
||||||
--theme-popup-bg: #e1e1db;
|
--theme-popup-bg: #e1e1db;
|
||||||
--theme-popup-border: #b38f6b;
|
--theme-popup-border: #b38f6b;
|
||||||
|
@ -228,7 +233,8 @@
|
||||||
|
|
||||||
--links: #2b79a2;
|
--links: #2b79a2;
|
||||||
|
|
||||||
--inline-code-color: #c5c8c6;;
|
--inline-code-color: #c5c8c6;
|
||||||
|
--code-block-bg: #f6f7f6;
|
||||||
|
|
||||||
--theme-popup-bg: #141617;
|
--theme-popup-bg: #141617;
|
||||||
--theme-popup-border: #43484d;
|
--theme-popup-border: #43484d;
|
||||||
|
|
|
@ -59,7 +59,7 @@
|
||||||
.hljs {
|
.hljs {
|
||||||
display: block;
|
display: block;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
background: #f6f7f6;
|
background: var(--code-block-bg);
|
||||||
color: #000;
|
color: #000;
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
|
@ -79,7 +79,7 @@
|
||||||
.hljs {
|
.hljs {
|
||||||
display: block;
|
display: block;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
background: #1d1f21;
|
background: var(--code-block-bg);
|
||||||
color: #c5c8c6;
|
color: #c5c8c6;
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
-webkit-text-size-adjust: none;
|
-webkit-text-size-adjust: none;
|
||||||
|
|
Loading…
Reference in New Issue