summary refs log tree commit diff stats
diff options
context:
space:
mode:
authorCase Duckworth2015-03-13 00:28:55 -0700
committerCase Duckworth2015-03-13 00:28:55 -0700
commit4aa88b6adcea4f81d6e57b268f8351637ae07d04 (patch)
tree1806b8a75c52ce4df372bfa4319cca6aec9e5460
parentFix bug in Last Passenger link (diff)
downloadautocento-4aa88b6adcea4f81d6e57b268f8351637ae07d04.tar.gz
autocento-4aa88b6adcea4f81d6e57b268f8351637ae07d04.zip
Change <header> CSS and fonts
- Change <header>
    - to have a bottom border
    - Dedication is now left-aligned
    - Margin stuff
- Change fonts
    - Title, subtitle = Playfair Display
    - Rest = Linux Libertine
-rw-r--r--.template.html10
-rw-r--r--about-the-author.html2
-rw-r--r--amber-alert.html2
-rw-r--r--and.html2
-rw-r--r--call-me-aural-pleasure.html2
-rw-r--r--cold-wind.html2
-rw-r--r--css/common.css83
-rw-r--r--css/paul.css2
-rw-r--r--death-zone.html2
-rw-r--r--deathstrumpet.html2
-rw-r--r--ex-machina.html2
-rw-r--r--found-typewriter-poem.html2
-rw-r--r--hard-game.html2
-rw-r--r--i-think-its-you.html2
-rw-r--r--lappel-du-vide.html2
-rw-r--r--music-433.html2
-rw-r--r--ouroboros_memory.html2
-rw-r--r--sixteenth-chapel.html6
-rw-r--r--table_contents.html2
19 files changed, 73 insertions, 58 deletions
diff --git a/.template.html b/.template.html index 3db6708..19d5254 100644 --- a/.template.html +++ b/.template.html
@@ -41,6 +41,11 @@
41 $if(title)$<h1 class="title">$title$</h1>$endif$ 41 $if(title)$<h1 class="title">$title$</h1>$endif$
42 $if(subtitle)$<h1 class="subtitle">$subtitle$</h1>$endif$ 42 $if(subtitle)$<h1 class="subtitle">$subtitle$</h1>$endif$
43 43
44 $if(dedication)$
45 <!-- dedication -->
46 <div class="dedication">$dedication$</div>
47 $endif$
48
44 $if(epigraph.content)$ 49 $if(epigraph.content)$
45 <!-- epigraph --> 50 <!-- epigraph -->
46 <div class="epigraph"> 51 <div class="epigraph">
@@ -55,11 +60,6 @@
55 $endif$ 60 $endif$
56 </div> 61 </div>
57 $endif$ 62 $endif$
58
59 $if(dedication)$
60 <!-- dedication -->
61 <div class="dedication">$dedication$</div>
62 $endif$
63 </header> 63 </header>
64 64
65 $if(ekphrastic.image)$ 65 $if(ekphrastic.image)$
diff --git a/about-the-author.html b/about-the-author.html index b8cdd52..71af41d 100644 --- a/about-the-author.html +++ b/about-the-author.html
@@ -34,12 +34,12 @@
34 <h1 class="title">About the author</h1> 34 <h1 class="title">About the author</h1>
35 <h1 class="subtitle">(not pictured)</h1> 35 <h1 class="subtitle">(not pictured)</h1>
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 The body that surrounds him is his, but his insides are not. 40 The body that surrounds him is his, but his insides are not.
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 45
diff --git a/amber-alert.html b/amber-alert.html index dee1d0f..696cf0f 100644 --- a/amber-alert.html +++ b/amber-alert.html
@@ -34,12 +34,12 @@
34 <h1 class="title">AMBER alert</h1> 34 <h1 class="title">AMBER alert</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://www.boston.com/bostonglobe/ideas/articles/2008/07/20/abducted/?page=full">Apparently it does nothing.</a> 40 <a href="http://www.boston.com/bostonglobe/ideas/articles/2008/07/20/abducted/?page=full">Apparently it does nothing.</a>
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 <div class="ekphrastic"> 45 <div class="ekphrastic">
diff --git a/and.html b/and.html index 0b5f288..29134e7 100644 --- a/and.html +++ b/and.html
@@ -34,6 +34,7 @@
34 <h1 class="title">And</h1> 34 <h1 class="title">And</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://www.theguardian.com/lifeandstyle/2011/oct/28/margaret-atwood-q-a"><p>“What is your favorite word?”</p> 40 <a href="http://www.theguardian.com/lifeandstyle/2011/oct/28/margaret-atwood-q-a"><p>“What is your favorite word?”</p>
@@ -41,7 +42,6 @@
41 42
42 <div class="attrib">Margaret Atwood</div> 43 <div class="attrib">Margaret Atwood</div>
43 </div> 44 </div>
44
45 </header> 45 </header>
46 46
47 47
diff --git a/call-me-aural-pleasure.html b/call-me-aural-pleasure.html index 31caf3d..fdf6460 100644 --- a/call-me-aural-pleasure.html +++ b/call-me-aural-pleasure.html
@@ -34,12 +34,12 @@
34 <h1 class="title">Call me</h1> 34 <h1 class="title">Call me</h1>
35 <h1 class="subtitle">aural pleasure</h1> 35 <h1 class="subtitle">aural pleasure</h1>
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="https://www.facebook.com/kittensruleforever38"><p>compiled thru Facebook statuses of the author</p></a> 40 <a href="https://www.facebook.com/kittensruleforever38"><p>compiled thru Facebook statuses of the author</p></a>
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 45
diff --git a/cold-wind.html b/cold-wind.html index d1b131c..eac8805 100644 --- a/cold-wind.html +++ b/cold-wind.html
@@ -34,9 +34,9 @@
34 <h1 class="title">Cold wind</h1> 34 <h1 class="title">Cold wind</h1>
35 35
36 36
37
38 <!-- dedication --> 37 <!-- dedication -->
39 <div class="dedication">Justin</div> 38 <div class="dedication">Justin</div>
39
40 </header> 40 </header>
41 41
42 42
diff --git a/css/common.css b/css/common.css index aff7569..581f163 100644 --- a/css/common.css +++ b/css/common.css
@@ -14,7 +14,7 @@ html, body {
14 margin: 0; 14 margin: 0;
15 padding: 0; 15 padding: 0;
16 16
17 font-family: "Fira Sans", sans-serif; 17 font-family: "Linux Libertine O", sans-serif;
18 font-size: 12pt; 18 font-size: 12pt;
19} 19}
20html { height: 100%; } 20html { height: 100%; }
@@ -31,6 +31,8 @@ header {
31 max-width: 39em; 31 max-width: 39em;
32 margin: auto; 32 margin: auto;
33 text-align: center; 33 text-align: center;
34 border-bottom: 1px solid black;
35 padding: 1em 0;
34 margin-bottom: 1em; 36 margin-bottom: 1em;
35} 37}
36.title { 38.title {
@@ -42,13 +44,16 @@ header {
42 display: block; 44 display: block;
43} 45}
44.dedication { 46.dedication {
45 text-align: right; 47 text-align: left;
46} 48}
47#container { 49#container {
48 /* max-width: 39em; */ 50 /* max-width: 39em; */
49 margin: 0 auto; 51 margin: 0 auto;
50 padding-bottom: 30px; 52 padding-bottom: 30px;
51} 53}
54.content p:first-child {
55 margin-top: 0
56}
52nav { 57nav {
53 height: 24px; 58 height: 24px;
54 width: 100%; 59 width: 100%;
@@ -74,6 +79,35 @@ nav {
74 border-bottom: none; 79 border-bottom: none;
75} 80}
76/* layout }}} */ 81/* layout }}} */
82/* HEADINGS {{{ */
83.title {
84 font-family: "Playfair Display", Georgia, serif;
85 font-size: 18pt;
86 /* font-weight: bold; */
87 font-weight: 400;
88 letter-spacing: 0.1em;
89 text-transform: uppercase;
90 margin: 0;
91}
92.subtitle {
93 font-family: "Playfair Display", Georgia, serif;
94 font-size: 15pt;
95 font-style: italic;
96 font-weight: 400;
97 /* position: relative; */
98 /* top: -0.5em; */
99 margin-top: 0;
100 margin-bottom: 0;
101}
102h2 {
103 font-family: "Playfair Display", Georgia, serif;
104 font-size: 12pt;
105 font-weight: 600;
106}
107header {
108 position: relative;
109}
110/* headings }}} */
77/* LINKS {{{ */ 111/* LINKS {{{ */
78a:link { 112a:link {
79 padding-top: 1px; 113 padding-top: 1px;
@@ -106,46 +140,24 @@ a[href^="http"]:active {
106/* links }}} */ 140/* links }}} */
107/* IMAGES {{{ */ 141/* IMAGES {{{ */
108.ekphrastic { 142.ekphrastic {
109 max-width: 39em; 143 max-width: 41em;
110 margin: auto; 144 margin-top: -1em;
145 margin-bottom: 1em;
146 margin-left: auto;
147 margin-right: auto;
111 text-align: center; 148 text-align: center;
112} 149}
150.ekphrastic a:link { border: none; }
113img { 151img {
114 max-width: 100%; 152 max-width: 100%;
115 margin: auto; 153 margin: auto;
116} 154}
117/* images }}} */ 155/* images }}} */
118/* HEADINGS {{{ */
119.title {
120 font-family: "Playfair Display", Georgia, serif;
121 font-size: 16pt;
122 /* font-weight: bold; */
123 font-weight: 400;
124 letter-spacing: 0.1em;
125 text-transform: uppercase;
126}
127.subtitle {
128 font-family: "Playfair Display", Georgia, serif;
129 font-size: 15pt;
130 font-style: italic;
131 font-weight: 400;
132 position: relative;
133 top: -0.5em;
134 margin-top: 0;
135 margin-bottom: 0;
136}
137h2 {
138 font-family: "Playfair Display", Georgia, serif;
139 font-size: 12pt;
140 font-weight: 600;
141}
142/* headings }}} */
143/* DEDICATION {{{ */ 156/* DEDICATION {{{ */
144.dedication { 157.dedication {
145 font-style: italic; 158 font-style: italic;
146 font-size: 10pt; 159 font-size: 11pt;
147 margin-top: 1em; 160 margin-top: 1em;
148 margin-bottom: 1em;
149} 161}
150.dedication::before { 162.dedication::before {
151 content: 'for '; 163 content: 'for ';
@@ -155,8 +167,10 @@ h2 {
155/* EPIGRAPH {{{ */ 167/* EPIGRAPH {{{ */
156.epigraph { 168.epigraph {
157 text-align: right; 169 text-align: right;
158 font-size: 10pt; 170 font-size: 11pt;
159 font-style: italic; 171 font-style: italic;
172 /* font-family: "Playfair Display", Georgia, serif; */
173 margin-top: 1em;
160} 174}
161.epigraph p { 175.epigraph p {
162 margin: 0; 176 margin: 0;
@@ -164,8 +178,8 @@ h2 {
164.epigraph .attrib { 178.epigraph .attrib {
165 text-align: right; 179 text-align: right;
166 margin-top: 0; 180 margin-top: 0;
167 font-size: 10pt; 181 font-size: 11pt;
168 font-style: italic; 182 font-style: normal;
169} 183}
170.epigraph .attrib::before { 184.epigraph .attrib::before {
171 content: '– '; 185 content: '– ';
@@ -173,6 +187,7 @@ h2 {
173/* epigraph }}} */ 187/* epigraph }}} */
174/* NAV {{{ */ 188/* NAV {{{ */
175nav a:link { border-bottom: none; } 189nav a:link { border-bottom: none; }
190nav a:active { border: none; }
176nav .prevlink { float: left; text-align: left; } 191nav .prevlink { float: left; text-align: left; }
177nav .nextlink { float: right; text-align: right; } 192nav .nextlink { float: right; text-align: right; }
178/* Properties both types of navlinks share */ 193/* Properties both types of navlinks share */
diff --git a/css/paul.css b/css/paul.css index badac15..c4d9e15 100644 --- a/css/paul.css +++ b/css/paul.css
@@ -29,6 +29,6 @@ blockquote ul li::before {
29 29
30/* Emphasis = handwritten */ 30/* Emphasis = handwritten */
31em { 31em {
32 font-family: "Playfair Display", Georgia, sans-serif; 32 /* font-family: "Playfair Display", Georgia, sans-serif; */
33 font-style: italic; 33 font-style: italic;
34} 34}
diff --git a/death-zone.html b/death-zone.html index e96d599..b38aaf8 100644 --- a/death-zone.html +++ b/death-zone.html
@@ -34,13 +34,13 @@
34 <h1 class="title">The Death Zone</h1> 34 <h1 class="title">The Death Zone</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://www.npr.org/blogs/13.7/2013/11/19/245996903/embracing-life-and-death">And my life became death.</a> 40 <a href="http://www.npr.org/blogs/13.7/2013/11/19/245996903/embracing-life-and-death">And my life became death.</a>
40 41
41 <div class="attrib">Philip Gould</div> 42 <div class="attrib">Philip Gould</div>
42 </div> 43 </div>
43
44 </header> 44 </header>
45 45
46 <div class="ekphrastic"> 46 <div class="ekphrastic">
diff --git a/deathstrumpet.html b/deathstrumpet.html index fa0740d..7ff2309 100644 --- a/deathstrumpet.html +++ b/deathstrumpet.html
@@ -34,13 +34,13 @@
34 <h1 class="title">Death’s trumpet</h1> 34 <h1 class="title">Death’s trumpet</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <p>So Death plays his little <a href="apollo11.html">fucking</a> trumpet. So what, says the boy.</p> 40 <p>So Death plays his little <a href="apollo11.html">fucking</a> trumpet. So what, says the boy.</p>
40 41
41 <div class="attrib">Larry Levis</div> 42 <div class="attrib">Larry Levis</div>
42 </div> 43 </div>
43
44 </header> 44 </header>
45 45
46 46
diff --git a/ex-machina.html b/ex-machina.html index 9f89fe7..be62bac 100644 --- a/ex-machina.html +++ b/ex-machina.html
@@ -34,12 +34,12 @@
34 <h1 class="title">Ex machina</h1> 34 <h1 class="title">Ex machina</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://ngm.nationalgeographic.com/2013/08/sugar/cohen-text">with lines from National Geographic</a> 40 <a href="http://ngm.nationalgeographic.com/2013/08/sugar/cohen-text">with lines from National Geographic</a>
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 45
diff --git a/found-typewriter-poem.html b/found-typewriter-poem.html index 803bb4a..507d53f 100644 --- a/found-typewriter-poem.html +++ b/found-typewriter-poem.html
@@ -34,12 +34,12 @@
34 <h1 class="title">Look</h1> 34 <h1 class="title">Look</h1>
35 <h1 class="subtitle">a found typewriter poem</h1> 35 <h1 class="subtitle">a found typewriter poem</h1>
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <p><a href="http://books.google.com/books?id=ALdlAAAAMAAJ&amp;focus=searchwithinvolume&amp;q=older+than">Is he older</a>? I asked her. And I never got an answer, because at the moment she disappeared in a puff of smoke. I like to think nothing ever happened to her save that she went over to the spirit realm. I usually know better though.</p> 40 <p><a href="http://books.google.com/books?id=ALdlAAAAMAAJ&amp;focus=searchwithinvolume&amp;q=older+than">Is he older</a>? I asked her. And I never got an answer, because at the moment she disappeared in a puff of smoke. I like to think nothing ever happened to her save that she went over to the spirit realm. I usually know better though.</p>
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 45
diff --git a/hard-game.html b/hard-game.html index d82cc89..794fbde 100644 --- a/hard-game.html +++ b/hard-game.html
@@ -34,9 +34,9 @@
34 <h1 class="title">A hard game</h1> 34 <h1 class="title">A hard game</h1>
35 35
36 36
37
38 <!-- dedication --> 37 <!-- dedication -->
39 <div class="dedication">Jim Henson</div> 38 <div class="dedication">Jim Henson</div>
39
40 </header> 40 </header>
41 41
42 42
diff --git a/i-think-its-you.html b/i-think-its-you.html index 4614ba2..b926a52 100644 --- a/i-think-its-you.html +++ b/i-think-its-you.html
@@ -34,12 +34,12 @@
34 <h1 class="title">I think it’s you (but it’s not)</h1> 34 <h1 class="title">I think it’s you (but it’s not)</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="i-think-its-you.html">When you fall in love everyone looks the same.</a> 40 <a href="i-think-its-you.html">When you fall in love everyone looks the same.</a>
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 45
diff --git a/lappel-du-vide.html b/lappel-du-vide.html index d22a9c1..fafe14d 100644 --- a/lappel-du-vide.html +++ b/lappel-du-vide.html
@@ -34,13 +34,13 @@
34 <h1 class="title">L’appel du vide</h1> 34 <h1 class="title">L’appel du vide</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://books.google.com/books?id=yybDMC0TRIwC&amp;pg=PR12&amp;lpg=PR12#v=onepage&amp;q&amp;f=false">You can never go home again.</a> 40 <a href="http://books.google.com/books?id=yybDMC0TRIwC&amp;pg=PR12&amp;lpg=PR12#v=onepage&amp;q&amp;f=false">You can never go home again.</a>
40 41
41 <div class="attrib">Thomas Wolfe</div> 42 <div class="attrib">Thomas Wolfe</div>
42 </div> 43 </div>
43
44 </header> 44 </header>
45 45
46 46
diff --git a/music-433.html b/music-433.html index 5b6efb7..d9ed3de 100644 --- a/music-433.html +++ b/music-433.html
@@ -34,9 +34,9 @@
34 <h1 class="title">Something</h1> 34 <h1 class="title">Something</h1>
35 <h1 class="subtitle">about all music being performances of <em>4′33″</em> in places where other bands happen to be playing</h1> 35 <h1 class="subtitle">about all music being performances of <em>4′33″</em> in places where other bands happen to be playing</h1>
36 36
37
38 <!-- dedication --> 37 <!-- dedication -->
39 <div class="dedication"><a href="https://xkcd.com/1199/">Randall</a></div> 38 <div class="dedication"><a href="https://xkcd.com/1199/">Randall</a></div>
39
40 </header> 40 </header>
41 41
42 42
diff --git a/ouroboros_memory.html b/ouroboros_memory.html index 7626cb4..d95b39d 100644 --- a/ouroboros_memory.html +++ b/ouroboros_memory.html
@@ -34,13 +34,13 @@
34 <h1 class="title">Ouroboros of Memory</h1> 34 <h1 class="title">Ouroboros of Memory</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://www.bet-tal.com/index.aspx?id=2315"><p>He used his body to remember his body, but in the end could only remember the string.</p></a> 40 <a href="http://www.bet-tal.com/index.aspx?id=2315"><p>He used his body to remember his body, but in the end could only remember the string.</p></a>
40 41
41 <div class="attrib">Jonathan Safran Foer</div> 42 <div class="attrib">Jonathan Safran Foer</div>
42 </div> 43 </div>
43
44 </header> 44 </header>
45 45
46 46
diff --git a/sixteenth-chapel.html b/sixteenth-chapel.html index def93f9..44fc66e 100644 --- a/sixteenth-chapel.html +++ b/sixteenth-chapel.html
@@ -34,15 +34,15 @@
34 <h1 class="title">The Sixteenth Chapel</h1> 34 <h1 class="title">The Sixteenth Chapel</h1>
35 35
36 36
37 <!-- dedication -->
38 <div class="dedication">Max</div>
39
37 <!-- epigraph --> 40 <!-- epigraph -->
38 <div class="epigraph"> 41 <div class="epigraph">
39 <a href="https://www.youtube.com/watch?v=PI_pwLyeoqk">Canadian High School!</a> 42 <a href="https://www.youtube.com/watch?v=PI_pwLyeoqk">Canadian High School!</a>
40 43
41 <div class="attrib">David Letterman</div> 44 <div class="attrib">David Letterman</div>
42 </div> 45 </div>
43
44 <!-- dedication -->
45 <div class="dedication">Max</div>
46 </header> 46 </header>
47 47
48 48
diff --git a/table_contents.html b/table_contents.html index b518cd5..9364cad 100644 --- a/table_contents.html +++ b/table_contents.html
@@ -34,12 +34,12 @@
34 <h1 class="title">Table of contents</h1> 34 <h1 class="title">Table of contents</h1>
35 35
36 36
37
37 <!-- epigraph --> 38 <!-- epigraph -->
38 <div class="epigraph"> 39 <div class="epigraph">
39 <a href="http://www.npr.org/blogs/13.7/2013/11/05/243081116/dark-matter-eludes-capture-science-and-the-unseen">We are awash in the unseen and science has made us aware of the flood.</a> 40 <a href="http://www.npr.org/blogs/13.7/2013/11/05/243081116/dark-matter-eludes-capture-science-and-the-unseen">We are awash in the unseen and science has made us aware of the flood.</a>
40 41
41 </div> 42 </div>
42
43 </header> 43 </header>
44 44
45 45