|
| 1 | +--- |
| 2 | +# this ensures Jekyll reads the file to be transformed into CSS later |
| 3 | +# only Main files contain this front matter, not partials. |
| 4 | +nav_exclude: true |
| 5 | +--- |
| 6 | +/***************************************************************************** |
| 7 | +/* |
| 8 | +/* Tufte Jekyll blog theme |
| 9 | +/* Based on Tufte CSS by Dave Liepmann ( https://github.com/edwardtufte/tufte- |
| 10 | +/* |
| 11 | +/* The README.md will show you how to set up your site along with other goodie |
| 12 | +/*****************************************************************************/ |
| 13 | + |
| 14 | +// Imports to create final |
| 15 | + |
| 16 | +@import "../_sass/fonts"; |
| 17 | +@import "../_sass/settings"; |
| 18 | +@import "../_sass/syntax-highlighting"; |
| 19 | + |
| 20 | +/* Tufte CSS styles */ |
| 21 | +html { font-size: 15px; } |
| 22 | + |
| 23 | +body { width: 87.5%; |
| 24 | + margin-left: auto; |
| 25 | + margin-right: auto; |
| 26 | + padding-left: 12.5%; |
| 27 | + font-family: et-book, Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif; |
| 28 | + background-color: #fffff8; |
| 29 | + color: #111; |
| 30 | + max-width: 1400px; |
| 31 | + counter-reset: sidenote-counter; } |
| 32 | + |
| 33 | +h1 { font-weight: 400; |
| 34 | + margin-top: 4rem; |
| 35 | + margin-bottom: 1.5rem; |
| 36 | + font-size: 3.2rem; |
| 37 | + line-height: 1; } |
| 38 | + |
| 39 | +h2 { font-style: italic; |
| 40 | + font-weight: 400; |
| 41 | + margin-top: 2.1rem; |
| 42 | + margin-bottom: 0; |
| 43 | + font-size: 2.2rem; |
| 44 | + line-height: 1; } |
| 45 | + |
| 46 | +h3 { font-style: italic; |
| 47 | + font-weight: 400; |
| 48 | + font-size: 1.7rem; |
| 49 | + margin-top: 2rem; |
| 50 | + margin-bottom: 0; |
| 51 | + line-height: 1; } |
| 52 | + |
| 53 | +p.subtitle { font-style: italic; |
| 54 | + margin-top: 1rem; |
| 55 | + margin-bottom: 1rem; |
| 56 | + font-size: 1.8rem; |
| 57 | + display: block; |
| 58 | + line-height: 1; } |
| 59 | + |
| 60 | +.numeral { font-family: et-book-roman-old-style; } |
| 61 | + |
| 62 | +.danger { color: red; } |
| 63 | + |
| 64 | +article { position: relative; |
| 65 | + padding: 5rem 0rem; } |
| 66 | + |
| 67 | +section { padding-top: 1rem; |
| 68 | + padding-bottom: 1rem; } |
| 69 | + |
| 70 | +p, ol, ul { font-size: 1.4rem; } |
| 71 | + |
| 72 | +p { line-height: 2rem; |
| 73 | + margin-top: 1.4rem; |
| 74 | + margin-bottom: 1.4rem; |
| 75 | + padding-right: 0; |
| 76 | + vertical-align: baseline; } |
| 77 | + |
| 78 | +/* Chapter Epigraphs */ |
| 79 | +div.epigraph { margin: 5em 0; } |
| 80 | + |
| 81 | +div.epigraph > blockquote { margin-top: 3em; |
| 82 | + margin-bottom: 3em; } |
| 83 | + |
| 84 | +div.epigraph > blockquote, div.epigraph > blockquote > p { font-style: italic; } |
| 85 | + |
| 86 | +div.epigraph > blockquote > footer { font-style: normal; } |
| 87 | + |
| 88 | +div.epigraph > blockquote > footer > cite { font-style: italic; } |
| 89 | + |
| 90 | +/* end chapter epigraphs styles */ |
| 91 | + |
| 92 | +blockquote { font-size: 1.4rem; } |
| 93 | + |
| 94 | +blockquote p { width: 50%; } |
| 95 | + |
| 96 | +blockquote footer { width: 50%; |
| 97 | + font-size: 1.1rem; |
| 98 | + text-align: right; } |
| 99 | + |
| 100 | +ol, ul { width: 45%; |
| 101 | + -webkit-padding-start: 5%; |
| 102 | + -webkit-padding-end: 5%; } |
| 103 | + |
| 104 | +li { padding: 0.5rem 0; } |
| 105 | + |
| 106 | +figure { padding: 0; |
| 107 | + border: 0; |
| 108 | + font-size: 100%; |
| 109 | + font: inherit; |
| 110 | + vertical-align: baseline; |
| 111 | + max-width: 55%; |
| 112 | + -webkit-margin-start: 0; |
| 113 | + -webkit-margin-end: 0; |
| 114 | + margin: 0 0 3em 0; } |
| 115 | + |
| 116 | +figcaption { float: right; |
| 117 | + clear: right; |
| 118 | + margin-right: -48%; |
| 119 | + margin-top: 0; |
| 120 | + margin-bottom: 0; |
| 121 | + font-size: 1.1rem; |
| 122 | + line-height: 1.6; |
| 123 | + vertical-align: baseline; |
| 124 | + position: relative; |
| 125 | + max-width: 40%; } |
| 126 | + |
| 127 | +figure.fullwidth figcaption { margin-right: 24%; } |
| 128 | + |
| 129 | +/* Links: replicate underline that clears descenders */ |
| 130 | +a:link, a:visited { color: inherit; } |
| 131 | + |
| 132 | +a:link { text-decoration: none; |
| 133 | + background: -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#333, #333); |
| 134 | + background: linear-gradient(#fffff8, #fffff8), linear-gradient(#fffff8, #fffff8), linear-gradient(#333, #333); |
| 135 | + -webkit-background-size: 0.05em 1px, 0.05em 1px, 1px 1px; |
| 136 | + -moz-background-size: 0.05em 1px, 0.05em 1px, 1px 1px; |
| 137 | + background-size: 0.05em 1px, 0.05em 1px, 1px 1px; |
| 138 | + background-repeat: no-repeat, no-repeat, repeat-x; |
| 139 | + text-shadow: 0.03em 0 #fffff8, -0.03em 0 #fffff8, 0 0.03em #fffff8, 0 -0.03em #fffff8, 0.06em 0 #fffff8, -0.06em 0 #fffff8, 0.09em 0 #fffff8, -0.09em 0 #fffff8, 0.12em 0 #fffff8, -0.12em 0 #fffff8, 0.15em 0 #fffff8, -0.15em 0 #fffff8; |
| 140 | + background-position: 0% 93%, 100% 93%, 0% 93%; } |
| 141 | + |
| 142 | +@media screen and (-webkit-min-device-pixel-ratio: 0) { a:link { background-position-y: 87%, 87%, 87%; } } |
| 143 | + |
| 144 | +a:link::selection { text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe; |
| 145 | + background: #b4d5fe; } |
| 146 | + |
| 147 | +a:link::-moz-selection { text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe, -0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe, -0.15em 0 #b4d5fe; |
| 148 | + background: #b4d5fe; } |
| 149 | + |
| 150 | +/* Sidenotes, margin notes, figures, captions */ |
| 151 | +img { max-width: 100%; } |
| 152 | + |
| 153 | +.sidenote, .marginnote { float: right; |
| 154 | + clear: right; |
| 155 | + margin-right: -60%; |
| 156 | + width: 50%; |
| 157 | + margin-top: 0; |
| 158 | + margin-bottom: 0; |
| 159 | + font-size: 1.1rem; |
| 160 | + line-height: 1.3; |
| 161 | + vertical-align: baseline; |
| 162 | + position: relative; } |
| 163 | + |
| 164 | +.table-caption { float:right; |
| 165 | + clear:right; |
| 166 | + margin-right: -60%; |
| 167 | + width: 50%; |
| 168 | + margin-top: 0; |
| 169 | + margin-bottom: 0; |
| 170 | + font-size: 1.0rem; |
| 171 | + line-height: 1.6; } |
| 172 | + |
| 173 | +.sidenote-number { counter-increment: sidenote-counter; } |
| 174 | + |
| 175 | +.sidenote-number:after, .sidenote:before { content: counter(sidenote-counter) " "; |
| 176 | + font-family: et-book-roman-old-style; |
| 177 | + position: relative; |
| 178 | + vertical-align: baseline; } |
| 179 | + |
| 180 | +.sidenote-number:after { content: counter(sidenote-counter); |
| 181 | + font-size: 1rem; |
| 182 | + top: -0.5rem; |
| 183 | + left: 0.1rem; } |
| 184 | + |
| 185 | +.sidenote:before { content: counter(sidenote-counter) " "; |
| 186 | + top: -0.5rem; } |
| 187 | + |
| 188 | +p, footer, table, div.table-wrapper-small, div.supertable-wrapper > p, div.booktabs-wrapper { width: 55%; } |
| 189 | + |
| 190 | +div.fullwidth, table.fullwidth { width: 100%; } |
| 191 | + |
| 192 | +div.table-wrapper { overflow-x: auto; |
| 193 | + font-family: "Trebuchet MS", "Gill Sans", "Gill Sans MT", sans-serif; } |
| 194 | + |
| 195 | +@media screen and (max-width: 760px) { p, footer { width: 90%; } |
| 196 | + pre.code { width: 87.5%; } |
| 197 | + ul { width: 85%; } |
| 198 | + figure { max-width: 90%; } |
| 199 | + figcaption, figure.fullwidth figcaption { margin-right: 0%; |
| 200 | + max-width: none; } |
| 201 | + blockquote p, blockquote footer { width: 90%; }} |
| 202 | + |
| 203 | +.sans { font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif; |
| 204 | + letter-spacing: .03em; } |
| 205 | + |
| 206 | +.code { font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; |
| 207 | + font-size: 1.125rem; |
| 208 | + line-height: 1.6; } |
| 209 | + |
| 210 | +h1 .code, h2 .code, h3 .code { font-size: 0.80em; } |
| 211 | + |
| 212 | +.marginnote .code, .sidenote .code { font-size: 1rem; } |
| 213 | + |
| 214 | +pre.code { width: 52.5%; |
| 215 | + padding-left: 2.5%; |
| 216 | + overflow-x: auto; } |
| 217 | + |
| 218 | +.fullwidth { max-width: 90%; |
| 219 | + clear:both; } |
| 220 | + |
| 221 | +span.newthought { font-variant: small-caps; |
| 222 | + font-size: 1.2em; } |
| 223 | + |
| 224 | +input.margin-toggle { display: none; } |
| 225 | + |
| 226 | +label.sidenote-number { display: inline; } |
| 227 | + |
| 228 | +label.margin-toggle:not(.sidenote-number) { display: none; } |
| 229 | + |
| 230 | +@media (max-width: 760px) { label.margin-toggle:not(.sidenote-number) { display: inline; } |
| 231 | + .sidenote, .marginnote { display: none; } |
| 232 | + .margin-toggle:checked + .sidenote, |
| 233 | + .margin-toggle:checked + .marginnote { display: block; |
| 234 | + float: left; |
| 235 | + left: 1rem; |
| 236 | + clear: both; |
| 237 | + width: 95%; |
| 238 | + margin: 1rem 2.5%; |
| 239 | + vertical-align: baseline; |
| 240 | + position: relative; } |
| 241 | + label { cursor: pointer; } |
| 242 | + pre.code { width: 90%; |
| 243 | + padding: 0; } |
| 244 | + .table-caption { display: block; |
| 245 | + float: right; |
| 246 | + clear: both; |
| 247 | + width: 98%; |
| 248 | + margin-top: 1rem; |
| 249 | + margin-bottom: 0.5rem; |
| 250 | + margin-left: 1%; |
| 251 | + margin-right: 1%; |
| 252 | + vertical-align: baseline; |
| 253 | + position: relative; } |
| 254 | + div.table-wrapper, table, table.booktabs { width: 85%; } |
| 255 | + div.table-wrapper { border-right: 1px solid #efefef; } |
| 256 | + img { width: 100%; } } |
0 commit comments