www - Personal website
ssh://anon@thyssentishman.com/www
Log | Files | Refs | Feed | Contribute | README

Commit: e914cda0097c4531ccf298a85428186cd5926b6e
Parent: 67ba4095f0ebcb238d106616deee0c30b0454955
Author: Johannes Thyssen Tishman
Date:   Wed, 15 May 2024 09:29:36 +0000

style.css: Update colors and formatting

Diffstat:
M public/style.css | 79 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------

1 file changed, 63 insertions(+), 16 deletions(-)

diff --git a/public/style.css b/public/style.css
@@ -4,10 +4,12 @@
 }
 
 :root {
-    --bg: #d0d0d0;
-    --fg: #151515;
-    --op: #ac4142;
-    --br: #90a959;
+    --bg: rgba(208, 208, 208, 1);
+    --fg: rgba(18, 18, 18, 1);
+    --op: rgba(187, 187, 187, 1);
+    --dd: rgba(84, 36, 38, 0.5);
+    --di: rgba(28, 68, 40, 0.5);
+
 }
 
 html {
@@ -23,6 +25,14 @@ body {
     max-width: 750px;
 }
 
+header {
+    margin-bottom: 1em;
+}
+
+h1, h2, h3, h4 {
+    font-size: 1em;
+}
+
 ::selection {
     color: var(--bg);
     background: var(--fg);
@@ -43,13 +53,16 @@ hr {
 a, a:visited {
     color: inherit;
     text-decoration: none;
-    word-break: break-word;
 }
 
 a:hover {
     text-decoration: underline;
 }
 
+p a {
+    text-decoration: underline;
+}
+
 table {
     width: 100%;
     table-layout: fixed;
@@ -67,6 +80,30 @@ thead {
     font-weight: bold;
 }
 
+blockquote {
+    padding-left: 1em;
+    border-left: 1em solid var(--op);
+    font-style: italic;
+}
+
+pre:has(code) {
+    margin-bottom: 1em;
+    padding: 0.5em 0 0.5em 2em;
+    background: var(--op);
+}
+
+pre {
+    overflow: auto;
+}
+
+ol {
+   list-style-position: inside;
+}
+
+.footnotes p {
+   display: inline;
+}
+
 .leftcol {
     width: 12ch;
 }
@@ -115,27 +152,37 @@ thead {
     }
 }
 
-/* diff */
-pre {
-    overflow: auto;
-}
-
+/* stagit */
 .line {
     user-select: none;
 }
 
-.d {
-    color: var(--op);
+span.d {
+    color: rgba(218, 54, 51, 1);
+}
+
+span.i {
+    color: rgba(35, 134, 54, 1);
+}
+
+a.d {
+    background: var(--dd);
+    color: var(--bg);
 }
 
-.i {
-    color: var(--br);
+a.i {
+    background: var(--di);
+    color: var(--bg);
 }
 
 /* dark-mode */
 @media (prefers-color-scheme: dark) {
 	:root {
-		--bg: #151515;
-		--fg: #d0d0d0;
+		--fg: rgba(208, 208, 208, 1);
+		--bg: rgba(18, 18, 18, 1);
+		--op: rgba(51, 51, 51, 1);
+	}
+	a.d, a.i {
+		color: var(--fg);
 	}
 }