mirror of
https://github.com/hyzendust/hyzendust.github.io.git
synced 2026-04-15 21:28:32 +02:00
Update: light mode colorscheme
This commit is contained in:
hyzen
@@ -1,4 +1,16 @@
|
|||||||
.breadcrumbs {
|
/* Menu links */
|
||||||
|
.menu__link {
|
||||||
|
color: var(--menu-color, var(--accent-color));
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme='light'] .menu__link {
|
||||||
|
color: var(--menu-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme='dark'] .menu__link {
|
||||||
|
color: var(--accent-color);
|
||||||
|
}
|
||||||
|
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@@ -58,8 +70,8 @@
|
|||||||
gap: 0.2rem;
|
gap: 0.2rem;
|
||||||
padding: 0.2rem 0.4rem;
|
padding: 0.2rem 0.4rem;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid #f26522;
|
border: 1px solid #ff3d3d;
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
font-size: 0.7rem;
|
font-size: 0.7rem;
|
||||||
font-weight: 340;
|
font-weight: 340;
|
||||||
@@ -96,27 +108,22 @@
|
|||||||
color: var(--foreground-color) !important;
|
color: var(--foreground-color) !important;
|
||||||
}
|
}
|
||||||
[data-theme='light'] .rss-subscribe__link {
|
[data-theme='light'] .rss-subscribe__link {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
[data-theme='light'] .rss-subscribe__link:hover,
|
[data-theme='light'] .rss-subscribe__link:hover,
|
||||||
[data-theme='light'] .rss-subscribe__link:focus {
|
[data-theme='light'] .rss-subscribe__link:focus {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #f26522 !important;
|
color: #ff3d3d !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.rss-subscribe__link:hover,
|
.rss-subscribe__link:hover,
|
||||||
.rss-subscribe__link:focus {
|
.rss-subscribe__link:focus {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #f26522 !important;
|
color: #ff3d3d !important;
|
||||||
}
|
|
||||||
|
|
||||||
.rss-subscribe__link:hover {
|
|
||||||
background-color: transparent;
|
|
||||||
color: var(--foreground-color) !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.rss-subscribe__link svg {
|
.rss-subscribe__link svg {
|
||||||
@@ -272,9 +279,9 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid #f26522;
|
border: 1px solid #ff3d3d;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
color: #f26522;
|
color: #ff3d3d;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
transition:
|
transition:
|
||||||
@@ -283,7 +290,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.brand__mobile-toggle:hover {
|
.brand__mobile-toggle:hover {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -307,12 +314,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
[data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle {
|
[data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
@media (prefers-color-scheme: light) {
|
@media (prefers-color-scheme: light) {
|
||||||
.brand__mobile-check:checked ~ .brand__mobile-toggle {
|
.brand__mobile-check:checked ~ .brand__mobile-toggle {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -352,11 +359,11 @@
|
|||||||
|
|
||||||
[data-theme='light'] .brand__mobile-toggle {
|
[data-theme='light'] .brand__mobile-toggle {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #f26522;
|
color: #ff3d3d;
|
||||||
}
|
}
|
||||||
[data-theme='light'] .brand__mobile-toggle:hover {
|
[data-theme='light'] .brand__mobile-toggle:hover {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
[data-theme='dark'] .brand__mobile-toggle {
|
[data-theme='dark'] .brand__mobile-toggle {
|
||||||
@@ -435,9 +442,10 @@
|
|||||||
[data-theme='light'] {
|
[data-theme='light'] {
|
||||||
--background-color: #fff;
|
--background-color: #fff;
|
||||||
--background-color1: #777;
|
--background-color1: #777;
|
||||||
--foreground-color: #000000f4;
|
--foreground-color: #000000e1;
|
||||||
--foreground-color3: #665c54;
|
--foreground-color3: #665c54;
|
||||||
--accent-color: #00000094;
|
--accent-color: #1133e9c5;
|
||||||
|
--menu-color: #000000ae;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Force dark theme */
|
/* Force dark theme */
|
||||||
|
|||||||
@@ -1,774 +0,0 @@
|
|||||||
/*
|
|
||||||
Styles are mobile-first. Desktop styles are wrapped in media queries.
|
|
||||||
Naming convention: BEM (Block, Element, Modifier). When it's difficult to add classes, I will use tag names.
|
|
||||||
*/
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box; }
|
|
||||||
|
|
||||||
.body {
|
|
||||||
margin: 0; }
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none; }
|
|
||||||
|
|
||||||
.menu__list,
|
|
||||||
.translation-list,
|
|
||||||
.pagination {
|
|
||||||
list-style-type: none;
|
|
||||||
padding-inline-start: 0; }
|
|
||||||
|
|
||||||
ul:has(> li > input[type="checkbox"]) {
|
|
||||||
list-style-type: none;
|
|
||||||
padding-inline-start: 1em; }
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
margin: 0; }
|
|
||||||
|
|
||||||
.body {
|
|
||||||
margin-left: 16px;
|
|
||||||
margin-right: 16px; }
|
|
||||||
|
|
||||||
@media (min-width: 800px) {
|
|
||||||
.body {
|
|
||||||
width: 768px;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto; } }
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--background-color: #171414;
|
|
||||||
--background-color1: #fff;
|
|
||||||
--foreground-color: #e3e1db;
|
|
||||||
--foreground-color3: #ccc3b3;
|
|
||||||
--accent-color: #fff; }
|
|
||||||
|
|
||||||
@media (prefers-color-scheme: light) {
|
|
||||||
:root {
|
|
||||||
--background-color: #fbf1c7;
|
|
||||||
--background-color1: #ebdbb2;
|
|
||||||
--foreground-color: #3c3836;
|
|
||||||
--foreground-color3: #665c54;
|
|
||||||
--accent-color: #af3a03; } }
|
|
||||||
|
|
||||||
.body {
|
|
||||||
background-color: var(--background-color);
|
|
||||||
color: var(--foreground-color); }
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
color: var(--foreground-color); }
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: var(--accent-color); }
|
|
||||||
|
|
||||||
.header {
|
|
||||||
border-bottom: 1px solid var(--background-color1); }
|
|
||||||
|
|
||||||
.brand {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 6.9px;
|
|
||||||
margin-bottom: -18px; }
|
|
||||||
|
|
||||||
.brand img {
|
|
||||||
height: 37px;
|
|
||||||
padding: 0px; }
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
border-top: 1px solid var(--background-color1); }
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
background-color: var(--background-color1); }
|
|
||||||
[dir=rtl] blockquote {
|
|
||||||
border-right: 0.5rem solid var(--accent-color); }
|
|
||||||
[dir=ltr] blockquote {
|
|
||||||
border-left: 0.5rem solid var(--accent-color); }
|
|
||||||
|
|
||||||
:not(pre) > code {
|
|
||||||
background-color: var(--background-color1); }
|
|
||||||
|
|
||||||
hr {
|
|
||||||
background: var(--background-color1); }
|
|
||||||
|
|
||||||
table {
|
|
||||||
background-color: var(--background-color1); }
|
|
||||||
|
|
||||||
td,
|
|
||||||
th {
|
|
||||||
border: 1px solid var(--background-color); }
|
|
||||||
|
|
||||||
figcaption {
|
|
||||||
color: var(--foreground-color3); }
|
|
||||||
|
|
||||||
/* Background */
|
|
||||||
.bg {
|
|
||||||
color: #3c3836;
|
|
||||||
background-color: #fbf1c7; }
|
|
||||||
|
|
||||||
/* PreWrapper */
|
|
||||||
.chroma {
|
|
||||||
color: #3c3836;
|
|
||||||
background-color: #fbf1c7; }
|
|
||||||
|
|
||||||
/* Other */
|
|
||||||
/* Error */
|
|
||||||
/* CodeLine */
|
|
||||||
/* LineLink */
|
|
||||||
.chroma .lnlinks {
|
|
||||||
outline: none;
|
|
||||||
text-decoration: none;
|
|
||||||
color: inherit; }
|
|
||||||
|
|
||||||
/* LineTableTD */
|
|
||||||
.chroma .lntd {
|
|
||||||
vertical-align: top;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
border: 0; }
|
|
||||||
|
|
||||||
/* LineTable */
|
|
||||||
.chroma .lntable {
|
|
||||||
border-spacing: 0;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
border: 0; }
|
|
||||||
|
|
||||||
/* LineHighlight */
|
|
||||||
.chroma .hl {
|
|
||||||
background-color: #e1d8b3; }
|
|
||||||
|
|
||||||
/* LineNumbersTable */
|
|
||||||
.chroma .lnt {
|
|
||||||
white-space: pre;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
margin-right: 0.4em;
|
|
||||||
padding: 0 0.4em 0 0.4em;
|
|
||||||
color: #9d9b9a; }
|
|
||||||
|
|
||||||
/* LineNumbers */
|
|
||||||
.chroma .ln {
|
|
||||||
white-space: pre;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
margin-right: 0.4em;
|
|
||||||
padding: 0 0.4em 0 0.4em;
|
|
||||||
color: #9d9b9a; }
|
|
||||||
|
|
||||||
/* Line */
|
|
||||||
.chroma .line {
|
|
||||||
display: flex; }
|
|
||||||
|
|
||||||
/* Keyword */
|
|
||||||
.chroma .k {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* KeywordConstant */
|
|
||||||
.chroma .kc {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* KeywordDeclaration */
|
|
||||||
.chroma .kd {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* KeywordNamespace */
|
|
||||||
.chroma .kn {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* KeywordPseudo */
|
|
||||||
.chroma .kp {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* KeywordReserved */
|
|
||||||
.chroma .kr {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* KeywordType */
|
|
||||||
.chroma .kt {
|
|
||||||
color: #b57614; }
|
|
||||||
|
|
||||||
/* Name */
|
|
||||||
/* NameAttribute */
|
|
||||||
.chroma .na {
|
|
||||||
color: #79740e;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* NameBuiltin */
|
|
||||||
.chroma .nb {
|
|
||||||
color: #b57614; }
|
|
||||||
|
|
||||||
/* NameBuiltinPseudo */
|
|
||||||
/* NameClass */
|
|
||||||
/* NameConstant */
|
|
||||||
.chroma .no {
|
|
||||||
color: #d3869b; }
|
|
||||||
|
|
||||||
/* NameDecorator */
|
|
||||||
/* NameEntity */
|
|
||||||
.chroma .ni {
|
|
||||||
color: #b57614; }
|
|
||||||
|
|
||||||
/* NameException */
|
|
||||||
.chroma .ne {
|
|
||||||
color: #fb4934; }
|
|
||||||
|
|
||||||
/* NameFunction */
|
|
||||||
.chroma .nf {
|
|
||||||
color: #b57614; }
|
|
||||||
|
|
||||||
/* NameFunctionMagic */
|
|
||||||
/* NameLabel */
|
|
||||||
.chroma .nl {
|
|
||||||
color: #9d0006; }
|
|
||||||
|
|
||||||
/* NameNamespace */
|
|
||||||
/* NameOther */
|
|
||||||
/* NameProperty */
|
|
||||||
/* NameTag */
|
|
||||||
.chroma .nt {
|
|
||||||
color: #9d0006; }
|
|
||||||
|
|
||||||
/* NameVariable */
|
|
||||||
/* NameVariableClass */
|
|
||||||
/* NameVariableGlobal */
|
|
||||||
/* NameVariableInstance */
|
|
||||||
/* NameVariableMagic */
|
|
||||||
/* Literal */
|
|
||||||
/* LiteralDate */
|
|
||||||
/* LiteralString */
|
|
||||||
.chroma .s {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringAffix */
|
|
||||||
.chroma .sa {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringBacktick */
|
|
||||||
.chroma .sb {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringChar */
|
|
||||||
.chroma .sc {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringDelimiter */
|
|
||||||
.chroma .dl {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringDoc */
|
|
||||||
.chroma .sd {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringDouble */
|
|
||||||
.chroma .s2 {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringEscape */
|
|
||||||
.chroma .se {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringHeredoc */
|
|
||||||
.chroma .sh {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringInterpol */
|
|
||||||
.chroma .si {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringOther */
|
|
||||||
.chroma .sx {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringRegex */
|
|
||||||
.chroma .sr {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringSingle */
|
|
||||||
.chroma .s1 {
|
|
||||||
color: #79740e; }
|
|
||||||
|
|
||||||
/* LiteralStringSymbol */
|
|
||||||
.chroma .ss {
|
|
||||||
color: #076678; }
|
|
||||||
|
|
||||||
/* LiteralNumber */
|
|
||||||
.chroma .m {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* LiteralNumberBin */
|
|
||||||
.chroma .mb {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* LiteralNumberFloat */
|
|
||||||
.chroma .mf {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* LiteralNumberHex */
|
|
||||||
.chroma .mh {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* LiteralNumberInteger */
|
|
||||||
.chroma .mi {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* LiteralNumberIntegerLong */
|
|
||||||
.chroma .il {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* LiteralNumberOct */
|
|
||||||
.chroma .mo {
|
|
||||||
color: #8f3f71; }
|
|
||||||
|
|
||||||
/* Operator */
|
|
||||||
.chroma .o {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* OperatorWord */
|
|
||||||
.chroma .ow {
|
|
||||||
color: #af3a03; }
|
|
||||||
|
|
||||||
/* Punctuation */
|
|
||||||
/* Comment */
|
|
||||||
.chroma .c {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
|
|
||||||
/* CommentHashbang */
|
|
||||||
.chroma .ch {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
|
|
||||||
/* CommentMultiline */
|
|
||||||
.chroma .cm {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
|
|
||||||
/* CommentSingle */
|
|
||||||
.chroma .c1 {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
|
|
||||||
/* CommentSpecial */
|
|
||||||
.chroma .cs {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
|
|
||||||
/* CommentPreproc */
|
|
||||||
.chroma .cp {
|
|
||||||
color: #427b58; }
|
|
||||||
|
|
||||||
/* CommentPreprocFile */
|
|
||||||
.chroma .cpf {
|
|
||||||
color: #427b58;
|
|
||||||
font-style: italic; }
|
|
||||||
|
|
||||||
/* Generic */
|
|
||||||
/* GenericDeleted */
|
|
||||||
.chroma .gd {
|
|
||||||
color: #282828;
|
|
||||||
background-color: #9d0006; }
|
|
||||||
|
|
||||||
/* GenericEmph */
|
|
||||||
.chroma .ge {
|
|
||||||
color: #076678;
|
|
||||||
text-decoration: underline; }
|
|
||||||
|
|
||||||
/* GenericError */
|
|
||||||
.chroma .gr {
|
|
||||||
background-color: #9d0006;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* GenericHeading */
|
|
||||||
.chroma .gh {
|
|
||||||
color: #79740e;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* GenericInserted */
|
|
||||||
.chroma .gi {
|
|
||||||
color: #282828;
|
|
||||||
background-color: #79740e; }
|
|
||||||
|
|
||||||
/* GenericOutput */
|
|
||||||
.chroma .go {
|
|
||||||
color: #504945; }
|
|
||||||
|
|
||||||
/* GenericPrompt */
|
|
||||||
/* GenericStrong */
|
|
||||||
/* GenericSubheading */
|
|
||||||
.chroma .gu {
|
|
||||||
color: #79740e;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* GenericTraceback */
|
|
||||||
.chroma .gt {
|
|
||||||
background-color: #3c3836;
|
|
||||||
font-weight: bold; }
|
|
||||||
|
|
||||||
/* GenericUnderline */
|
|
||||||
/* TextWhitespace */
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
/* Background */
|
|
||||||
.bg {
|
|
||||||
color: #ebdbb2;
|
|
||||||
background-color: #282828; }
|
|
||||||
/* PreWrapper */
|
|
||||||
.chroma {
|
|
||||||
color: #ebdbb2;
|
|
||||||
background-color: #282828; }
|
|
||||||
/* Other */
|
|
||||||
/* Error */
|
|
||||||
/* CodeLine */
|
|
||||||
/* LineLink */
|
|
||||||
.chroma .lnlinks {
|
|
||||||
outline: none;
|
|
||||||
text-decoration: none;
|
|
||||||
color: inherit; }
|
|
||||||
/* LineTableTD */
|
|
||||||
.chroma .lntd {
|
|
||||||
vertical-align: top;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
border: 0; }
|
|
||||||
/* LineTable */
|
|
||||||
.chroma .lntable {
|
|
||||||
border-spacing: 0;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
border: 0; }
|
|
||||||
/* LineHighlight */
|
|
||||||
.chroma .hl {
|
|
||||||
background-color: #3d3d3d; }
|
|
||||||
/* LineNumbersTable */
|
|
||||||
.chroma .lnt {
|
|
||||||
white-space: pre;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
margin-right: 0.4em;
|
|
||||||
padding: 0 0.4em 0 0.4em;
|
|
||||||
color: #756d59; }
|
|
||||||
/* LineNumbers */
|
|
||||||
.chroma .ln {
|
|
||||||
white-space: pre;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
margin-right: 0.4em;
|
|
||||||
padding: 0 0.4em 0 0.4em;
|
|
||||||
color: #756d59; }
|
|
||||||
/* Line */
|
|
||||||
.chroma .line {
|
|
||||||
display: flex; }
|
|
||||||
/* Keyword */
|
|
||||||
.chroma .k {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* KeywordConstant */
|
|
||||||
.chroma .kc {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* KeywordDeclaration */
|
|
||||||
.chroma .kd {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* KeywordNamespace */
|
|
||||||
.chroma .kn {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* KeywordPseudo */
|
|
||||||
.chroma .kp {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* KeywordReserved */
|
|
||||||
.chroma .kr {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* KeywordType */
|
|
||||||
.chroma .kt {
|
|
||||||
color: #fabd2f; }
|
|
||||||
/* Name */
|
|
||||||
/* NameAttribute */
|
|
||||||
.chroma .na {
|
|
||||||
color: #b8bb26;
|
|
||||||
font-weight: bold; }
|
|
||||||
/* NameBuiltin */
|
|
||||||
.chroma .nb {
|
|
||||||
color: #fabd2f; }
|
|
||||||
/* NameBuiltinPseudo */
|
|
||||||
/* NameClass */
|
|
||||||
/* NameConstant */
|
|
||||||
.chroma .no {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* NameDecorator */
|
|
||||||
/* NameEntity */
|
|
||||||
.chroma .ni {
|
|
||||||
color: #fabd2f; }
|
|
||||||
/* NameException */
|
|
||||||
.chroma .ne {
|
|
||||||
color: #fb4934; }
|
|
||||||
/* NameFunction */
|
|
||||||
.chroma .nf {
|
|
||||||
color: #fabd2f; }
|
|
||||||
/* NameFunctionMagic */
|
|
||||||
/* NameLabel */
|
|
||||||
.chroma .nl {
|
|
||||||
color: #fb4934; }
|
|
||||||
/* NameNamespace */
|
|
||||||
/* NameOther */
|
|
||||||
/* NameProperty */
|
|
||||||
/* NameTag */
|
|
||||||
.chroma .nt {
|
|
||||||
color: #fb4934; }
|
|
||||||
/* NameVariable */
|
|
||||||
/* NameVariableClass */
|
|
||||||
/* NameVariableGlobal */
|
|
||||||
/* NameVariableInstance */
|
|
||||||
/* NameVariableMagic */
|
|
||||||
/* Literal */
|
|
||||||
/* LiteralDate */
|
|
||||||
/* LiteralString */
|
|
||||||
.chroma .s {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringAffix */
|
|
||||||
.chroma .sa {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringBacktick */
|
|
||||||
.chroma .sb {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringChar */
|
|
||||||
.chroma .sc {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringDelimiter */
|
|
||||||
.chroma .dl {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringDoc */
|
|
||||||
.chroma .sd {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringDouble */
|
|
||||||
.chroma .s2 {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringEscape */
|
|
||||||
.chroma .se {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringHeredoc */
|
|
||||||
.chroma .sh {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringInterpol */
|
|
||||||
.chroma .si {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringOther */
|
|
||||||
.chroma .sx {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringRegex */
|
|
||||||
.chroma .sr {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringSingle */
|
|
||||||
.chroma .s1 {
|
|
||||||
color: #b8bb26; }
|
|
||||||
/* LiteralStringSymbol */
|
|
||||||
.chroma .ss {
|
|
||||||
color: #83a598; }
|
|
||||||
/* LiteralNumber */
|
|
||||||
.chroma .m {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* LiteralNumberBin */
|
|
||||||
.chroma .mb {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* LiteralNumberFloat */
|
|
||||||
.chroma .mf {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* LiteralNumberHex */
|
|
||||||
.chroma .mh {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* LiteralNumberInteger */
|
|
||||||
.chroma .mi {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* LiteralNumberIntegerLong */
|
|
||||||
.chroma .il {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* LiteralNumberOct */
|
|
||||||
.chroma .mo {
|
|
||||||
color: #d3869b; }
|
|
||||||
/* Operator */
|
|
||||||
.chroma .o {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* OperatorWord */
|
|
||||||
.chroma .ow {
|
|
||||||
color: #fe8019; }
|
|
||||||
/* Punctuation */
|
|
||||||
/* Comment */
|
|
||||||
.chroma .c {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
/* CommentHashbang */
|
|
||||||
.chroma .ch {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
/* CommentMultiline */
|
|
||||||
.chroma .cm {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
/* CommentSingle */
|
|
||||||
.chroma .c1 {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
/* CommentSpecial */
|
|
||||||
.chroma .cs {
|
|
||||||
color: #928374;
|
|
||||||
font-style: italic; }
|
|
||||||
/* CommentPreproc */
|
|
||||||
.chroma .cp {
|
|
||||||
color: #8ec07c; }
|
|
||||||
/* CommentPreprocFile */
|
|
||||||
.chroma .cpf {
|
|
||||||
color: #8ec07c;
|
|
||||||
font-style: italic; }
|
|
||||||
/* Generic */
|
|
||||||
/* GenericDeleted */
|
|
||||||
.chroma .gd {
|
|
||||||
color: #282828;
|
|
||||||
background-color: #fb4934; }
|
|
||||||
/* GenericEmph */
|
|
||||||
.chroma .ge {
|
|
||||||
color: #83a598;
|
|
||||||
text-decoration: underline; }
|
|
||||||
/* GenericError */
|
|
||||||
.chroma .gr {
|
|
||||||
background-color: #fb4934;
|
|
||||||
font-weight: bold; }
|
|
||||||
/* GenericHeading */
|
|
||||||
.chroma .gh {
|
|
||||||
color: #b8bb26;
|
|
||||||
font-weight: bold; }
|
|
||||||
/* GenericInserted */
|
|
||||||
.chroma .gi {
|
|
||||||
color: #282828;
|
|
||||||
background-color: #b8bb26; }
|
|
||||||
/* GenericOutput */
|
|
||||||
.chroma .go {
|
|
||||||
color: #504945; }
|
|
||||||
/* GenericPrompt */
|
|
||||||
/* GenericStrong */
|
|
||||||
/* GenericSubheading */
|
|
||||||
.chroma .gu {
|
|
||||||
color: #b8bb26;
|
|
||||||
font-weight: bold; }
|
|
||||||
/* GenericTraceback */
|
|
||||||
.chroma .gt {
|
|
||||||
background-color: #fb4934;
|
|
||||||
font-weight: bold; }
|
|
||||||
/* GenericUnderline */
|
|
||||||
/* TextWhitespace */ }
|
|
||||||
|
|
||||||
pre:not(.chroma),
|
|
||||||
.bg,
|
|
||||||
.chroma,
|
|
||||||
.highlight {
|
|
||||||
background-color: var(--background-color1); }
|
|
||||||
|
|
||||||
.html {
|
|
||||||
font-size: 18px; }
|
|
||||||
|
|
||||||
.body {
|
|
||||||
font-family: sans-serif;
|
|
||||||
line-height: 1.5; }
|
|
||||||
|
|
||||||
p,
|
|
||||||
ul,
|
|
||||||
ol,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
overflow-wrap: break-word; }
|
|
||||||
|
|
||||||
.toc {
|
|
||||||
margin-block: 1rem; }
|
|
||||||
.toc__summary {
|
|
||||||
font-weight: bolder;
|
|
||||||
cursor: pointer; }
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
padding: 0.5rem; }
|
|
||||||
|
|
||||||
hr {
|
|
||||||
border: none;
|
|
||||||
height: 1px; }
|
|
||||||
|
|
||||||
figure {
|
|
||||||
margin-inline: 0; }
|
|
||||||
|
|
||||||
.heading__anchor {
|
|
||||||
display: none; }
|
|
||||||
|
|
||||||
.heading:hover > .heading__anchor {
|
|
||||||
display: inline; }
|
|
||||||
|
|
||||||
.table-wrapper {
|
|
||||||
overflow-x: auto;
|
|
||||||
margin-block: 1rem; }
|
|
||||||
.table-wrapper > table {
|
|
||||||
word-break: keep-all;
|
|
||||||
border-collapse: collapse; }
|
|
||||||
.table-wrapper > table td,
|
|
||||||
.table-wrapper > table th {
|
|
||||||
padding: 0.5rem;
|
|
||||||
text-align: start; }
|
|
||||||
|
|
||||||
svg,
|
|
||||||
img,
|
|
||||||
video,
|
|
||||||
iframe {
|
|
||||||
max-width: 100%; }
|
|
||||||
|
|
||||||
.menu__list {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
gap: 0.5rem;
|
|
||||||
flex-wrap: wrap; }
|
|
||||||
|
|
||||||
.menu__link--active {
|
|
||||||
font-weight: bolder; }
|
|
||||||
|
|
||||||
.pagination {
|
|
||||||
display: flex;
|
|
||||||
gap: 1rem; }
|
|
||||||
|
|
||||||
.page-item.active {
|
|
||||||
font-weight: bolder; }
|
|
||||||
|
|
||||||
.page-nav {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-block: 1rem; }
|
|
||||||
|
|
||||||
.section-post-title,
|
|
||||||
.term-post-title {
|
|
||||||
margin-block-start: 0; }
|
|
||||||
|
|
||||||
.home-post-title {
|
|
||||||
margin-block-end: 0; }
|
|
||||||
|
|
||||||
.summary {
|
|
||||||
margin-block-start: 0; }
|
|
||||||
|
|
||||||
:not(pre) > code {
|
|
||||||
padding-inline: 0.25rem; }
|
|
||||||
|
|
||||||
div.highlight {
|
|
||||||
overflow-x: auto;
|
|
||||||
margin-block: 1rem; }
|
|
||||||
div.highlight > div.chroma > table.lntable {
|
|
||||||
padding-inline-end: 0.4rem; }
|
|
||||||
div.highlight > pre.chroma {
|
|
||||||
padding-inline: 0.4rem; }
|
|
||||||
|
|
||||||
pre:not(.chroma) {
|
|
||||||
overflow-x: auto;
|
|
||||||
padding-block: 1rem;
|
|
||||||
padding-inline: 0.4rem; }
|
|
||||||
|
|
||||||
pre {
|
|
||||||
font-size: 0.875rem; }
|
|
||||||
|
|
||||||
.footer {
|
|
||||||
font-size: smaller; }
|
|
||||||
@@ -1,4 +1,16 @@
|
|||||||
.breadcrumbs {
|
/* Menu links */
|
||||||
|
.menu__link {
|
||||||
|
color: var(--menu-color, var(--accent-color));
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme='light'] .menu__link {
|
||||||
|
color: var(--menu-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme='dark'] .menu__link {
|
||||||
|
color: var(--accent-color);
|
||||||
|
}
|
||||||
|
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@@ -58,8 +70,8 @@
|
|||||||
gap: 0.2rem;
|
gap: 0.2rem;
|
||||||
padding: 0.2rem 0.4rem;
|
padding: 0.2rem 0.4rem;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid #f26522;
|
border: 1px solid #ff3d3d;
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
font-size: 0.7rem;
|
font-size: 0.7rem;
|
||||||
font-weight: 340;
|
font-weight: 340;
|
||||||
@@ -96,27 +108,22 @@
|
|||||||
color: var(--foreground-color) !important;
|
color: var(--foreground-color) !important;
|
||||||
}
|
}
|
||||||
[data-theme='light'] .rss-subscribe__link {
|
[data-theme='light'] .rss-subscribe__link {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
[data-theme='light'] .rss-subscribe__link:hover,
|
[data-theme='light'] .rss-subscribe__link:hover,
|
||||||
[data-theme='light'] .rss-subscribe__link:focus {
|
[data-theme='light'] .rss-subscribe__link:focus {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #f26522 !important;
|
color: #ff3d3d !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.rss-subscribe__link:hover,
|
.rss-subscribe__link:hover,
|
||||||
.rss-subscribe__link:focus {
|
.rss-subscribe__link:focus {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #f26522 !important;
|
color: #ff3d3d !important;
|
||||||
}
|
|
||||||
|
|
||||||
.rss-subscribe__link:hover {
|
|
||||||
background-color: transparent;
|
|
||||||
color: var(--foreground-color) !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.rss-subscribe__link svg {
|
.rss-subscribe__link svg {
|
||||||
@@ -272,9 +279,9 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid #f26522;
|
border: 1px solid #ff3d3d;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
color: #f26522;
|
color: #ff3d3d;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
transition:
|
transition:
|
||||||
@@ -283,7 +290,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.brand__mobile-toggle:hover {
|
.brand__mobile-toggle:hover {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -307,12 +314,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
[data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle {
|
[data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
@media (prefers-color-scheme: light) {
|
@media (prefers-color-scheme: light) {
|
||||||
.brand__mobile-check:checked ~ .brand__mobile-toggle {
|
.brand__mobile-check:checked ~ .brand__mobile-toggle {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -352,11 +359,11 @@
|
|||||||
|
|
||||||
[data-theme='light'] .brand__mobile-toggle {
|
[data-theme='light'] .brand__mobile-toggle {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: #f26522;
|
border-color: #ff3d3d;
|
||||||
color: #f26522;
|
color: #ff3d3d;
|
||||||
}
|
}
|
||||||
[data-theme='light'] .brand__mobile-toggle:hover {
|
[data-theme='light'] .brand__mobile-toggle:hover {
|
||||||
background-color: #f26522;
|
background-color: #ff3d3d;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
[data-theme='dark'] .brand__mobile-toggle {
|
[data-theme='dark'] .brand__mobile-toggle {
|
||||||
@@ -435,9 +442,10 @@
|
|||||||
[data-theme='light'] {
|
[data-theme='light'] {
|
||||||
--background-color: #fff;
|
--background-color: #fff;
|
||||||
--background-color1: #777;
|
--background-color1: #777;
|
||||||
--foreground-color: #000000f4;
|
--foreground-color: #000000e1;
|
||||||
--foreground-color3: #665c54;
|
--foreground-color3: #665c54;
|
||||||
--accent-color: #00000094;
|
--accent-color: #1133e9c5;
|
||||||
|
--menu-color: #000000ae;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Force dark theme */
|
/* Force dark theme */
|
||||||
|
|||||||
Reference in New Issue
Block a user