diff options
Diffstat (limited to '_style.css')
-rw-r--r-- | _style.css | 570 |
1 files changed, 0 insertions, 570 deletions
diff --git a/_style.css b/_style.css deleted file mode 100644 index 1201582..0000000 --- a/_style.css +++ /dev/null | |||
@@ -1,570 +0,0 @@ | |||
1 | /* CSS for Autocento at the breakfast table | ||
2 | * Case Duckworth | autocento.me | ||
3 | * vim: fdm=marker | ||
4 | */ | ||
5 | /* COMMON CSS */ | ||
6 | /* @IMPORTS {{{ */ | ||
7 | /* Playfair Display: headings */ | ||
8 | @import url(http://fonts.googleapis.com/css?family=Playfair+Display:400,700,400italic,700italic&subset=latin,latin-ext); | ||
9 | /* Linux Libertine: body text */ | ||
10 | @import url(trunk/libertine.css); | ||
11 | /* Courier New: typewriter text */ | ||
12 | @import url(trunk/courier-prime.css); | ||
13 | /* @imports }}} */ | ||
14 | /* MAIN LAYOUT ELEMENTS {{{ */ | ||
15 | /* HTML + BODY {{{ */ | ||
16 | html, body { | ||
17 | margin: 0; | ||
18 | padding: 0; | ||
19 | font-family: "Libertine", Georgia, serif; | ||
20 | font-size: 100%; | ||
21 | } | ||
22 | html { | ||
23 | height: 100%; | ||
24 | } | ||
25 | body { | ||
26 | position: absolute; | ||
27 | top: 0; | ||
28 | left: 0; | ||
29 | right: 0; | ||
30 | min-height: 100%; | ||
31 | padding-left: 1em; | ||
32 | padding-right: 1em; | ||
33 | } | ||
34 | /* html + body }}} */ | ||
35 | /* HEADER + .CONTAINER + .CONTENT {{{ */ | ||
36 | header { | ||
37 | max-width: 39em; | ||
38 | margin: auto; | ||
39 | text-align: center; | ||
40 | border-bottom: 1px solid black; | ||
41 | padding: 1em 0; | ||
42 | margin-bottom: 1em; | ||
43 | position: relative; | ||
44 | } | ||
45 | .container { | ||
46 | margin: 0 auto; | ||
47 | padding-bottom: 30px; | ||
48 | text-align: center; | ||
49 | } | ||
50 | .content { | ||
51 | line-height: 1.3em; | ||
52 | } | ||
53 | /* header + .container + .content }}} */ | ||
54 | /* NAV + .FOOTNOTES {{{ */ | ||
55 | nav { | ||
56 | height: 24px; | ||
57 | width: 100%; | ||
58 | position: absolute; | ||
59 | bottom: 0; | ||
60 | left: 0; | ||
61 | text-align: center; | ||
62 | overflow: hidden; | ||
63 | } | ||
64 | .footnotes { | ||
65 | font-size: 0.85em; | ||
66 | width: 100%; | ||
67 | position: absolute; | ||
68 | top: 100%; | ||
69 | left: 0; | ||
70 | } | ||
71 | /* nav + .footnotes }}} */ | ||
72 | /* main layout elements }}} */ | ||
73 | /* HEADER ELEMENTS {{{ */ | ||
74 | /* .TITLE + .SUBTITLE {{{ */ | ||
75 | .title { | ||
76 | text-align: left; | ||
77 | display: inline-block; | ||
78 | font-family: "Playfair Display", Georgia, serif; | ||
79 | font-size: 1.5em; | ||
80 | font-weight: 400; | ||
81 | letter-spacing: 0.1em; | ||
82 | text-transform: uppercase; | ||
83 | margin: 0; | ||
84 | } | ||
85 | .subtitle { | ||
86 | text-align: center; | ||
87 | display: block; | ||
88 | font-family: "Playfair Display", Georgia, serif; | ||
89 | font-size: 1.25em; | ||
90 | font-style: italic; | ||
91 | font-weight: 400; | ||
92 | margin-top: 0; | ||
93 | margin-bottom: 0; | ||
94 | } | ||
95 | /* .title + .subtitle }}} */ | ||
96 | /* .HEADER-EXTRA {{{ */ | ||
97 | /* DEDICATION {{{ */ | ||
98 | .dedication { | ||
99 | font-style: italic; | ||
100 | font-size: 0.92em; | ||
101 | margin-top: 1em; | ||
102 | text-align: left; | ||
103 | } | ||
104 | .dedication::before { | ||
105 | content: 'for '; | ||
106 | font-style: italic; | ||
107 | } | ||
108 | .dedication:only-child { | ||
109 | text-align: right; | ||
110 | } | ||
111 | /* dedication }}} */ | ||
112 | /* EPIGRAPH {{{ */ | ||
113 | .epigraph { | ||
114 | text-align: right; | ||
115 | font-size: 0.92em; | ||
116 | font-style: italic; | ||
117 | margin-top: 1em; | ||
118 | } | ||
119 | .epigraph p { | ||
120 | margin: 0; | ||
121 | } | ||
122 | .epigraph .attrib { | ||
123 | text-align: right; | ||
124 | margin-top: 0; | ||
125 | font-size: 0.92em; | ||
126 | font-style: normal; | ||
127 | } | ||
128 | .epigraph .attrib::before { | ||
129 | content: '– '; | ||
130 | } | ||
131 | /* epigraph }}} */ | ||
132 | .header-extra { | ||
133 | text-align: right; | ||
134 | } | ||
135 | .dedication,.epigraph { | ||
136 | vertical-align: bottom; | ||
137 | display: inline-block; | ||
138 | margin-left: 2%; | ||
139 | margin-right: 2%; | ||
140 | width: 45%; | ||
141 | } | ||
142 | /* header-extra }}} */ | ||
143 | /* #SRC {{{ */ | ||
144 | #src { | ||
145 | border: none; | ||
146 | position: absolute; | ||
147 | top: 0; | ||
148 | right: 10px; | ||
149 | color: gray; | ||
150 | font-size: 8pt; | ||
151 | } | ||
152 | /* #src }}} */ | ||
153 | /* header elements }}} */ | ||
154 | /* .EKPHRASTIC {{{ */ | ||
155 | .ekphrastic { | ||
156 | max-width: 41em; | ||
157 | /* margin-top: -1em; */ | ||
158 | margin-bottom: 1em; | ||
159 | margin-left: auto; | ||
160 | margin-right: auto; | ||
161 | text-align: center; | ||
162 | } | ||
163 | .ekphrastic a:link { border: none; } | ||
164 | /* .ekphrastic }}} */ | ||
165 | /* .CONTENT ELEMENTS {{{ */ | ||
166 | /* BLOCK ELEMENTS {{{ */ | ||
167 | .content :first-child { | ||
168 | margin-top: 0; | ||
169 | } | ||
170 | h2 { | ||
171 | font-family: "Playfair Display", Georgia, serif; | ||
172 | font-size: 1em; | ||
173 | font-weight: 600; | ||
174 | } | ||
175 | blockquote { | ||
176 | border-left: 1px solid gray; | ||
177 | padding-left: 2em; | ||
178 | margin-left: 2em; | ||
179 | font-style: italic; | ||
180 | } | ||
181 | img { | ||
182 | max-width: 100%; | ||
183 | margin: auto; | ||
184 | } | ||
185 | /* block elements }}} */ | ||
186 | /* LINKS {{{ */ | ||
187 | a:link { | ||
188 | padding-top: 1px; | ||
189 | color: inherit; | ||
190 | text-decoration: none; | ||
191 | border-bottom: 1px dotted black; | ||
192 | } | ||
193 | a:visited { | ||
194 | color: inherit; | ||
195 | } | ||
196 | a:hover { | ||
197 | /* text-decoration: underline; */ | ||
198 | border-bottom: 1px solid black; | ||
199 | } | ||
200 | a:active { | ||
201 | /* text-decoration: underline; */ | ||
202 | border-bottom: 1px solid black; | ||
203 | } | ||
204 | /* External Links */ | ||
205 | a[href^="http"]:link { | ||
206 | text-decoration: none; | ||
207 | border-bottom: 1px dotted #a1a3a1; | ||
208 | } | ||
209 | a[href^="http"]:visited { | ||
210 | } | ||
211 | a[href^="http"]:hover { | ||
212 | border-bottom: 1px dashed black; | ||
213 | } | ||
214 | a[href^="http"]:active { | ||
215 | border-bottom: 1px dashed black; | ||
216 | } | ||
217 | /* links }}} */ | ||
218 | /* .content elements }}} */ | ||
219 | /* NAV ELEMENTS {{{ */ | ||
220 | nav a:link { border-bottom: none; } | ||
221 | nav a:active { border: none; } | ||
222 | nav .prevlink { | ||
223 | float: left; | ||
224 | text-align: left; | ||
225 | } | ||
226 | nav .nextlink { | ||
227 | float: right; | ||
228 | text-align: right; | ||
229 | } | ||
230 | /* Properties both types of navlinks share */ | ||
231 | nav .prevlink, nav .nextlink { | ||
232 | margin: 0 0.5em; | ||
233 | width: 20%; | ||
234 | display: block; | ||
235 | font-size: 0.85em; | ||
236 | font-family: "Playfair Display", Georgia, serif; | ||
237 | font-style: italic; | ||
238 | text-transform: lowercase; | ||
239 | height: 20px; | ||
240 | text-decoration: none; | ||
241 | position: relative; | ||
242 | display: table; | ||
243 | vertical-align: top; | ||
244 | } | ||
245 | nav .prevlink::before { | ||
246 | content: ' «'; | ||
247 | font-style: normal; | ||
248 | display: table-cell; | ||
249 | vertical-align: top; | ||
250 | text-align: left; | ||
251 | padding-left: 0.5em; | ||
252 | padding-right: 0.5em; | ||
253 | width: 1em; | ||
254 | } | ||
255 | nav .nextlink::after { | ||
256 | content: ' »'; | ||
257 | font-style: normal; | ||
258 | display: table-cell; | ||
259 | vertical-align: top; | ||
260 | text-align: right; | ||
261 | padding-left: 0.5em; | ||
262 | padding-right: 0.5em; | ||
263 | width: 1em; | ||
264 | } | ||
265 | #lozenge { | ||
266 | text-decoration: none; | ||
267 | } | ||
268 | nav .anchors { | ||
269 | position: absolute; | ||
270 | width: 100%; | ||
271 | text-align: center; | ||
272 | } | ||
273 | nav .anchors a { | ||
274 | margin-right: 0.25em; | ||
275 | margin-left: 0.25em; | ||
276 | } | ||
277 | /* nav elements }}} */ | ||
278 | /* .FOOTNOTES ELEMENTS {{{ */ | ||
279 | .footnotes li { | ||
280 | margin-right: 2em; | ||
281 | border-bottom: 1px solid gray; | ||
282 | max-width: 45em; | ||
283 | margin: auto; | ||
284 | } | ||
285 | .footnotes li:last-child { | ||
286 | border-bottom: none; | ||
287 | } | ||
288 | .footnotes p::first-line { | ||
289 | font-variant: normal !important; | ||
290 | } | ||
291 | .footnotes a[href^="#fnref"] { | ||
292 | float: right; | ||
293 | } | ||
294 | a.footnoteRef { | ||
295 | border: none; | ||
296 | } | ||
297 | /* .footnotes elements }}} */ | ||
298 | /* GENRE CSS */ | ||
299 | /* .PROSE {{{ */ | ||
300 | .prose { | ||
301 | display: inline-block; | ||
302 | text-align: justify; | ||
303 | max-width: 39em; | ||
304 | margin: auto; | ||
305 | hyphens: auto; | ||
306 | -moz-hyphens: auto; | ||
307 | } | ||
308 | .prose p::first-child::first-line { | ||
309 | font-variant: small-caps; | ||
310 | letter-spacing: 0.1em; | ||
311 | } | ||
312 | /* .prose }}} */ | ||
313 | /* .VERSE {{{ */ | ||
314 | .verse { | ||
315 | display: inline-block; | ||
316 | text-align: left; | ||
317 | } | ||
318 | .verse p { | ||
319 | margin-bottom: 1em; | ||
320 | margin-top: 1em; | ||
321 | } | ||
322 | .verse .line { | ||
323 | display: block; | ||
324 | margin: 0; | ||
325 | text-indent: -1em; | ||
326 | margin-left: 1em; | ||
327 | } | ||
328 | /* .verse }}} */ | ||
329 | /* .LIST {{{ */ | ||
330 | .list { | ||
331 | display: inline-block; | ||
332 | text-align: left; | ||
333 | max-width: 39em; | ||
334 | margin: auto; | ||
335 | hyphens: auto; | ||
336 | -moz-hyphens: auto; | ||
337 | } | ||
338 | /* .list }}} */ | ||
339 | /* .TABLE {{{ */ | ||
340 | .table { | ||
341 | display: inline-block; | ||
342 | text-align: left; | ||
343 | } | ||
344 | /* .table }}} */ | ||
345 | /* PROJECT CSS */ | ||
346 | /* #COVER {{{ */ | ||
347 | /* Flexboxing {{{ */ | ||
348 | #cover { | ||
349 | position: absolute; | ||
350 | top: 0; | ||
351 | bottom: 0; | ||
352 | left: 0; | ||
353 | right: 0; | ||
354 | display: -webkit-box; | ||
355 | display: -moz-box; | ||
356 | display: -ms-flexbox; | ||
357 | display: -webkit-flex; | ||
358 | display: flex; | ||
359 | -webkit-box-direction: normal; | ||
360 | -moz-box-direction: normal; | ||
361 | -webkit-box-orient: vertical; | ||
362 | -moz-box-orient: vertical; | ||
363 | -webkit-flex-direction: column; | ||
364 | -ms-flex-direction: column; | ||
365 | flex-direction: column; | ||
366 | -webkit-flex-wrap: nowrap; | ||
367 | -ms-flex-wrap: nowrap; | ||
368 | flex-wrap: nowrap; | ||
369 | -webkit-box-pack: center; | ||
370 | -moz-box-pack: center; | ||
371 | -webkit-justify-content: center; | ||
372 | -ms-flex-pack: center; | ||
373 | justify-content: center; | ||
374 | -webkit-align-content: center; | ||
375 | -ms-flex-line-pack: center; | ||
376 | align-content: center; | ||
377 | -webkit-box-align: center; | ||
378 | -moz-box-align: center; | ||
379 | -webkit-align-items: center; | ||
380 | -ms-flex-align: center; | ||
381 | align-items: center; | ||
382 | } | ||
383 | #cover .title { | ||
384 | -webkit-box-ordinal-group: 1; | ||
385 | -moz-box-ordinal-group: 1; | ||
386 | -webkit-order: 0; | ||
387 | -ms-flex-order: 0; | ||
388 | order: 0; | ||
389 | -webkit-box-flex: 0; | ||
390 | -moz-box-flex: 0; | ||
391 | -webkit-flex: 0 1 auto; | ||
392 | -ms-flex: 0 1 auto; | ||
393 | flex: 0 1 auto; | ||
394 | -webkit-align-self: auto; | ||
395 | -ms-flex-item-align: auto; | ||
396 | align-self: auto; | ||
397 | } | ||
398 | #cover .byline { | ||
399 | -webkit-box-ordinal-group: 1; | ||
400 | -moz-box-ordinal-group: 1; | ||
401 | -webkit-order: 0; | ||
402 | -ms-flex-order: 0; | ||
403 | order: 0; | ||
404 | -webkit-box-flex: 0; | ||
405 | -moz-box-flex: 0; | ||
406 | -webkit-flex: 0 1 auto; | ||
407 | -ms-flex: 0 1 auto; | ||
408 | flex: 0 1 auto; | ||
409 | -webkit-align-self: auto; | ||
410 | -ms-flex-item-align: auto; | ||
411 | align-self: auto; | ||
412 | } | ||
413 | #cover .anchors { | ||
414 | -webkit-box-ordinal-group: 1; | ||
415 | -moz-box-ordinal-group: 1; | ||
416 | -webkit-order: 0; | ||
417 | -ms-flex-order: 0; | ||
418 | order: 0; | ||
419 | -webkit-box-flex: 0; | ||
420 | -moz-box-flex: 0; | ||
421 | -webkit-flex: 0 1 auto; | ||
422 | -ms-flex: 0 1 auto; | ||
423 | flex: 0 1 auto; | ||
424 | -webkit-align-self: auto; | ||
425 | -ms-flex-item-align: auto; | ||
426 | align-self: auto; | ||
427 | } | ||
428 | /* }}} */ | ||
429 | #cover { | ||
430 | color: #b2d9e5; | ||
431 | background-image: url('trunk/black-streak.jpg'); | ||
432 | background-position: 0 0; | ||
433 | background-size: 100% 100%; | ||
434 | background-repeat: no-repeat; | ||
435 | background-attachment: fixed; | ||
436 | background-clip: border-box; | ||
437 | background-color: black; | ||
438 | } | ||
439 | #cover header { | ||
440 | border: none; | ||
441 | margin: auto; | ||
442 | padding: 0; | ||
443 | } | ||
444 | #cover .content { | ||
445 | max-width: 39em; | ||
446 | margin: auto; | ||
447 | } | ||
448 | #cover a { | ||
449 | text-decoration: none; | ||
450 | border: none; | ||
451 | } | ||
452 | #cover a:link { | ||
453 | color: #b2d9e5; | ||
454 | } | ||
455 | #cover a:visited { | ||
456 | color: #b2b2e5; | ||
457 | } | ||
458 | #cover a:hover { | ||
459 | color: #e5bfb2; | ||
460 | } | ||
461 | #cover a:active { | ||
462 | color: #e5e5b2; | ||
463 | } | ||
464 | #cover li { | ||
465 | list-style: none; | ||
466 | } | ||
467 | #cover .title { | ||
468 | text-transform: uppercase; | ||
469 | text-align: center; | ||
470 | font-size: 1.8em; | ||
471 | letter-spacing: 0.5em; | ||
472 | color: #efefb2; | ||
473 | } | ||
474 | #cover .byline { | ||
475 | font-style: italic; | ||
476 | text-align: center; | ||
477 | font-size: 1.3em; | ||
478 | letter-spacing: 0.2em; | ||
479 | color: #e5bfb2; | ||
480 | } | ||
481 | #cover .anchors a { | ||
482 | margin-left: 0.25em; | ||
483 | margin-right: 0.25em; | ||
484 | } | ||
485 | #cover .lozenge { | ||
486 | text-align: center; | ||
487 | font-size: 1em; | ||
488 | color: #e5bfb2; | ||
489 | } | ||
490 | /* #cover }}} */ | ||
491 | /* .ELEGIES {{{ */ | ||
492 | .elegies { | ||
493 | } | ||
494 | /* .elegies }}} */ | ||
495 | /* .HEZEKIAH {{{ */ | ||
496 | /* .hezekiah }}} */ | ||
497 | /* .STARK {{{ */ | ||
498 | /* TODO: Change to Everything Changes? */ | ||
499 | table { border-collapse: collapse; } | ||
500 | td { | ||
501 | vertical-align: top; | ||
502 | padding-top: 0.25em; | ||
503 | padding-bottom: 0.25em; | ||
504 | } | ||
505 | tr { | ||
506 | border-bottom: 1px solid black; | ||
507 | border-top: 1px solid black; | ||
508 | } | ||
509 | /* .stark }}} */ | ||
510 | /* .PAUL {{{ */ | ||
511 | /* Blockquote = typewriter */ | ||
512 | .paul blockquote { | ||
513 | font-family: "Courier Prime", "Courier New", Courier, monospace; | ||
514 | font-style: normal; | ||
515 | font-size: 10pt; | ||
516 | border: 1px solid black; | ||
517 | max-width: 30em; | ||
518 | margin: auto; | ||
519 | padding: 1em; | ||
520 | text-align: left; | ||
521 | } | ||
522 | .paul blockquote :last-child { | ||
523 | margin: 0; | ||
524 | } | ||
525 | .paul blockquote p::first-line { | ||
526 | font-variant: normal !important; | ||
527 | } | ||
528 | .paul blockquote ul { | ||
529 | list-style-type: none; | ||
530 | } | ||
531 | .paul blockquote ul li::before { | ||
532 | content: '- '; | ||
533 | } | ||
534 | |||
535 | /* Emphasis = handwritten */ | ||
536 | .paul em { | ||
537 | /* font-family: "Playfair Display", Georgia, sans-serif; */ | ||
538 | font-style: italic; | ||
539 | } | ||
540 | /* .paul }}} */ | ||
541 | /* .AUTOCENTO {{{ */ | ||
542 | .autocento { | ||
543 | background-color: white; | ||
544 | } | ||
545 | /* .autocento }}} */ | ||
546 | /* ARTICLE CSS */ | ||
547 | /* #TABLE_CONTENTS {{{ */ | ||
548 | #table_contents table { | ||
549 | max-width: 39em; | ||
550 | } | ||
551 | #table_contents tr { | ||
552 | border: none; | ||
553 | } | ||
554 | #table_contents td { | ||
555 | max-width: 50%; | ||
556 | } | ||
557 | /* #table_contents }}} */ | ||
558 | /* #ABOUT_AUTHOR {{{ */ | ||
559 | #about-the-author td { | ||
560 | vertical-align: middle; | ||
561 | } | ||
562 | /* #about_author }}} */ | ||
563 | /* #ABOUT {{{ */ | ||
564 | #about img { | ||
565 | max-width: 10em; | ||
566 | float: right; | ||
567 | padding-top: 0.5em; | ||
568 | padding-left: 1em; | ||
569 | } | ||
570 | /* #about }}} */ | ||