ebe5170f8b0550fdcd54d276e7255eaa6a381e91
custom.css
| ... | ... | @@ -1,104 +1,67 @@ |
| 1 | -/* Akret Wiki — dark-first, monospace |
|
| 2 | - Goals: simple, legible, fast, durable. */ |
|
| 1 | +/* === Force overrides (placed LAST in custom.css) === */ |
|
| 3 | 2 | |
| 4 | -/* ----- Colors (dark default) ----- */ |
|
| 5 | -:root { |
|
| 6 | - --bg: #111; /* soft black */ |
|
| 7 | - --fg: #e0e0e0; /* warm gray */ |
|
| 8 | - --muted: #999; |
|
| 9 | - --link: #9bb6ff; |
|
| 10 | - --link-visited: #c5a3ff; |
|
| 11 | - --border: #333; |
|
| 12 | - --code-bg: #1a1a1a; |
|
| 3 | +/* Base text + page width */ |
|
| 4 | +body{ |
|
| 5 | + background: var(--bg) !important; |
|
| 6 | + color: var(--fg) !important; |
|
| 7 | + font: 16px/1.7 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important; |
|
| 13 | 8 | } |
| 14 | - |
|
| 15 | -/* Light override for prefers-color-scheme: light */ |
|
| 16 | -@media (prefers-color-scheme: light) { |
|
| 17 | - :root { |
|
| 18 | - --bg: #fff; |
|
| 19 | - --fg: #111; |
|
| 20 | - --muted: #555; |
|
| 21 | - --link: #0044cc; |
|
| 22 | - --link-visited: #6a35b1; |
|
| 23 | - --border: #ddd; |
|
| 24 | - --code-bg: #f6f8fa; |
|
| 25 | - } |
|
| 26 | -} |
|
| 27 | - |
|
| 28 | -/* ----- Base layout ----- */ |
|
| 29 | -html { font-size: 16px; } |
|
| 30 | -body { |
|
| 31 | - margin: 0; |
|
| 32 | - padding: 0; |
|
| 33 | - background: var(--bg); |
|
| 34 | - color: var(--fg); |
|
| 35 | - font: 16px/1.7 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; |
|
| 9 | +#container, .gollum-site, .markdown-body, main, .page{ |
|
| 10 | + max-width: 80ch !important; |
|
| 11 | + margin: 0 auto !important; |
|
| 12 | + padding: 2.5rem 1rem 6rem !important; |
|
| 36 | 13 | } |
| 37 | 14 | |
| 38 | -/* Centered narrow column, slightly wider */ |
|
| 39 | -#container, .markdown-body, .gollum-site, main, .page { |
|
| 40 | - max-width: 80ch; |
|
| 41 | - padding: 2.5rem 1rem 6rem; |
|
| 42 | - margin: 0 auto; |
|
| 15 | +/* Links */ |
|
| 16 | +a{ |
|
| 17 | + color: var(--link) !important; |
|
| 18 | + text-decoration: underline !important; |
|
| 19 | + text-underline-offset: 3px !important; |
|
| 43 | 20 | } |
| 21 | +a:visited{ color: var(--link-visited) !important; } |
|
| 44 | 22 | |
| 45 | -/* ----- Headings ----- */ |
|
| 46 | -h1, h2, h3, h4, h5, h6 { |
|
| 47 | - margin: 2.5rem 0 1rem; |
|
| 48 | - line-height: 1.25; |
|
| 49 | - font-weight: 700; |
|
| 23 | +/* Headings */ |
|
| 24 | +h1,h2,h3,h4,h5,h6{ |
|
| 25 | + font-weight: 700 !important; |
|
| 26 | + line-height: 1.25 !important; |
|
| 27 | + margin: 2.5rem 0 1rem !important; |
|
| 50 | 28 | } |
| 51 | -h1 { |
|
| 52 | - font-size: 1.9rem; |
|
| 53 | - border-bottom: 1px solid var(--border); |
|
| 54 | - padding-bottom: .3rem; |
|
| 29 | +h1{ |
|
| 30 | + font-size: 1.9rem !important; |
|
| 31 | + border-bottom: 1px solid var(--border) !important; |
|
| 32 | + padding-bottom: .3rem !important; |
|
| 55 | 33 | } |
| 56 | -h2 { font-size: 1.4rem; } |
|
| 57 | -h3 { font-size: 1.2rem; color: var(--muted); } |
|
| 58 | -h4, h5, h6 { font-size: 1rem; color: var(--muted); } |
|
| 59 | - |
|
| 60 | -header, .header, .gollum-header { border: 0; background: none; } |
|
| 61 | - |
|
| 62 | -/* ----- Text & links ----- */ |
|
| 63 | -p, ul, ol, blockquote, pre, table { margin: 1.25rem 0; } |
|
| 64 | -li { margin: .4rem 0; } |
|
| 34 | +h2{ font-size: 1.4rem !important; } |
|
| 35 | +h3{ font-size: 1.2rem !important; color: var(--muted) !important; } |
|
| 36 | +h4,h5,h6{ font-size: 1rem !important; color: var(--muted) !important; } |
|
| 65 | 37 | |
| 66 | -a { |
|
| 67 | - color: var(--link); |
|
| 68 | - text-decoration: underline; |
|
| 69 | - text-underline-offset: 3px; |
|
| 38 | +/* Code blocks */ |
|
| 39 | +pre{ |
|
| 40 | + background: var(--code-bg) !important; |
|
| 41 | + padding: 1rem 1.2rem !important; |
|
| 42 | + border-radius: 6px !important; |
|
| 43 | + overflow: auto !important; |
|
| 70 | 44 | } |
| 71 | -a:visited { color: var(--link-visited); } |
|
| 72 | -a:hover, a:focus { |
|
| 73 | - text-decoration-thickness: 2px; |
|
| 74 | - outline: none; |
|
| 45 | +code,kbd,samp{ |
|
| 46 | + background: var(--code-bg) !important; |
|
| 47 | + padding: .15rem .35rem !important; |
|
| 48 | + border-radius: 4px !important; |
|
| 75 | 49 | } |
| 76 | 50 | |
| 77 | -/* ----- Code ----- */ |
|
| 78 | -code, kbd, samp { |
|
| 79 | - background: var(--code-bg); |
|
| 80 | - padding: .15rem .35rem; |
|
| 81 | - border-radius: 4px; |
|
| 82 | -} |
|
| 83 | -pre { |
|
| 84 | - background: var(--code-bg); |
|
| 85 | - padding: 1rem 1.2rem; |
|
| 86 | - border-radius: 6px; |
|
| 87 | - overflow: auto; |
|
| 88 | -} |
|
| 89 | -pre code { background: transparent; padding: 0; } |
|
| 51 | +/* Tables */ |
|
| 52 | +table{ width: 100% !important; border-collapse: collapse !important; } |
|
| 53 | +th,td{ border: 1px solid var(--border) !important; padding: .6rem .7rem !important; } |
|
| 90 | 54 | |
| 91 | -/* ----- Media ----- */ |
|
| 92 | -img, video { |
|
| 93 | - max-width: 100%; |
|
| 94 | - height: auto; |
|
| 95 | - border-radius: 3px; |
|
| 96 | -} |
|
| 97 | -figure { margin: 1.5rem 0; } |
|
| 98 | -figcaption { |
|
| 99 | - color: var(--muted); |
|
| 100 | - font-size: .9rem; |
|
| 101 | - margin-top: .4rem; |
|
| 55 | +/* Blockquotes */ |
|
| 56 | +blockquote{ |
|
| 57 | + border-left: 3px solid var(--border) !important; |
|
| 58 | + color: var(--muted) !important; |
|
| 59 | + margin: 1.2rem 0 !important; padding: .6rem 1rem !important; |
|
| 102 | 60 | } |
| 103 | 61 | |
| 104 | -/* -* |
|
| 62 | +/* Trim chrome */ |
|
| 63 | +header, .header, .gollum-header{ background: none !important; border: 0 !important; } |
|
| 64 | +.gollum-footer, .footer, nav, .actions{ color: var(--muted) !important; } |
|
| 65 | + |
|
| 66 | +/* Keep images responsive */ |
|
| 67 | +img, video{ max-width: 100% !important; height: auto !important; } |