custom.css
... ...
@@ -0,0 +1,114 @@
1
+/* Akret Wiki – minimal monospace theme
2
+ Goals: tiny CSS, readable, print-friendly, dark-mode aware, no layout JS. */
3
+
4
+/* 1) Base layout */
5
+:root{
6
+ --bg: #fff;
7
+ --fg: #111;
8
+ --muted:#666;
9
+ --link:#0044cc;
10
+ --link-visited:#5a2ea6;
11
+ --accent:#0a84ff;
12
+ --border:#ddd;
13
+ --code-bg:#f6f8fa;
14
+}
15
+@media (prefers-color-scheme: dark){
16
+ :root{
17
+ --bg:#0c0c0c;
18
+ --fg:#e6e6e6;
19
+ --muted:#9a9a9a;
20
+ --link:#7aa2ff;
21
+ --link-visited:#b58cff;
22
+ --accent:#5aa3ff;
23
+ --border:#2a2a2a;
24
+ --code-bg:#16181a;
25
+ }
26
+}
27
+
28
+html { font-size: 16px; }
29
+body{
30
+ margin:0; padding:0;
31
+ background:var(--bg); color:var(--fg);
32
+ font: 16px/1.6 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
33
+}
34
+
35
+/* center a narrow, readable column */
36
+#container, .markdown-body, .gollum-site, main, .page{
37
+ max-width: 72ch; /* readable line length */
38
+ padding: 2rem 1rem 6rem;
39
+ margin: 0 auto;
40
+}
41
+
42
+/* 2) Headings */
43
+h1,h2,h3,h4,h5,h6{
44
+ margin: 2rem 0 0.75rem;
45
+ line-height:1.25;
46
+ font-weight: 700;
47
+}
48
+h1{ font-size: 1.75rem; border-bottom: 1px solid var(--border); padding-bottom: .25rem; }
49
+h2{ font-size: 1.35rem; }
50
+h3{ font-size: 1.15rem; color: var(--muted); }
51
+h4,h5,h6{ font-size: 1rem; color: var(--muted); }
52
+
53
+/* Gollum often renders a page title area; keep it clean */
54
+header, .header, .gollum-header { border:0; background:none; }
55
+
56
+/* 3) Text, links, lists */
57
+p, ul, ol, blockquote, pre, table { margin: 1rem 0; }
58
+li { margin: .25rem 0; }
59
+a{
60
+ color: var(--link);
61
+ text-decoration: underline;
62
+ text-underline-offset: 2px;
63
+}
64
+a:visited{ color: var(--link-visited); }
65
+a:hover, a:focus{ outline: none; text-decoration-thickness: 2px; }
66
+
67
+/* 4) Code & pre */
68
+code, kbd, samp{ background: var(--code-bg); padding: .1rem .25rem; border-radius: 4px; }
69
+pre{
70
+ background: var(--code-bg);
71
+ padding: 1rem; overflow: auto; border-radius: 6px;
72
+}
73
+pre code{ background: transparent; padding: 0; }
74
+
75
+/* 5) Images & media */
76
+img, video{ max-width: 100%; height: auto; border-radius: 4px; }
77
+figure{ margin: 1.25rem 0; }
78
+figcaption{ color: var(--muted); font-size: .9rem; margin-top: .25rem; }
79
+
80
+/* 6) Tables */
81
+table{ width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
82
+th, td{ border: 1px solid var(--border); padding: .5rem .6rem; vertical-align: top; }
83
+thead th{ background: color-mix(in srgb, var(--code-bg) 80%, transparent); }
84
+
85
+/* 7) Blockquotes */
86
+blockquote{
87
+ margin: 1rem 0; padding: .5rem 1rem;
88
+ border-left: 3px solid var(--border);
89
+ color: var(--muted);
90
+}
91
+
92
+/* 8) Utility bits */
93
+hr{ border: 0; border-top: 1px solid var(--border); margin: 2rem 0; }
94
+sup, sub{ line-height: 0; }
95
+mark{ background: #fffb91; color: inherit; }
96
+
97
+/* 9) Gollum-specific chrome (light touch) */
98
+.gollum-edit-form textarea{
99
+ font: inherit; /* keep monospace */
100
+ line-height: 1.5;
101
+}
102
+.gollum-footer, .footer, nav, .actions{ color:var(--muted); }
103
+#searchbar, .searchbar, form input[type=search]{
104
+ font: inherit; padding: .4rem .6rem; border:1px solid var(--border); border-radius:4px; background:var(--bg); color:var(--fg);
105
+}
106
+
107
+/* 10) Print (nice for handouts) */
108
+@media print{
109
+ body{ background:#fff; color:#000; }
110
+ a{ color:#000; text-decoration: underline; }
111
+ pre, code{ background:#fff; }
112
+ #container, .markdown-body, .gollum-site, main, .page{ max-width:none; padding:0; }
113
+ header, nav, .gollum-footer, .actions{ display:none !important; }
114
+}