aboutsummaryrefslogtreecommitdiff
path: root/www/static
diff options
context:
space:
mode:
authorTolmachev Igor <me@igorek.dev>2026-01-07 02:56:17 +0900
committerTolmachev Igor <me@igorek.dev>2026-01-07 02:56:17 +0900
commit62af97acf1aa92eda881c754ae0cc6876d3a5ede (patch)
tree72cc680fd6c6d5da7db06da026c48d335916e23a /www/static
parentbf87e843e959344a060854c2bee60b787011b7e7 (diff)
downloadcgit_material_docker-62af97acf1aa92eda881c754ae0cc6876d3a5ede.tar.gz
cgit_material_docker-62af97acf1aa92eda881c754ae0cc6876d3a5ede.zip
Improve docker image structure
Diffstat (limited to 'www/static')
-rw-r--r--www/static/colors.css119
-rw-r--r--www/static/hl.css95
-rw-r--r--www/static/md.css248
3 files changed, 462 insertions, 0 deletions
diff --git a/www/static/colors.css b/www/static/colors.css
new file mode 100644
index 0000000..4ac8629
--- /dev/null
+++ b/www/static/colors.css
@@ -0,0 +1,119 @@
1@media (prefers-color-scheme: dark) {
2 :root {
3 --color-primary: rgb(255 181 160);
4 --color-surface-tint: rgb(255 181 160);
5 --color-on-primary: rgb(86 31 15);
6 --color-primary-container: rgb(114 53 35);
7 --color-on-primary-container: rgb(255 219 209);
8 --color-secondary: rgb(231 189 178);
9 --color-on-secondary: rgb(68 42 34);
10 --color-secondary-container: rgb(93 64 55);
11 --color-on-secondary-container: rgb(255 219 209);
12 --color-tertiary: rgb(216 197 141);
13 --color-on-tertiary: rgb(59 47 5);
14 --color-tertiary-container: rgb(83 70 25);
15 --color-on-tertiary-container: rgb(245 225 167);
16 --color-error: rgb(255 180 171);
17 --color-on-error: rgb(105 0 5);
18 --color-error-container: rgb(147 0 10);
19 --color-on-error-container: rgb(255 218 214);
20 --color-background: rgb(26 17 15);
21 --color-on-background: rgb(241 223 218);
22 --color-surface: rgb(26 17 15);
23 --color-on-surface: rgb(241 223 218);
24 --color-surface-variant: rgb(83 67 63);
25 --color-on-surface-variant: rgb(216 194 188);
26 --color-outline: rgb(160 140 135);
27 --color-outline-variant: rgb(83 67 63);
28 --color-shadow: rgb(0 0 0);
29 --color-scrim: rgb(0 0 0);
30 --color-inverse-surface: rgb(241 223 218);
31 --color-inverse-on-surface: rgb(57 46 43);
32 --color-inverse-primary: rgb(143 76 56);
33 --color-primary-fixed: rgb(255 219 209);
34 --color-on-primary-fixed: rgb(58 11 1);
35 --color-primary-fixed-dim: rgb(255 181 160);
36 --color-on-primary-fixed-variant: rgb(114 53 35);
37 --color-secondary-fixed: rgb(255 219 209);
38 --color-on-secondary-fixed: rgb(44 21 15);
39 --color-secondary-fixed-dim: rgb(231 189 178);
40 --color-on-secondary-fixed-variant: rgb(93 64 55);
41 --color-tertiary-fixed: rgb(245 225 167);
42 --color-on-tertiary-fixed: rgb(35 27 0);
43 --color-tertiary-fixed-dim: rgb(216 197 141);
44 --color-on-tertiary-fixed-variant: rgb(83 70 25);
45 --color-surface-dim: rgb(26 17 15);
46 --color-surface-bright: rgb(66 55 52);
47 --color-surface-container-lowest: rgb(20 12 10);
48 --color-surface-container-low: rgb(35 25 23);
49 --color-surface-container: rgb(39 29 27);
50 --color-surface-container-high: rgb(50 40 37);
51 --color-surface-container-highest: rgb(61 50 47);
52
53 color-scheme: dark;
54 }
55}
56
57@media (prefers-color-scheme: light) {
58 :root {
59 --color-primary: rgb(143 76 56);
60 --color-surface-tint: rgb(143 76 56);
61 --color-on-primary: rgb(255 255 255);
62 --color-primary-container: rgb(255 219 209);
63 --color-on-primary-container: rgb(114 53 35);
64 --color-secondary: rgb(119 87 78);
65 --color-on-secondary: rgb(255 255 255);
66 --color-secondary-container: rgb(255 219 209);
67 --color-on-secondary-container: rgb(93 64 55);
68 --color-tertiary: rgb(108 93 47);
69 --color-on-tertiary: rgb(255 255 255);
70 --color-tertiary-container: rgb(245 225 167);
71 --color-on-tertiary-container: rgb(83 70 25);
72 --color-error: rgb(186 26 26);
73 --color-on-error: rgb(255 255 255);
74 --color-error-container: rgb(255 218 214);
75 --color-on-error-container: rgb(147 0 10);
76 --color-background: rgb(255 248 246);
77 --color-on-background: rgb(35 25 23);
78 --color-surface: rgb(255 248 246);
79 --color-on-surface: rgb(35 25 23);
80 --color-surface-variant: rgb(245 222 216);
81 --color-on-surface-variant: rgb(83 67 63);
82 --color-outline: rgb(133 115 110);
83 --color-outline-variant: rgb(216 194 188);
84 --color-shadow: rgb(0 0 0);
85 --color-scrim: rgb(0 0 0);
86 --color-inverse-surface: rgb(57 46 43);
87 --color-inverse-on-surface: rgb(255 237 232);
88 --color-inverse-primary: rgb(255 181 160);
89 --color-primary-fixed: rgb(255 219 209);
90 --color-on-primary-fixed: rgb(58 11 1);
91 --color-primary-fixed-dim: rgb(255 181 160);
92 --color-on-primary-fixed-variant: rgb(114 53 35);
93 --color-secondary-fixed: rgb(255 219 209);
94 --color-on-secondary-fixed: rgb(44 21 15);
95 --color-secondary-fixed-dim: rgb(231 189 178);
96 --color-on-secondary-fixed-variant: rgb(93 64 55);
97 --color-tertiary-fixed: rgb(245 225 167);
98 --color-on-tertiary-fixed: rgb(35 27 0);
99 --color-tertiary-fixed-dim: rgb(216 197 141);
100 --color-on-tertiary-fixed-variant: rgb(83 70 25);
101 --color-surface-dim: rgb(232 214 210);
102 --color-surface-bright: rgb(255 248 246);
103 --color-surface-container-lowest: rgb(255 255 255);
104 --color-surface-container-low: rgb(255 241 237);
105 --color-surface-container: rgb(252 234 229);
106 --color-surface-container-high: rgb(247 228 224);
107 --color-surface-container-highest: rgb(241 223 218);
108
109 color-scheme: light;
110 }
111}
112
113/* Custom logic for diffs */
114:root {
115 --diff-add-bg: var(--color-tertiary-container);
116 --diff-add-fg: var(--color-on-tertiary-container);
117 --diff-del-bg: var(--color-error-container);
118 --diff-del-fg: var(--color-on-error-container);
119}
diff --git a/www/static/hl.css b/www/static/hl.css
new file mode 100644
index 0000000..15998e0
--- /dev/null
+++ b/www/static/hl.css
@@ -0,0 +1,95 @@
1/* --- Syntax Highlighting --- */
2
3/* Comments - Outline/Grey */
4.hl-c,
5.hl-cm,
6.hl-cp,
7.hl-c1,
8.hl-cs {
9 color: var(--color-outline);
10 font-style: italic;
11}
12
13/* Keywords - Primary (Pinkish/Orange) */
14.hl-k,
15.hl-kc,
16.hl-kd,
17.hl-kn,
18.hl-kp,
19.hl-kr,
20.hl-kt {
21 color: var(--color-primary);
22 font-weight: bold;
23}
24
25/* Names/Functions - Tertiary (Yellowish) */
26.hl-n,
27.hl-na,
28.hl-nb,
29.hl-nc,
30.hl-no,
31.hl-nd,
32.hl-ni,
33.hl-ne,
34.hl-nf,
35.hl-nl,
36.hl-nn,
37.hl-nt,
38.hl-nv,
39.hl-nx {
40 color: var(--color-tertiary);
41}
42
43/* Strings - Secondary (Reddish/Brownish) */
44.hl-s,
45.hl-sa,
46.hl-sb,
47.hl-sc,
48.hl-dl,
49.hl-sd,
50.hl-s2,
51.hl-se,
52.hl-sh,
53.hl-si,
54.hl-sx,
55.hl-sr,
56.hl-s1,
57.hl-ss {
58 color: var(--color-secondary);
59}
60
61/* Operators - On Surface (Main text color) */
62.hl-o,
63.hl-ow {
64 color: var(--color-on-surface-variant);
65}
66
67/* Numbers - Primary Container (Brighter accent) */
68.hl-m,
69.hl-mb,
70.hl-mf,
71.hl-mh,
72.hl-mi,
73.hl-mo,
74.hl-il {
75 color: var(--color-primary-fixed);
76}
77
78/* Errors */
79.hl-err,
80.hl-gr {
81 color: var(--color-error);
82 background-color: var(--color-error-container);
83}
84
85/* Generic Deleted */
86.hl-gd {
87 color: var(--color-error);
88 background-color: var(--color-error-container);
89}
90
91/* Generic Inserted */
92.hl-gi {
93 color: var(--color-tertiary);
94 background-color: var(--color-tertiary-container);
95}
diff --git a/www/static/md.css b/www/static/md.css
new file mode 100644
index 0000000..c8966c3
--- /dev/null
+++ b/www/static/md.css
@@ -0,0 +1,248 @@
1/* --- Markdown Body Styles --- */
2
3.markdown-body {
4 font-family: inherit;
5 font-size: 1rem;
6 line-height: 1.6;
7 color: var(--color-on-background);
8 word-wrap: break-word;
9}
10
11/* Headers */
12.markdown-body h1,
13.markdown-body h2,
14.markdown-body h3,
15.markdown-body h4,
16.markdown-body h5,
17.markdown-body h6 {
18 margin-top: 24px;
19 margin-bottom: 16px;
20 font-weight: 600;
21 line-height: 1.25;
22 color: var(--color-on-surface);
23}
24
25.markdown-body h1 {
26 font-size: 2em;
27 border-bottom: 1px solid var(--color-outline-variant);
28 padding-bottom: 0.3em;
29}
30.markdown-body h2 {
31 font-size: 1.5em;
32 border-bottom: 1px solid var(--color-outline-variant);
33 padding-bottom: 0.3em;
34}
35.markdown-body h3 {
36 font-size: 1.25em;
37}
38.markdown-body h4 {
39 font-size: 1em;
40}
41.markdown-body h5 {
42 font-size: 0.875em;
43}
44.markdown-body h6 {
45 font-size: 0.85em;
46 color: var(--color-on-surface-variant);
47}
48
49/* Links */
50.markdown-body a {
51 color: var(--color-primary);
52 text-decoration: none;
53}
54.markdown-body a:hover {
55 text-decoration: underline;
56}
57
58/* Paragraphs & Lists */
59.markdown-body p,
60.markdown-body blockquote,
61.markdown-body ul,
62.markdown-body ol,
63.markdown-body dl,
64.markdown-body table,
65.markdown-body pre {
66 margin-top: 0;
67 margin-bottom: 16px;
68}
69
70.markdown-body hr {
71 height: 0.25em;
72 padding: 0;
73 margin: 24px 0;
74 background-color: var(--color-outline-variant);
75 border: 0;
76}
77
78/* Blockquotes */
79.markdown-body blockquote {
80 padding: 0 1em;
81 color: var(--color-on-surface-variant);
82 border-left: 0.25em solid var(--color-outline);
83 background-color: var(--color-surface-container-low);
84}
85
86/* Tables */
87.markdown-body table {
88 display: block;
89 width: 100%;
90 overflow: auto;
91 border-spacing: 0;
92 border-collapse: collapse;
93}
94
95.markdown-body table th {
96 font-weight: 600;
97 background-color: var(--color-surface-container);
98}
99
100.markdown-body table th,
101.markdown-body table td {
102 padding: 6px 13px;
103 border: 1px solid var(--color-outline-variant);
104}
105
106.markdown-body table tr {
107 background-color: var(--color-surface);
108 border-top: 1px solid var(--color-outline-variant);
109}
110
111.markdown-body table tr:nth-child(2n) {
112 background-color: var(--color-surface-container-lowest);
113}
114
115/* Images */
116.markdown-body img {
117 max-width: 100%;
118 box-sizing: border-box;
119 background-color: var(--color-surface);
120 border-radius: 4px;
121}
122
123/* Code Blocks & Inline Code */
124.markdown-body code,
125.markdown-body tt {
126 padding: 0.2em 0.4em;
127 margin: 0;
128 font-size: 85%;
129 font-family: "JetBrains Mono", "Fira Code", monospace;
130 background-color: var(--color-surface-container-high);
131 border-radius: 6px;
132 color: var(--color-on-surface);
133}
134
135.markdown-body pre {
136 padding: 16px;
137 overflow: auto;
138 font-size: 85%;
139 line-height: 1.45;
140 background-color: var(--color-surface-container-lowest);
141 border-radius: 6px;
142 border: 1px solid var(--color-outline-variant);
143}
144
145.markdown-body pre code,
146.markdown-body pre tt {
147 display: inline;
148 max-width: auto;
149 padding: 0;
150 margin: 0;
151 overflow: visible;
152 line-height: inherit;
153 word-wrap: normal;
154 background-color: transparent;
155 border: 0;
156}
157
158/* Anchors (Permalinks) */
159.markdown-body a.headerlink {
160 padding-left: 1ch;
161 line-height: 1;
162 color: var(--color-primary);
163 text-decoration: none;
164 opacity: 0;
165 transition: opacity 0.2s;
166}
167
168.markdown-body h1:hover .headerlink,
169.markdown-body h2:hover .headerlink,
170.markdown-body h3:hover .headerlink,
171.markdown-body h4:hover .headerlink,
172.markdown-body h5:hover .headerlink,
173.markdown-body h6:hover .headerlink {
174 opacity: 1;
175}
176
177/* Pygments Syntax Highlighting within Markdown
178 (Mapping standard Pygments classes to Material Variables) */
179.markdown-body .highlight .c,
180.markdown-body .highlight .cm,
181.markdown-body .highlight .cp,
182.markdown-body .highlight .c1,
183.markdown-body .highlight .cs {
184 color: var(--color-outline);
185 font-style: italic;
186}
187.markdown-body .highlight .k,
188.markdown-body .highlight .kc,
189.markdown-body .highlight .kd,
190.markdown-body .highlight .kn,
191.markdown-body .highlight .kp,
192.markdown-body .highlight .kr,
193.markdown-body .highlight .kt {
194 color: var(--color-primary);
195 font-weight: bold;
196}
197.markdown-body .highlight .n,
198.markdown-body .highlight .na,
199.markdown-body .highlight .nb,
200.markdown-body .highlight .nc,
201.markdown-body .highlight .no,
202.markdown-body .highlight .nd,
203.markdown-body .highlight .ni,
204.markdown-body .highlight .ne,
205.markdown-body .highlight .nf,
206.markdown-body .highlight .nl,
207.markdown-body .highlight .nn,
208.markdown-body .highlight .nt,
209.markdown-body .highlight .nv,
210.markdown-body .highlight .nx {
211 color: var(--color-tertiary);
212}
213.markdown-body .highlight .s,
214.markdown-body .highlight .sa,
215.markdown-body .highlight .sb,
216.markdown-body .highlight .sc,
217.markdown-body .highlight .dl,
218.markdown-body .highlight .sd,
219.markdown-body .highlight .s2,
220.markdown-body .highlight .se,
221.markdown-body .highlight .sh,
222.markdown-body .highlight .si,
223.markdown-body .highlight .sx,
224.markdown-body .highlight .sr,
225.markdown-body .highlight .s1,
226.markdown-body .highlight .ss {
227 color: var(--color-secondary);
228}
229.markdown-body .highlight .m,
230.markdown-body .highlight .mb,
231.markdown-body .highlight .mf,
232.markdown-body .highlight .mh,
233.markdown-body .highlight .mi,
234.markdown-body .highlight .mo,
235.markdown-body .highlight .il {
236 color: var(--color-primary-fixed);
237}
238.markdown-body .highlight .o,
239.markdown-body .highlight .ow {
240 color: var(--color-on-surface-variant);
241}
242.markdown-body .highlight .g,
243.markdown-body .highlight .gh,
244.markdown-body .highlight .gu,
245.markdown-body .highlight .gd,
246.markdown-body .highlight .gi {
247 color: var(--color-on-surface);
248}