diff options
Diffstat (limited to 'style.css')
| -rw-r--r-- | style.css | 174 |
1 files changed, 17 insertions, 157 deletions
| @@ -1,26 +1,11 @@ | |||
| 1 | :root { | 1 | :root { |
| 2 | /* --cyan: #00cece; */ | ||
| 3 | --cyan: #37abc8; | 2 | --cyan: #37abc8; |
| 4 | /* --pink: #d344e2; */ | ||
| 5 | --pink: #d35557; | 3 | --pink: #d35557; |
| 6 | --black: #212121; | 4 | --black: #212121; |
| 7 | --light-black: #666666; | 5 | --fg: #1a1a1a; |
| 8 | --white: #ffffff; | 6 | --bg: #ededed; |
| 9 | --dark-white: #eeeeee; | ||
| 10 | --inactive: #888; | ||
| 11 | |||
| 12 | --light-yellow: #F7B955; | ||
| 13 | --dark-yellow: #F49B0B; | ||
| 14 | } | 7 | } |
| 15 | 8 | ||
| 16 | code{white-space: pre-wrap;} | ||
| 17 | span.smallcaps{font-variant: small-caps;} | ||
| 18 | span.underline{text-decoration: underline;} | ||
| 19 | div.column{display: inline-block; vertical-align: top; width: 50%;} | ||
| 20 | div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;} | ||
| 21 | ul.task-list{list-style: none;} | ||
| 22 | .display.math{display: block; text-align: center; margin: 0.5rem auto;} | ||
| 23 | |||
| 24 | @font-face { | 9 | @font-face { |
| 25 | font-family: 'LinuxLibertineDisplayRegular'; | 10 | font-family: 'LinuxLibertineDisplayRegular'; |
| 26 | src: url('resources/fonts/LinLibertine_DR.otf') format('opentype'); | 11 | src: url('resources/fonts/LinLibertine_DR.otf') format('opentype'); |
| @@ -47,17 +32,12 @@ ul.task-list{list-style: none;} | |||
| 47 | } | 32 | } |
| 48 | 33 | ||
| 49 | html { | 34 | html { |
| 50 | line-height: 1.2; | ||
| 51 | /* font-family: Georgia, serif; */ | ||
| 52 | font-family: 'LinuxLibertineDisplayRegular'; | 35 | font-family: 'LinuxLibertineDisplayRegular'; |
| 53 | font-weight: normal; | 36 | font-weight: normal; |
| 54 | font-size: 20px; | 37 | font-size: 20px; |
| 55 | color: #1a1a1a; | 38 | line-height: 1.2; |
| 56 | background-color: #ededed; | 39 | color: var(--fg); |
| 57 | } | 40 | background-color: var(--bg); |
| 58 | |||
| 59 | header { | ||
| 60 | |||
| 61 | } | 41 | } |
| 62 | 42 | ||
| 63 | body { | 43 | body { |
| @@ -66,78 +46,38 @@ body { | |||
| 66 | padding-left: 50px; | 46 | padding-left: 50px; |
| 67 | padding-right: 50px; | 47 | padding-right: 50px; |
| 68 | padding-top: 50px; | 48 | padding-top: 50px; |
| 69 | padding-bottom: 15px; | 49 | padding-bottom: 25px; |
| 70 | hyphens: auto; | 50 | hyphens: auto; |
| 71 | word-wrap: break-word; | 51 | word-wrap: break-word; |
| 72 | text-rendering: optimizeLegibility; | 52 | text-rendering: optimizeLegibility; |
| 73 | font-kerning: normal; | 53 | font-kerning: normal; |
| 74 | } | 54 | } |
| 75 | 55 | ||
| 76 | @media (max-width: 600px) { | ||
| 77 | body { | ||
| 78 | font-size: 0.9em; | ||
| 79 | padding: 1em; | ||
| 80 | } | ||
| 81 | } | ||
| 82 | |||
| 83 | @media print { | ||
| 84 | body { | ||
| 85 | background-color: transparent; | ||
| 86 | color: black; | ||
| 87 | font-size: 12pt; | ||
| 88 | } | ||
| 89 | p, h2, h3 { | ||
| 90 | orphans: 3; | ||
| 91 | widows: 3; | ||
| 92 | } | ||
| 93 | h2, h3, h4 { | ||
| 94 | page-break-after: avoid; | ||
| 95 | } | ||
| 96 | } | ||
| 97 | p { | 56 | p { |
| 98 | margin: 1em 0; | 57 | margin: 1em 0; |
| 99 | } | 58 | } |
| 59 | |||
| 100 | a { | 60 | a { |
| 101 | color: #1a1a1a; | 61 | color: var(--fg); |
| 102 | } | 62 | } |
| 103 | a:visited { | 63 | a:visited { |
| 104 | color: #1a1a1a; | 64 | color: var(--fg); |
| 105 | } | 65 | } |
| 66 | |||
| 106 | img { | 67 | img { |
| 107 | max-width: 100%; | 68 | max-width: 100%; |
| 108 | } | 69 | } |
| 109 | h1, h2, h3, h4, h5, h6 { | 70 | |
| 110 | /* margin-top: em; */ | ||
| 111 | } | ||
| 112 | h1 { | 71 | h1 { |
| 113 | font-size: 150%; | 72 | font-size: 150%; |
| 114 | } | 73 | } |
| 115 | 74 | ||
| 116 | h5, h6 { | ||
| 117 | font-size: 1em; | ||
| 118 | font-style: italic; | ||
| 119 | } | ||
| 120 | h6 { | ||
| 121 | font-weight: normal; | ||
| 122 | } | ||
| 123 | ol, ul { | ||
| 124 | padding-left: 1.7em; | ||
| 125 | margin-top: 1em; | ||
| 126 | } | ||
| 127 | li > ol, li > ul { | ||
| 128 | margin-top: 0; | ||
| 129 | } | ||
| 130 | blockquote { | ||
| 131 | margin: 1em 0 1em 1.7em; | ||
| 132 | padding-left: 1em; | ||
| 133 | border-left: 2px solid #e6e6e6; | ||
| 134 | color: #606060; | ||
| 135 | } | ||
| 136 | code { | 75 | code { |
| 137 | font-family: 'LinuxLibertineMono'; | 76 | font-family: 'LinuxLibertineMono'; |
| 138 | font-size: 75%; | 77 | font-size: 75%; |
| 139 | margin: 0; | 78 | margin: 0; |
| 140 | } | 79 | } |
| 80 | |||
| 141 | pre { | 81 | pre { |
| 142 | margin: 1em 0; | 82 | margin: 1em 0; |
| 143 | overflow: auto; | 83 | overflow: auto; |
| @@ -146,58 +86,11 @@ pre code { | |||
| 146 | padding: 0; | 86 | padding: 0; |
| 147 | overflow: visible; | 87 | overflow: visible; |
| 148 | } | 88 | } |
| 149 | .sourceCode { | 89 | |
| 150 | background-color: transparent; | ||
| 151 | overflow: visible; | ||
| 152 | } | ||
| 153 | hr { | ||
| 154 | background-color: #1a1a1a; | ||
| 155 | border: none; | ||
| 156 | height: 1px; | ||
| 157 | margin: 1em 0; | ||
| 158 | } | ||
| 159 | table { | ||
| 160 | margin: 1em 0; | ||
| 161 | border-collapse: collapse; | ||
| 162 | width: 100%; | ||
| 163 | overflow-x: auto; | ||
| 164 | display: block; | ||
| 165 | font-variant-numeric: lining-nums tabular-nums; | ||
| 166 | } | ||
| 167 | table caption { | ||
| 168 | margin-bottom: 0.75em; | ||
| 169 | } | ||
| 170 | tbody { | ||
| 171 | margin-top: 0.5em; | ||
| 172 | border-top: 1px solid #1a1a1a; | ||
| 173 | border-bottom: 1px solid #1a1a1a; | ||
| 174 | } | ||
| 175 | th { | ||
| 176 | border-top: 1px solid #1a1a1a; | ||
| 177 | padding: 0.25em 0.5em 0.25em 0.5em; | ||
| 178 | } | ||
| 179 | td { | ||
| 180 | padding: 0.125em 0.5em 0.25em 0.5em; | ||
| 181 | } | ||
| 182 | header { | 90 | header { |
| 183 | padding-bottom: 25px; | 91 | padding-bottom: 25px; |
| 184 | text-align: center; | 92 | text-align: center; |
| 185 | } | 93 | } |
| 186 | #TOC li { | ||
| 187 | list-style: none; | ||
| 188 | } | ||
| 189 | #TOC a:not(:hover) { | ||
| 190 | text-decoration: none; | ||
| 191 | } | ||
| 192 | code{white-space: pre-wrap;} | ||
| 193 | span.smallcaps{font-variant: small-caps;} | ||
| 194 | span.underline{text-decoration: underline;} | ||
| 195 | div.column{display: inline-block; vertical-align: top; width: 50%;} | ||
| 196 | div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;} | ||
| 197 | ul.task-list{list-style: none;} | ||
| 198 | .display.math{display: block; text-align: center; margin: 0.5rem auto;} | ||
| 199 | |||
| 200 | |||
| 201 | 94 | ||
| 202 | .logo { | 95 | .logo { |
| 203 | margin: 0 auto; | 96 | margin: 0 auto; |
| @@ -229,6 +122,7 @@ ul.task-list{list-style: none;} | |||
| 229 | a { | 122 | a { |
| 230 | text-decoration: none; | 123 | text-decoration: none; |
| 231 | } | 124 | } |
| 125 | |||
| 232 | /* http://www.coding-dude.com/wp/css/highlight-text-css/ */ | 126 | /* http://www.coding-dude.com/wp/css/highlight-text-css/ */ |
| 233 | .highlight{ | 127 | .highlight{ |
| 234 | position:relative; | 128 | position:relative; |
| @@ -269,15 +163,16 @@ a { | |||
| 269 | border-radius:0.25em; | 163 | border-radius:0.25em; |
| 270 | } | 164 | } |
| 271 | 165 | ||
| 272 | |||
| 273 | footer { | 166 | footer { |
| 274 | font-family: 'LinuxLibertineItalic'; | 167 | font-family: 'LinuxLibertineItalic'; |
| 275 | font-weight: normal; | 168 | font-weight: normal; |
| 276 | font-style: italic; | 169 | font-style: italic; |
| 277 | font-size: 16px; | 170 | font-size: 16px; |
| 278 | line-height: 1em; | ||
| 279 | text-align: center; | 171 | text-align: center; |
| 172 | padding-top: 5px; | ||
| 280 | } | 173 | } |
| 174 | footer p { | ||
| 175 | margin: 0.6em auto; | ||
| 281 | 176 | ||
| 282 | a.hovering { | 177 | a.hovering { |
| 283 | position:relative | 178 | position:relative |
| @@ -300,16 +195,6 @@ a.hovering:hover:before { | |||
| 300 | opacity:0.5; | 195 | opacity:0.5; |
| 301 | } | 196 | } |
| 302 | 197 | ||
| 303 | .copyright{ | ||
| 304 | margin: 15px; | ||
| 305 | } | ||
| 306 | .icon { | ||
| 307 | height: 24px; | ||
| 308 | width: 24px; | ||
| 309 | margin: 0 5px; | ||
| 310 | } | ||
| 311 | |||
| 312 | |||
| 313 | .nav { | 198 | .nav { |
| 314 | font-family: 'LinuxLibertineItalic'; | 199 | font-family: 'LinuxLibertineItalic'; |
| 315 | font-weight: normal; | 200 | font-weight: normal; |
| @@ -317,32 +202,7 @@ a.hovering:hover:before { | |||
| 317 | font-size: 16px; | 202 | font-size: 16px; |
| 318 | } | 203 | } |
| 319 | 204 | ||
| 320 | .topnav { | ||
| 321 | /* background-color: #333; */ | ||
| 322 | overflow: hidden; | ||
| 323 | text-align: right; | ||
| 324 | } | ||
| 325 | |||
| 326 | /* Style the links inside the navigation bar */ | ||
| 327 | .topnav a { | ||
| 328 | /* float: left; */ | ||
| 329 | /* color: #f2f2f2; */ | ||
| 330 | /* text-align: center; */ | ||
| 331 | /* padding: 14px 16px; */ | ||
| 332 | /* text-decoration: none; */ | ||
| 333 | /* font-size: 17px; */ | ||
| 334 | } | ||
| 335 | |||
| 336 | /* Change the color of links on hover */ | ||
| 337 | .topnav a:hover { | ||
| 338 | /* background-color: #ddd; */ | ||
| 339 | /* color: black; */ | ||
| 340 | } | ||
| 341 | |||
| 342 | .nav a.active { | 205 | .nav a.active { |
| 343 | /* text-decoration: underline; */ | ||
| 344 | /* background-color: #04AA6D; */ | ||
| 345 | /* color: white; */ | ||
| 346 | position:relative; | 206 | position:relative; |
| 347 | } | 207 | } |
| 348 | 208 | ||
