summaryrefslogtreecommitdiff
path: root/static/css
diff options
context:
space:
mode:
Diffstat (limited to 'static/css')
-rwxr-xr-xstatic/css/dark.css220
-rwxr-xr-xstatic/css/main.css347
2 files changed, 567 insertions, 0 deletions
diff --git a/static/css/dark.css b/static/css/dark.css
new file mode 100755
index 0000000..9c318cb
--- /dev/null
+++ b/static/css/dark.css
@@ -0,0 +1,220 @@
1body {
2 color: white;
3 background-color: #0a0a0a;
4}
5
6::-moz-selection {
7 background: #444;
8 color: #fff;
9 text-shadow: none;
10}
11
12::selection {
13 background: #b7b7b7;
14 color: #000;
15 text-shadow: none;
16}
17
18hr {
19 border-top: 3px dotted #444;
20}
21code {
22 background-color: var(--darkMaincolor);
23 color: black;
24 text-decoration: bold;
25 padding: 0.1em 0.2em;
26}
27pre {
28 background-color: #272822;
29 line-height: 1.4;
30 overflow-x: auto;
31 padding: 1em;
32}
33blockquote {
34 border-color: var(--darkMaincolor);
35}
36
37h1,
38h2,
39h3,
40h4,
41h5,
42h6 {
43 color: #ddd;
44}
45h1::before {
46 color: var(--darkMaincolor);
47 content: "# ";
48}
49h2::before {
50 color: var(--darkMaincolor);
51 content: "## ";
52}
53h3::before {
54 color: var(--darkMaincolor);
55 content: "### ";
56}
57h4::before {
58 color: var(--darkMaincolor);
59 content: "#### ";
60}
61h5::before {
62 color: var(--darkMaincolor);
63 content: "##### ";
64}
65h6::before {
66 color: var(--darkMaincolor);
67 content: "###### ";
68}
69
70a {
71 border-bottom: 3px solid var(--darkMaincolor);
72 color: inherit;
73}
74a:hover {
75 background-color: var(--darkMaincolor);
76 color: black;
77}
78
79.site-description a {
80 color: #ddd;
81}
82.site-description a:hover {
83 color: black;
84}
85
86.tags a {
87 border-bottom: 3px solid var(--darkMaincolor);
88}
89.tags a:hover {
90 background-color: var(--darkMaincolor);
91 color: black;
92}
93
94.site-title a {
95 color: white;
96 text-decoration: none !important;
97}
98
99.header nav,
100.footer {
101 border-color: #333;
102}
103
104.highlight {
105 background-color: #333;
106}
107.soc:hover {
108 color: black;
109}
110.draft-label {
111 color: var(--darkMaincolor);
112 background-color: #444;
113}
114input {
115 height: inherit;
116 width: 95%;
117 background: #070606;
118 color: #9e9e9e;
119 font: 22px "Roboto Mono", Courier, monospace;
120 font-weight: bold;
121 line-height: 2em;
122 box-shadow: none;
123 border: none;
124 text-align: center;
125 border-radius: 6px;
126 outline: none;
127 padding: 7px 14px;
128 font-size: 18;
129 grid-column: 1 / -1;
130 margin: 0;
131}
132
133@media {
134 .webring{
135 content: url(https://webring.xxiivv.com/icon.white.svg);
136 }
137}
138
139/* Background */ .chroma { background-color: #0f0f0f}
140/* Other */ .chroma .x { }
141/* Error */ .chroma .err { }
142/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
143/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
144/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
145/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
146/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
147/* Keyword */ .chroma .k { color: #007020; font-weight: bold }
148/* KeywordConstant */ .chroma .kc { color: #007020; font-weight: bold }
149/* KeywordDeclaration */ .chroma .kd { color: #007020; font-weight: bold }
150/* KeywordNamespace */ .chroma .kn { color: #007020; font-weight: bold }
151/* KeywordPseudo */ .chroma .kp { color: #007020 }
152/* KeywordReserved */ .chroma .kr { color: #007020; font-weight: bold }
153/* KeywordType */ .chroma .kt { color: #902000 }
154/* Name */ .chroma .n { }
155/* NameAttribute */ .chroma .na { color: #4070a0 }
156/* NameBuiltin */ .chroma .nb { color: #007020 }
157/* NameBuiltinPseudo */ .chroma .bp { }
158/* NameClass */ .chroma .nc { color: #0e84b5; font-weight: bold }
159/* NameConstant */ .chroma .no { color: #60add5 }
160/* NameDecorator */ .chroma .nd { color: #555555; font-weight: bold }
161/* NameEntity */ .chroma .ni { color: #d55537; font-weight: bold }
162/* NameException */ .chroma .ne { color: #007020 }
163/* NameFunction */ .chroma .nf { color: #06287e }
164/* NameFunctionMagic */ .chroma .fm { }
165/* NameLabel */ .chroma .nl { color: #002070; font-weight: bold }
166/* NameNamespace */ .chroma .nn { color: #0e84b5; font-weight: bold }
167/* NameOther */ .chroma .nx { }
168/* NameProperty */ .chroma .py { }
169/* NameTag */ .chroma .nt { color: #062873; font-weight: bold }
170/* NameVariable */ .chroma .nv { color: #bb60d5 }
171/* NameVariableClass */ .chroma .vc { }
172/* NameVariableGlobal */ .chroma .vg { }
173/* NameVariableInstance */ .chroma .vi { }
174/* NameVariableMagic */ .chroma .vm { }
175/* Literal */ .chroma .l { }
176/* LiteralDate */ .chroma .ld { }
177/* LiteralString */ .chroma .s { color: #4070a0 }
178/* LiteralStringAffix */ .chroma .sa { color: #4070a0 }
179/* LiteralStringBacktick */ .chroma .sb { color: #4070a0 }
180/* LiteralStringChar */ .chroma .sc { color: #4070a0 }
181/* LiteralStringDelimiter */ .chroma .dl { color: #4070a0 }
182/* LiteralStringDoc */ .chroma .sd { color: #4070a0; font-style: italic }
183/* LiteralStringDouble */ .chroma .s2 { color: #4070a0 }
184/* LiteralStringEscape */ .chroma .se { color: #4070a0; font-weight: bold }
185/* LiteralStringHeredoc */ .chroma .sh { color: #4070a0 }
186/* LiteralStringInterpol */ .chroma .si { color: #70a0d0; font-style: italic }
187/* LiteralStringOther */ .chroma .sx { color: #c65d09 }
188/* LiteralStringRegex */ .chroma .sr { color: #235388 }
189/* LiteralStringSingle */ .chroma .s1 { color: #4070a0 }
190/* LiteralStringSymbol */ .chroma .ss { color: #517918 }
191/* LiteralNumber */ .chroma .m { color: #40a070 }
192/* LiteralNumberBin */ .chroma .mb { color: #40a070 }
193/* LiteralNumberFloat */ .chroma .mf { color: #40a070 }
194/* LiteralNumberHex */ .chroma .mh { color: #40a070 }
195/* LiteralNumberInteger */ .chroma .mi { color: #40a070 }
196/* LiteralNumberIntegerLong */ .chroma .il { color: #40a070 }
197/* LiteralNumberOct */ .chroma .mo { color: #40a070 }
198/* Operator */ .chroma .o { color: #666666 }
199/* OperatorWord */ .chroma .ow { color: #007020; font-weight: bold }
200/* Punctuation */ .chroma .p { }
201/* Comment */ .chroma .c { color: #60a0b0; font-style: italic }
202/* CommentHashbang */ .chroma .ch { color: #60a0b0; font-style: italic }
203/* CommentMultiline */ .chroma .cm { color: #60a0b0; font-style: italic }
204/* CommentSingle */ .chroma .c1 { color: #60a0b0; font-style: italic }
205/* CommentSpecial */ .chroma .cs { color: #60a0b0; background-color: #fff0f0 }
206/* CommentPreproc */ .chroma .cp { color: #007020 }
207/* CommentPreprocFile */ .chroma .cpf { color: #007020 }
208/* Generic */ .chroma .g { }
209/* GenericDeleted */ .chroma .gd { color: #a00000 }
210/* GenericEmph */ .chroma .ge { font-style: italic }
211/* GenericError */ .chroma .gr { color: #ff0000 }
212/* GenericHeading */ .chroma .gh { color: #000080; font-weight: bold }
213/* GenericInserted */ .chroma .gi { color: #00a000 }
214/* GenericOutput */ .chroma .go { color: #888888 }
215/* GenericPrompt */ .chroma .gp { color: #c65d09; font-weight: bold }
216/* GenericStrong */ .chroma .gs { font-weight: bold }
217/* GenericSubheading */ .chroma .gu { color: #800080; font-weight: bold }
218/* GenericTraceback */ .chroma .gt { color: #0044dd }
219/* GenericUnderline */ .chroma .gl { text-decoration: underline }
220/* TextWhitespace */ .chroma .w { color: #bbbbbb }
diff --git a/static/css/main.css b/static/css/main.css
new file mode 100755
index 0000000..e7982f4
--- /dev/null
+++ b/static/css/main.css
@@ -0,0 +1,347 @@
1/* Fonts */
2@import url('https://fonts.googleapis.com/css?family=DM+Mono');
3/* Markdown */
4:root{
5--maincolor: #89d3c7;
6--bordercl: gray;
7--callouctcolor: dodgerblue;
8--hovercolor: var(--maincolor);
9--darkMaincolor: #91e4d2;
10--sel: #444;
11}
12.logo {
13 margin-right: 20px;
14 width: 50px;
15 height: 50px;
16 border-radius: 5px;
17 background-size: 50px 50px;
18 filter: grayscale(100%);
19 -webkit-filter: grayscale(100%);
20}
21.logo:hover {
22 filter: none;
23 -webkit-filter: none;
24}
25html {
26 color: #232333;
27 font-family: 'DM Mono', monospace;
28 font-size: 15px;
29 line-height: 1.6em;
30}
31body{
32 display: block;
33 margin: 8px;
34}
35* {
36 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
37}
38
39::selection {
40 background: var(--sel);
41 color: #fff;
42}
43
44p {
45 font-family: 'DM Mono', sans-serif;
46 line-height: 1.5;
47}
48
49hr {
50 border: 0;
51 border-top: 3px dotted var(--bordercl);
52 margin: 1em 0;
53}
54
55blockquote {
56 border-left: 3px solid var(--maincolor);
57 color: #737373;
58 margin: 0;
59 padding-left: 1em;
60}
61
62a {
63 border-bottom: 3px solid var(--maincolor);
64 color: inherit;
65 text-decoration: none;
66}
67a:hover {
68 background-color: var(--hovercolor);
69 color: #000;
70}
71
72ul {
73 list-style: none;
74 padding-left: 2ch;
75}
76ul li {
77 text-indent: -2ch;
78}
79ul li::before {
80 content: '* ';
81 font-weight: bold;
82}
83
84/* Images */
85img {
86 border: 3px solid #ececec;
87 max-width: 100%;
88}
89
90figure {
91 box-sizing: border-box;
92 display: inline-block;
93 margin: 0;
94 max-width: 100%;
95}
96
97figure img {
98 max-height: 500px;
99}
100
101@media screen and (min-width: 600px) {
102 figure {
103 padding: 0 40px;
104 }
105}
106
107figure h4 {
108 font-size: 1rem;
109 margin: 0;
110 margin-bottom: 1em;
111}
112figure h4::before {
113 content: '↳ ';
114}
115
116/* Code blocks */
117code {
118 background-color: #f1f1f1;
119 padding: .1em .2em;
120}
121
122pre {
123 background-color: #ececec;
124 line-height: 1.4;
125 overflow-x: auto;
126 padding: 1em;
127}
128
129.highlight pre ::selection {
130 background: rgba(255, 255, 255, 0.2);
131 color: inherit;
132}
133
134pre code {
135 background-color: transparent;
136 font-family: "DM Mono";
137 color: inherit;
138 font-size: 100%;
139 padding: 0;
140}
141
142/* Containers */
143.content {
144 margin-bottom: 4em;
145 margin-left: auto;
146 margin-right: auto;
147 max-width: 800px;
148 padding: 0 1ch;
149 word-wrap: break-word;
150}
151
152/* Header */
153header {
154 display: flex;
155 flex-wrap: wrap;
156 justify-content: space-between;
157 margin: 1em 0;
158}
159
160header .main {
161 font-size: 1.5rem;
162}
163h1, h2, h3, h4, h5, h6 {
164 font-size: 1.2rem;
165 margin-top: 2em;
166}
167
168h1::before { color: var(--maincolor); content: '# '; }
169h2::before { color: var(--maincolor); content: '## '; }
170h3::before { color: var(--maincolor); content: '### '; }
171h4::before { color: var(--maincolor); content: '#### '; }
172h5::before { color: var(--maincolor); content: '##### '; }
173h6::before { color: var(--maincolor); content: '###### '; }
174
175/* Footer */
176footer {
177 margin-top: 1em;
178 display: flex;
179 flex-wrap: wrap;
180 justify-content: space-between;
181 margin: 1em 0;
182}
183
184/* Common */
185.title h1 {
186 margin-bottom: 0;
187}
188
189time {
190 color: grey;
191}
192
193/* Posts */
194article .title {
195 margin-bottom: 1em;
196}
197
198.site-description {
199display: flex;
200justify-content: space-between;
201}
202
203svg{
204 max-height: 15px;
205}
206
207.soc:hover{
208 color: #000;
209}
210
211.draft-label{
212 color: var(--bordercl);
213 text-decoration: none;
214 padding: 2px 4px;
215 border-radius: 4px;
216 margin-left: 6px;
217 background-color: #f9f2f4;
218}
219input {
220 height: inherit;
221 width: 95%;
222 background: #f9f2f4;
223 color: #9e9e9e;
224 font: 22px "DM Mono", Courier, monospace;
225 font-weight: bold;
226 line-height: 2em;
227 box-shadow: none;
228 border: none;
229 text-align: center;
230 border-radius: 6px;
231 outline: none;
232 padding: 7px 14px;
233 font-size: 18;
234 grid-column: 1 / -1;
235 margin: 0;
236}
237
238.footings {
239 border-bottom: unset;
240 color: unset;
241 text-decoration: none;
242 border: none;
243 max-width: 100%;
244 max-height: 1.5rem;
245}
246
247.footings:hover {
248 background-color: unset;
249 color: unset;
250}
251
252.webring{
253 border-bottom: unset;
254 color: unset;
255 text-decoration: none;
256 border: none;
257 max-width: 100%;
258 max-height: 1.5rem;
259}
260
261.webring:hover {
262 background-color: unset;
263 color: unset;
264}
265
266/* Background */ .chroma { background-color: #f0f0f0 }
267/* Other */ .chroma .x { }
268/* Error */ .chroma .err { }
269/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
270/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; }
271/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc }
272/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
273/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
274/* Keyword */ .chroma .k { color: #007020; font-weight: bold }
275/* KeywordConstant */ .chroma .kc { color: #007020; font-weight: bold }
276/* KeywordDeclaration */ .chroma .kd { color: #007020; font-weight: bold }
277/* KeywordNamespace */ .chroma .kn { color: #007020; font-weight: bold }
278/* KeywordPseudo */ .chroma .kp { color: #007020 }
279/* KeywordReserved */ .chroma .kr { color: #007020; font-weight: bold }
280/* KeywordType */ .chroma .kt { color: #902000 }
281/* Name */ .chroma .n { }
282/* NameAttribute */ .chroma .na { color: #4070a0 }
283/* NameBuiltin */ .chroma .nb { color: #007020 }
284/* NameBuiltinPseudo */ .chroma .bp { }
285/* NameClass */ .chroma .nc { color: #0e84b5; font-weight: bold }
286/* NameConstant */ .chroma .no { color: #60add5 }
287/* NameDecorator */ .chroma .nd { color: #555555; font-weight: bold }
288/* NameEntity */ .chroma .ni { color: #d55537; font-weight: bold }
289/* NameException */ .chroma .ne { color: #007020 }
290/* NameFunction */ .chroma .nf { color: #06287e }
291/* NameFunctionMagic */ .chroma .fm { }
292/* NameLabel */ .chroma .nl { color: #002070; font-weight: bold }
293/* NameNamespace */ .chroma .nn { color: #0e84b5; font-weight: bold }
294/* NameOther */ .chroma .nx { }
295/* NameProperty */ .chroma .py { }
296/* NameTag */ .chroma .nt { color: #062873; font-weight: bold }
297/* NameVariable */ .chroma .nv { color: #bb60d5 }
298/* NameVariableClass */ .chroma .vc { }
299/* NameVariableGlobal */ .chroma .vg { }
300/* NameVariableInstance */ .chroma .vi { }
301/* NameVariableMagic */ .chroma .vm { }
302/* Literal */ .chroma .l { }
303/* LiteralDate */ .chroma .ld { }
304/* LiteralString */ .chroma .s { color: #4070a0 }
305/* LiteralStringAffix */ .chroma .sa { color: #4070a0 }
306/* LiteralStringBacktick */ .chroma .sb { color: #4070a0 }
307/* LiteralStringChar */ .chroma .sc { color: #4070a0 }
308/* LiteralStringDelimiter */ .chroma .dl { color: #4070a0 }
309/* LiteralStringDoc */ .chroma .sd { color: #4070a0; font-style: italic }
310/* LiteralStringDouble */ .chroma .s2 { color: #4070a0 }
311/* LiteralStringEscape */ .chroma .se { color: #4070a0; font-weight: bold }
312/* LiteralStringHeredoc */ .chroma .sh { color: #4070a0 }
313/* LiteralStringInterpol */ .chroma .si { color: #70a0d0; font-style: italic }
314/* LiteralStringOther */ .chroma .sx { color: #c65d09 }
315/* LiteralStringRegex */ .chroma .sr { color: #235388 }
316/* LiteralStringSingle */ .chroma .s1 { color: #4070a0 }
317/* LiteralStringSymbol */ .chroma .ss { color: #517918 }
318/* LiteralNumber */ .chroma .m { color: #40a070 }
319/* LiteralNumberBin */ .chroma .mb { color: #40a070 }
320/* LiteralNumberFloat */ .chroma .mf { color: #40a070 }
321/* LiteralNumberHex */ .chroma .mh { color: #40a070 }
322/* LiteralNumberInteger */ .chroma .mi { color: #40a070 }
323/* LiteralNumberIntegerLong */ .chroma .il { color: #40a070 }
324/* LiteralNumberOct */ .chroma .mo { color: #40a070 }
325/* Operator */ .chroma .o { color: #666666 }
326/* OperatorWord */ .chroma .ow { color: #007020; font-weight: bold }
327/* Punctuation */ .chroma .p { }
328/* Comment */ .chroma .c { color: #60a0b0; font-style: italic }
329/* CommentHashbang */ .chroma .ch { color: #60a0b0; font-style: italic }
330/* CommentMultiline */ .chroma .cm { color: #60a0b0; font-style: italic }
331/* CommentSingle */ .chroma .c1 { color: #60a0b0; font-style: italic }
332/* CommentSpecial */ .chroma .cs { color: #60a0b0; background-color: #fff0f0 }
333/* CommentPreproc */ .chroma .cp { color: #007020 }
334/* CommentPreprocFile */ .chroma .cpf { color: #007020 }
335/* Generic */ .chroma .g { }
336/* GenericDeleted */ .chroma .gd { color: #a00000 }
337/* GenericEmph */ .chroma .ge { font-style: italic }
338/* GenericError */ .chroma .gr { color: #ff0000 }
339/* GenericHeading */ .chroma .gh { color: #000080; font-weight: bold }
340/* GenericInserted */ .chroma .gi { color: #00a000 }
341/* GenericOutput */ .chroma .go { color: #888888 }
342/* GenericPrompt */ .chroma .gp { color: #c65d09; font-weight: bold }
343/* GenericStrong */ .chroma .gs { font-weight: bold }
344/* GenericSubheading */ .chroma .gu { color: #800080; font-weight: bold }
345/* GenericTraceback */ .chroma .gt { color: #0044dd }
346/* GenericUnderline */ .chroma .gl { text-decoration: underline }
347/* TextWhitespace */ .chroma .w { color: #bbbbbb }
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-22 11:27:11 +0000