Welcome! Below are links to things I've made or just enjoy.
\ No newline at end of file +Welcome! Below are links to things I've made or just enjoy.
+ + \ No newline at end of file diff --git a/css/fonts.css b/css/fonts.css index bf9cb7b..02a9d26 100644 --- a/css/fonts.css +++ b/css/fonts.css @@ -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 { diff --git a/css/inverted_colors.css b/css/inverted_colors.css new file mode 100644 index 0000000..8d52468 --- /dev/null +++ b/css/inverted_colors.css @@ -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); +} \ No newline at end of file diff --git a/css/layout.css b/css/layout.css index 2e82c6b..c9ea7ac 100644 --- a/css/layout.css +++ b/css/layout.css @@ -2,5 +2,11 @@ max-width: 900px; margin-left: auto; margin-right: auto; + padding-left: 0.3rem; + padding-right: 0.3rem; overflow: auto; -} \ No newline at end of file +} + +body { + margin: 0; +} diff --git a/css/looks.css b/css/looks.css index 6881800..a1b025b 100644 --- a/css/looks.css +++ b/css/looks.css @@ -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; -} \ No newline at end of file +} + +footer { + margin-top: 2rem; +} diff --git a/inclusions/footer.html b/inclusions/footer.html new file mode 100644 index 0000000..21c456b --- /dev/null +++ b/inclusions/footer.html @@ -0,0 +1,5 @@ + \ No newline at end of file diff --git a/shared_templates/main.html b/shared_templates/main.html index 8303b84..17c50db 100644 --- a/shared_templates/main.html +++ b/shared_templates/main.html @@ -7,17 +7,27 @@ +