diff options
author | lonkaars <l.leblansch@gmail.com> | 2021-04-15 11:58:34 +0200 |
---|---|---|
committer | lonkaars <l.leblansch@gmail.com> | 2021-04-15 11:58:34 +0200 |
commit | e44490bc4b0d8d66da1be33415267cd2b17d83ab (patch) | |
tree | 82c5432681e6e5f7fa694d0474c0a1cb099813ce /styles | |
parent | baf935ebe929682eabff755a3b3b1e1448e252a5 (diff) |
added syntax highlighting :tada:
Diffstat (limited to 'styles')
-rw-r--r-- | styles/code.css | 50 | ||||
-rw-r--r-- | styles/colors.css | 6 |
2 files changed, 56 insertions, 0 deletions
diff --git a/styles/code.css b/styles/code.css new file mode 100644 index 0000000..5e87615 --- /dev/null +++ b/styles/code.css @@ -0,0 +1,50 @@ +.prismjs { padding: 6px; } + +pre { + background-color: var(--oxford-blue); + border-radius: 6px; +} + +.prismjs code { color: var(--magnolia); } + +.prismjs .token.comment +{ font-style: italic; } + +.prismjs .token.keyword, +.prismjs .token.annotation +{ font-weight: 700; } + +.prismjs .token.string, +.prismjs .token.number +{ color: var(--fg); } + +.prismjs .token.comment { + color: var(--heliotrope-gray); + opacity: .7; +} + +.prismjs .token.keyword +{ color: var(--fire-opal); } + +.prismjs .token.annotation +{ color: var(--cyan-process); } + +.prismjs .token.punctuation:not(.annotation) +.prismjs .token.operator +{ opacity: .8; } + +@media (prefers-color-scheme: light) { + pre { background-color: var(--heliotrope-gray); } + + .prismjs code { color: var(--fg); } + + .prismjs .token.string, + .prismjs .token.number + { opacity: .8; } + + .prismjs .token.comment { + color: var(--oxford-blue); + opacity: .4; + } +} + diff --git a/styles/colors.css b/styles/colors.css index 5cce897..f1978f4 100644 --- a/styles/colors.css +++ b/styles/colors.css @@ -5,7 +5,10 @@ --oxford-blue: #161B33; --xiketic: #0D0C1A; --magnolia: #EFE9F4; + --fire-opal: #EE6352; + --cyan-process: #08B2E3; + --forest-green-crayola: #57A773; --bg: var(--xiketic); --fg: var(--almond); @@ -15,7 +18,10 @@ :root { --heliotrope-gray: #c9c9dd; --purple-navy: #989abb; + --fire-opal: #ba3321; + --cyan-process: #397889; + --forest-green-crayola: #376848; --bg: var(--magnolia); --fg: var(--xiketic); |