noxz.tech/pub/style.css
1body {
2 background-color: #fff;
3 color : #222;
4 font-family : serif;
5 font-size : 1.2em;
6 line-height : 1.6;
7 padding : 0;
8 margin : 0;
9 overflow-y : scroll;
10}
11
12/* begining: setup centered theme */
13#header > div, #footer > div, #content > div {
14 max-width : 980px;
15 margin : 0 auto;
16}
17
18#content > div {
19 max-width : 1000px;
20 background-color: #ffffff;
21 border : none;
22}
23/* end: setup centered theme */
24
25a {
26 color : #005386;
27 text-decoration : none;
28}
29
30a:hover {
31 text-decoration : underline;
32}
33
34hr.hidden-ruler {
35 display : none;
36}
37
38img {
39 max-width : 100%;
40}
41
42#header {
43 clear : both;
44 color : #000;
45 background : #fff;
46 height : 2.75em;
47 font-size : 1.3em;
48 font-family : monospace;
49 line-height : 2.75em;
50 padding : 0 1em;
51 border-bottom : 1px solid #f4f4f4;
52}
53
54#header-logo img {
55 vertical-align : middle;
56 margin-right : 0.5em;
57}
58
59#header-subtitle {
60 color : #cacaca;
61 display : inline-block;
62 font-size : 0.75em;
63 font-style : italic;
64}
65
66#header-link,
67#header-link:hover,
68#header-logo:hover {
69 color : inherit;
70 background-color: inherit;
71 text-decoration : none;
72}
73
74#header-source {
75 color : inherit;
76 font-size : 0.75em;
77 float : right;
78}
79
80h1, h2, h3, h4 {
81 font-family : sans-serif;
82}
83
84h1 {
85 border-bottom : 1px solid #cacaca;
86 margin : 1em 0 1em 0;
87 padding : 0 0 0.25em 0;
88 font-size : 1.4rem;
89}
90
91h2, h3, h4 {
92 margin : 1em 0 0em 0;
93}
94
95h2 {
96 font-size : 1.3rem;
97}
98
99h3 {
100 font-size : 1.0rem;
101}
102
103h4 {
104 font-size : 0.9rem;
105}
106
107p, li {
108 color : #444;
109}
110
111#main p, #main li {
112 text-align : justify;
113 overflow-wrap : break-word;
114 word-wrap : break-word;
115 -ms-word-break : break-word;
116 word-break : break-word;
117 -ms-hyphens : auto;
118 -moz-hyphens : auto;
119 -webkit-hyphens : auto;
120 hyphens : auto;
121}
122
123code {
124 font-family : monospace;
125 font-size : 1rem;
126 background-color: #efefef;
127 padding : 0.3em;
128}
129
130pre {
131 background-color: #fafafa;
132 padding : 1em;
133 overflow : auto;
134}
135
136pre code {
137 font-size : 0.9rem;
138 background-color: inherit !important;
139 padding : 0;
140}
141
142.code-wrap {
143 overflow : scroll;
144 display : grid;
145}
146
147#content {
148 clear : both;
149 margin : 0;
150 padding : 0;
151 overflow : hidden;
152}
153
154#nav {
155 background-color: #ffffff;
156 margin : 0 1px 0 0;
157 padding : 1em 0;
158 border-right : 1px solid #f4f4f4;
159 min-width : 10em;
160}
161
162#nav ul {
163 margin : 0;
164 padding : 0;
165}
166
167#nav li {
168 list-style : none;
169 padding : 0;
170 margin : 0;
171}
172
173#nav>div>ul:first-child li>a:before {
174 display : inline-block;
175 margin-left : -1em;
176 width : 1em;
177}
178
179#nav>div>ul:first-child li>a:hover:before {
180 content : "\203A";
181}
182
183#nav>div>ul:first-child li.active>a:before {
184 content : "\00BB";
185}
186
187/* keep link hover over full width, base level */
188#nav li a {
189 display : block;
190 margin : 0;
191 padding : 0.2em 2em;
192 font-family : sans-serif;
193 font-size : .9em;
194}
195
196/* keep link hover over full width, first level */
197#nav li ul>li a {
198 padding-left : 2.6em !important;
199}
200
201/* keep link hover over full width, second level */
202#nav li ul ul>li a {
203 padding-left : 3.2em !important;
204}
205
206/* keep link hover over full width, third level */
207#nav li ul ul ul>li a {
208 padding-left : 3.8em !important;
209}
210
211#nav li a:hover {
212 background-color: #fafafa;
213 text-decoration : none;
214}
215
216#nav li.active>a {
217 color : #222;
218}
219
220#main {
221/* margin : 0 0 0 200px;*/
222 padding : 0 1.5em;
223/* max-width : 50em;*/
224}
225
226#footer {
227 clear : both;
228 color : #666;
229 border-top : 1px solid #f4f4f4;
230 font-size : 0.85em;
231 font-family : monospace;
232 line-height : 1.7em;
233 padding : 1em;
234 margin : 0 0 1.5em 0;
235}
236
237span.left {
238 float : left;
239 margin : 0;
240 padding : 0;
241}
242
243span.right {
244 float : right;
245 margin : 0;
246 padding : 0;
247}
248
249.definition {
250 padding-left : 2em;
251}
252
253.definition>p:first-child {
254 text-indent : -2em;
255}
256
257.reference {
258 padding-left : 2em;
259 text-indent : -2em;
260}
261
262#main p.left {
263 text-align : left;
264}
265
266#main p.center {
267 text-align : center;
268}
269
270#main p.right {
271 text-align : right;
272}
273
274#main .note {
275 background : #fdf8d9;
276 padding : .6rem 1rem;
277 border-radius : 0.5rem;
278 margin-bottom : 1rem;
279}
280
281#main .edit-note {
282 background : #efd9fd;
283 padding : 0.1rem 1rem;
284 font-family : sans-serif;
285 font-size : 80%;
286 border-radius : 0.5rem;
287 margin-bottom : 1rem;
288}
289
290#main .edit-note dl {
291 padding : 0.5rem;
292}
293
294#main .edit-note h3 {
295 color : #3b2e58;
296 background : none no-repeat 0rem center;
297 background-image: url("./warn.svg");
298 padding-left : 1.5rem;
299}
300
301#main .edit-note dt {
302 color : #3b2e58;
303 text-indent : 0;
304}
305
306#main .edit-note dd {
307 clear : both;
308}
309
310#main .edit-note dd>ul {
311 padding : 0 1rem;
312}
313
314#main p.preamble
315{
316 font-size : 120%;
317 font-style : italic;
318}
319
320#main p.article-author, #main p.article-date {
321 background : none no-repeat 0rem center;
322 padding-left : 1.5rem;
323 display : inline-block;
324 font-family : sans-serif;
325 font-size : 90%;
326 line-height : 1.5;
327 margin : 0 1.5rem 0 0;
328}
329
330#main p.article-date {
331 background-image: url("./date.svg");
332}
333
334#main p.article-author {
335 background-image: url("./author.svg");
336}
337
338#main p.article-date ~ .wrap-list {
339 margin-top : -.5em;
340}
341
342.wrap-list>ul {
343 flex-wrap : wrap !important;
344 display : flex !important;
345 padding-left : 0;
346 list-style : none;
347 box-sizing : border-box;
348}
349
350.wrap-list>ul>li {
351 margin-right : 0.5rem !important;
352 margin-top : 0.5rem !important;
353 box-sizing : border-box;
354}
355
356.art-tag {
357 display : inline-block;
358 background : #fafafa;
359 padding : 0.25rem 0.5rem;
360 font-family : sans-serif;
361 font-size : 90%;
362 line-height : 1.5;
363 border-radius : 0.25rem;
364 text-align : center;
365 vertical-align : middle;
366}
367
368.art-tag>span {
369 display : inline-block;
370 background : #444;
371 color : #fafafa;
372 padding : 0.25em 0.4em;
373 font-size : 65%;
374 font-weight : 700;
375 line-height : 1;
376 text-align : center;
377 white-space : nowrap;
378 vertical-align : middle;
379 border-radius : 0.25rem;
380}
381
382.art-tag:hover {
383 text-decoration : none;
384 background : #005386;
385 color : #fafafa;
386}
387
388.art-tag:hover>span {
389 background : #fafafa;
390 color : #444;
391}
392
393.spoiler {
394 color : #000;
395 background : #000;
396 cursor : pointer;
397}
398
399.spoiler:active {
400 color : inherit;
401 background : inherit;
402}
403
404.articles ul {
405 margin : 0;
406 padding : 0;
407}
408
409.articles li {
410 list-style : none;
411 padding : 0;
412 margin : 0;
413}
414
415a.twtxt, a.howto, a.source, a.pin {
416 display : block;
417 background : none no-repeat 0.7em center;
418 background-size : 0.95em;
419 padding : 0.2em 0 0.2em 2em !important;
420 margin : 0;
421}
422
423a.twtxt {
424 background-image: url("./twtxt.svg");
425}
426
427a.howto {
428 background-image: url("./howto.svg");
429}
430
431a.pin {
432 background-image: url("./pin.svg");
433}
434
435a.source {
436 display : none !important;
437 background-image: url("./source.svg");
438}
439
440ul.repo-log {
441 list-style-type : none;
442 margin : 1em 0;
443 padding : 0;
444}
445
446ul.repo-log li {
447 font-family : monospace;
448 font-size : 0.7em;
449 text-align : left !important;
450}
451
452ul.repo-log li .log-date {
453 font-weight : bold;
454 padding-right : 1em;
455}
456
457/* table of contents */
458.toc {
459 background-color: #f6f7fa;
460 padding : 0.5em 2em 2em;
461 overflow : auto;
462 font-family : sans-serif;
463}
464
465.toc .toc-title {
466 font-weight : 700;
467}
468
469.toc>ul,
470.toc>ul ul {
471 list-style-type : none;
472 list-style : none;
473 margin : 0;
474 padding : 0;
475}
476
477.toc>ul ul {
478 padding-left : 1.5em;
479}
480
481.toc li {
482 list-style-type : none;
483 list-style : none;
484 margin : 0;
485 padding : 0;
486}
487
488
489.eqn img {
490 margin-left : 2em;
491 padding : 1em 1.5em;
492 border : 1px solid #ccc;
493}
494
495.theorem img {
496 padding : 1em 1.5em;
497 border : 1px double #000;
498 outline : 2px solid #000;
499 outline-offset : -4px;
500}
501
502dl, dt, dd {
503 padding : 0;
504 margin : 0;
505}
506dt {
507 float : left;
508 font-weight : bolder;
509 padding-right : 1ch;
510 text-align : right;
511}
512dd {
513 margin-bottom : 1em;
514}
515dl {
516 padding-left : 2em;
517}
518dl>dt {
519 text-indent : -2em;
520}
521
522#hamburger { display: none; }
523#hamburger ~ label { display: none; }
524@media screen and (max-width: 768px) {
525 table,
526 table tbody,
527 table tr,
528 table tr td { display: block !important; }
529 #burger-wrapper { display: none; }
530 #nav {
531 width : auto;
532 max-width : 15em;
533 border : none;
534 padding : 0;
535 }
536 #main {
537 padding : 0 0.5em;
538 }
539 #hamburger ~ label {
540 display : block;
541 color : black;
542 background : white;
543 font-style : normal;
544 text-align : center;
545 font-size : 1.4rem;
546 padding : .45em .6em;
547 user-select : none;
548 cursor : pointer;
549
550 position : absolute;
551 position : fixed;
552 top : 0;
553 right : 0;
554 z-index : 999;
555 }
556 #hamburger ~ label:before { content: "\2630" }
557 #hamburger:checked ~ label:before { content: "\2A09" }
558 #hamburger:checked ~ #burger-wrapper { display: block; }
559 #hamburger:checked ~ label {
560 color : white;
561 background : black;
562 }
563 #hamburger ~ #burger-wrapper {
564 width : 100%;
565 position : fixed;
566 font-size : 1.4rem;
567 top : 2.3em;
568 bottom : 0;
569 left : 0;
570 padding : 0.5em 0;
571 background : #fff;
572 overflow-x : scroll;
573 }
574 #header {
575 width : 100%;
576 position : fixed;
577 top : 0;
578 z-index : 998;
579 }
580 #content {
581 margin : 2.75em 0 0 0;
582 }
583 #header-source {
584 display : none;
585 }
586 a.twtxt, a.howto, a.source {
587 display : block !important;
588 }
589}
590
591@media print {
592 #header, #nav { display: none }
593 #content>div, #footer>div { max-width: inherit; }
594 #footer .right {display: none }
595 #footer::after {
596 content: "Copyright © 2006-" attr(data-date) " Chris Noxz";
597 display: block;
598 text-align: right;
599 }
600 .code-wrap, p { page-break-inside: avoid; break-inside: avoid; }
601}
