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); } }