asandikci.com/web
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

Optimize code snippet background color

Browse source
This commit is contained in:
Cotes Chung 2020-12-18 20:24:14 +08:00
parent 5ffbfaec26
commit 260a906b11
2 changed files with 11 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
assets/css/_addon/syntax.scss
View file

@ -36,11 +36,11 @@ html[mode=dark] {
} }
%code-snippet-radius { %code-snippet-radius {
border-radius: 5px; border-radius: 6px;
} }
%code-snippet-padding { %code-snippet-padding {
padding: 0.8rem 1rem; padding: 1.5rem;
} }
$code-font-size: 0.85rem; $code-font-size: 0.85rem;
@ -69,8 +69,8 @@ div > pre {
overflow: auto; overflow: auto;
.lineno { .lineno {
margin: 0.8rem 0; margin-left: .2rem;
padding: 0 0.5rem; padding-right: .5rem;
min-width: 2.2rem; min-width: 2.2rem;
text-align: right; text-align: right;
color: var(--highlight-lineno-color); color: var(--highlight-lineno-color);
@ -131,8 +131,7 @@ code {
} }
td.rouge-code { td.rouge-code {
padding-left: 1rem; padding: 1.5rem 1.5rem 1.5rem 1rem;
padding-right: 1rem;
} }
/* Hide line numbers for default, console, and terminal code snippets */ /* Hide line numbers for default, console, and terminal code snippets */

12
assets/css/_colors/dark-syntax.scss
View file

@ -8,22 +8,22 @@
@mixin dark-syntax { @mixin dark-syntax {
/* ----- My styles ------ */ /* ----- My styles ------ */
--highlight-bg-color: #272822; --highlight-bg-color: #252525;
--highlighter-rouge-color: #de6b18; --highlighter-rouge-color: #de6b18;
--highlight-lineno-color: #6c6c6d; --highlight-lineno-color: #6c6c6d;
--highlight-lineno-border-color: #3c4042; --highlight-lineno-border-color: #303435;
--inline-code-bg: var(--highlight-bg-color); --inline-code-bg: #272822;
.highlight { .highlight {
.gp { color: #818c96; } .gp { color: #818c96; }
} }
pre { color: #818c96; } /* override Bootstrap */ pre { color: #bfbfbf; } /* override Bootstrap */
kbd { background-color: black; } kbd { background-color: black; }
/* syntax highlight colors from https://raw.githubusercontent.com/jwarby/pygments-css/master/monokai.css */ /* syntax highlight colors from https://raw.githubusercontent.com/jwarby/pygments-css/master/monokai.css */
.highlight pre { background-color: #272822; } .highlight pre { background-color: var(--highlight-bg-color); }
.highlight .hll { background-color: #272822; } .highlight .hll { background-color: var(--highlight-bg-color); }
.highlight .c { color: #75715e; } /* Comment */ .highlight .c { color: #75715e; } /* Comment */
.highlight .err { color: #960050; background-color: #1e0010; } /* Error */ .highlight .err { color: #960050; background-color: #1e0010; } /* Error */
.highlight .k { color: #66d9ef; } /* Keyword */ .highlight .k { color: #66d9ef; } /* Keyword */