This commit is contained in:
Alexander 2025-06-22 11:14:02 -04:00
parent f3f4fe296f
commit 7537a968b7
8 changed files with 128 additions and 12 deletions

View file

@ -174,6 +174,10 @@
--base-font-size: 16pt;
}
html {
font-size: var(--base-font-size);
}
/* Setting the line height here apparently stops "normal" from varying
across the course of <body>. */
body {

75
css/inverted_colors.css Normal file
View file

@ -0,0 +1,75 @@
:root {
--lightest-color: rgb(255, 250, 245);
--lighter-color: rgb(205, 200, 195);
--light-color: rgb(170, 165, 160);
--wide-gray-invert: rgb(10, 5, 5);
--narrow-gray-invert: rgb(15, 8, 8);
}
.invert .est-color {
color: var(--lightest-color) !important
}
.invert .er-color {
color: var(--lighter-color) !important
}
.invert .null-color {
color: var(--light-color) !important
}
.invert {
background-color: black;
color: var(--lighter-color);
}
.invert code:not(pre code) {
background-color: var(--wide-gray-invert);
color: white;
}
.invert pre {
color: white;
background-color: var(--wide-gray-invert);
border-color: var(--wide-gray-invert);
}
.invert body {
background-color: black;
color: var(--lighter-color);
}
.invert h1 {
color: var(--lightest-color);
}
.invert h2,
.invert h3,
.invert h4,
.invert h5,
.invert h6 {
color: var(--lighter-color);
}
.invert a:link,
.invert a:visited {
color: var(--lightest-color)
}
.invert table tr th,
.invert table tr td {
border-right: 2px solid var(--narrow-gray-invert);
border-bottom: 2px solid var(--narrow-gray-invert);
}
.invert table tr th:first-child,
.invert table tr td:first-child {
border-left: 2px solid var(--narrow-gray-invert);
}
/* top row a.k.a. table header */
.invert table tr th {
border-top: 2px solid var(--narrow-gray-invert);
}
.invert hr {
background-color: var(--narrow-gray-invert);
}

View file

@ -2,5 +2,11 @@
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding-left: 0.3rem;
padding-right: 0.3rem;
overflow: auto;
}
}
body {
margin: 0;
}

View file

@ -1,13 +1,23 @@
:root {
--darkest-color: rgb(10, 5, 0);
--middle-color: rgb(60, 55, 50);
--lighter-color: rgb(95, 85, 80);
--darker-color: rgb(60, 55, 50);
--dark-color: rgb(95, 85, 80);
--ui-spacing: 1.25;
--read-spacing: 1.5;
--wide-gray: rgb(245, 240, 240);
--narrow-gray: rgb(240, 233, 233);
}
.est-color {
color: var(--darkest-color) !important
}
.er-color {
color: var(--darker-color) !important
}
.null-color {
color: var(--dark-color) !important
}
code {
font-variant-ligatures: no-contextual;
}
@ -44,7 +54,7 @@ pre {
body {
background-color: rgb(255, 255, 255);
color: var(--middle-color);
color: var(--darker-color);
}
h1 {
@ -58,7 +68,7 @@ h3,
h4,
h5,
h6 {
color: var(--middle-color);
color: var(--darker-color);
margin-bottom: 0;
margin-top: 1em;
}
@ -186,4 +196,8 @@ math[display="block"] {
left: 0;
right: auto;
text-align: left;
}
}
footer {
margin-top: 2rem;
}