| | 1 | /* |
| | 2 | Theme Name: Twenty Sixteen |
| | 3 | Description: Used to style Gutenberg Blocks in the editor. |
| | 4 | */ |
| | 5 | |
| | 6 | /*-------------------------------------------------------------- |
| | 7 | >>> TABLE OF CONTENTS: |
| | 8 | ---------------------------------------------------------------- |
| | 9 | 1.0 General Typography |
| | 10 | 2.0 General Block Styles |
| | 11 | 3.0 Blocks - Common Blocks |
| | 12 | 4.0 Blocks - Formatting |
| | 13 | 5.0 Blocks - Layout Elements |
| | 14 | 6.0 Blocks - Widgets |
| | 15 | 7.0 Blocks - Embeds |
| | 16 | --------------------------------------------------------------*/ |
| | 17 | |
| | 18 | /*-------------------------------------------------------------- |
| | 19 | 1.0 General Typography |
| | 20 | --------------------------------------------------------------*/ |
| | 21 | |
| | 22 | .edit-post-visual-editor .editor-block-list__block, |
| | 23 | .editor-default-block-appender input[type="text"].editor-default-block-appender__content { |
| | 24 | color: #1a1a1a; |
| | 25 | font-family: Merriweather, Georgia, serif; |
| | 26 | font-size: 16px; |
| | 27 | font-size: 1rem; |
| | 28 | line-height: 1.75; |
| | 29 | } |
| | 30 | |
| | 31 | .edit-post-visual-editor .editor-block-list__block { |
| | 32 | color: #1a1a1a; |
| | 33 | } |
| | 34 | |
| | 35 | .editor-post-title__block .editor-post-title__input { |
| | 36 | font-family: Montserrat, "Helvetica Neue", sans-serif; |
| | 37 | font-size: 28px; |
| | 38 | font-size: 1.75rem; |
| | 39 | font-weight: 700; |
| | 40 | line-height: 1.25; |
| | 41 | margin-bottom: 1em; |
| | 42 | } |
| | 43 | |
| | 44 | .edit-post-visual-editor h1 { |
| | 45 | font-size: 28px; |
| | 46 | font-size: 1.75rem; |
| | 47 | line-height: 1.25; |
| | 48 | margin-top: 2em; |
| | 49 | margin-bottom: 1em; |
| | 50 | } |
| | 51 | |
| | 52 | .edit-post-visual-editor h2 { |
| | 53 | font-size: 23px; |
| | 54 | font-size: 1.4375rem; |
| | 55 | line-height: 1.2173913043; |
| | 56 | margin-top: 2.4347826087em; |
| | 57 | margin-bottom: 1.2173913043em; |
| | 58 | } |
| | 59 | |
| | 60 | .edit-post-visual-editor h3 { |
| | 61 | font-size: 19px; |
| | 62 | font-size: 1.1875rem; |
| | 63 | line-height: 1.1052631579; |
| | 64 | margin-top: 2.9473684211em; |
| | 65 | margin-bottom: 1.4736842105em; |
| | 66 | } |
| | 67 | |
| | 68 | .edit-post-visual-editor h4, |
| | 69 | .edit-post-visual-editor h5, |
| | 70 | .edit-post-visual-editor h6 { |
| | 71 | font-size: 16px; |
| | 72 | font-size: 1rem; |
| | 73 | line-height: 1.3125; |
| | 74 | margin-top: 3.5em; |
| | 75 | margin-bottom: 1.75em; |
| | 76 | } |
| | 77 | |
| | 78 | .edit-post-visual-editor h4 { |
| | 79 | letter-spacing: 0.140625em; |
| | 80 | text-transform: uppercase; |
| | 81 | } |
| | 82 | |
| | 83 | .edit-post-visual-editor h6 { |
| | 84 | font-style: italic; |
| | 85 | } |
| | 86 | |
| | 87 | .edit-post-visual-editor h1, |
| | 88 | .edit-post-visual-editor h2, |
| | 89 | .edit-post-visual-editor h3, |
| | 90 | .edit-post-visual-editor h4, |
| | 91 | .edit-post-visual-editor h5, |
| | 92 | .edit-post-visual-editor h6 { |
| | 93 | font-weight: 900; |
| | 94 | } |
| | 95 | |
| | 96 | @media screen and (min-width: 61.5625em) { |
| | 97 | .edit-post-visual-editor h1 { |
| | 98 | font-size: 33px; |
| | 99 | font-size: 2.0625rem; |
| | 100 | line-height: 1.2727272727; |
| | 101 | margin-top: 1.696969697em; |
| | 102 | margin-bottom: 0.8484848485em; |
| | 103 | } |
| | 104 | |
| | 105 | .edit-post-visual-editor h2 { |
| | 106 | font-size: 28px; |
| | 107 | font-size: 1.75rem; |
| | 108 | line-height: 1.25; |
| | 109 | margin-top: 2em; |
| | 110 | margin-bottom: 1em; |
| | 111 | } |
| | 112 | |
| | 113 | .edit-post-visual-editor h3 { |
| | 114 | font-size: 23px; |
| | 115 | font-size: 1.4375rem; |
| | 116 | line-height: 1.2173913043; |
| | 117 | margin-top: 2.4347826087em; |
| | 118 | margin-bottom: 1.2173913043em; |
| | 119 | } |
| | 120 | |
| | 121 | .edit-post-visual-editor h4 { |
| | 122 | letter-spacing: 0.131578947em; |
| | 123 | } |
| | 124 | |
| | 125 | .edit-post-visual-editor h4, |
| | 126 | .edit-post-visual-editor h5, |
| | 127 | .edit-post-visual-editor h6 { |
| | 128 | font-size: 19px; |
| | 129 | font-size: 1.1875rem; |
| | 130 | line-height: 1.1052631579; |
| | 131 | margin-top: 2.9473684211em; |
| | 132 | margin-bottom: 1.473684211em; |
| | 133 | } |
| | 134 | } |
| | 135 | |
| | 136 | .edit-post-visual-editor h1:first-child, |
| | 137 | .edit-post-visual-editor h2:first-child, |
| | 138 | .edit-post-visual-editor h3:first-child, |
| | 139 | .edit-post-visual-editor h4:first-child, |
| | 140 | .edit-post-visual-editor h5:first-child, |
| | 141 | .edit-post-visual-editor h6:first-child { |
| | 142 | margin-top: 0; |
| | 143 | } |
| | 144 | |
| | 145 | .edit-post-visual-editor p { |
| | 146 | margin: 0 0 1.75em; |
| | 147 | } |
| | 148 | |
| | 149 | .edit-post-visual-editor blockquote p { |
| | 150 | margin-bottom: 1.4736842105em; |
| | 151 | } |
| | 152 | |
| | 153 | @media screen and (min-width: 44.375em) { |
| | 154 | .editor-post-title__block .editor-post-title__input { |
| | 155 | font-size: 33px; |
| | 156 | font-size: 2.0625rem; |
| | 157 | line-height: 1.2727272727; |
| | 158 | margin-bottom: 0.8484848485em; |
| | 159 | } |
| | 160 | } |
| | 161 | |
| | 162 | @media screen and (min-width: 61.5625em) { |
| | 163 | .editor-post-title__block .editor-post-title__input { |
| | 164 | font-size: 40px; |
| | 165 | font-size: 2.5rem; |
| | 166 | line-height: 1.225; |
| | 167 | margin-bottom: 1.05em; |
| | 168 | } |
| | 169 | } |
| | 170 | |
| | 171 | /*-------------------------------------------------------------- |
| | 172 | 2.0 General Block Styles |
| | 173 | --------------------------------------------------------------*/ |
| | 174 | |
| | 175 | /* Main column width */ |
| | 176 | body.gutenberg-editor-page .edit-post-visual-editor .editor-post-title__block, |
| | 177 | body.gutenberg-editor-page .edit-post-visual-editor .editor-default-block-appender, |
| | 178 | body.gutenberg-editor-page .edit-post-visual-editor .editor-block-list__block { |
| | 179 | max-width: 600px; /* Is 840px for pages */ |
| | 180 | } |
| | 181 | |
| | 182 | /* Link styles */ |
| | 183 | |
| | 184 | .edit-post-visual-editor a, |
| | 185 | .editor-block-list__block a, |
| | 186 | .wp-block-freeform.block-library-rich-text__tinymce a { |
| | 187 | color: #007acc; |
| | 188 | } |
| | 189 | |
| | 190 | /* List styles */ |
| | 191 | |
| | 192 | .edit-post-visual-editor ul:not(.wp-block-gallery), |
| | 193 | .editor-block-list__block ul:not(.wp-block-gallery), |
| | 194 | .block-library-list ul, |
| | 195 | .edit-post-visual-editor ol, |
| | 196 | .editor-block-list__block ol, |
| | 197 | .block-library-list ol { |
| | 198 | margin: 0 0 1.75em 1.25em; |
| | 199 | padding: 0; |
| | 200 | } |
| | 201 | |
| | 202 | .edit-post-visual-editor ul:not(.wp-block-gallery), |
| | 203 | .editor-block-list__block ul:not(.wp-block-gallery), |
| | 204 | .block-library-list ul { |
| | 205 | list-style: disc; |
| | 206 | } |
| | 207 | |
| | 208 | .edit-post-visual-editor ol, |
| | 209 | .editor-block-list__block ol, |
| | 210 | .block-library-list ol { |
| | 211 | list-style: decimal; |
| | 212 | margin-left: 1.5em; |
| | 213 | } |
| | 214 | |
| | 215 | .edit-post-visual-editor ul:not(.wp-block-gallery) li, |
| | 216 | .editor-block-list__block ul:not(.wp-block-gallery) li, |
| | 217 | .edit-post-visual-editor ol li, |
| | 218 | .editor-block-list__block ol li, |
| | 219 | .block-library-list li { |
| | 220 | margin-bottom: 0; |
| | 221 | } |
| | 222 | |
| | 223 | .edit-post-visual-editor ul:not(.wp-block-gallery) li > ul, |
| | 224 | .editor-block-list__block ul:not(.wp-block-gallery) li > ul, |
| | 225 | .block-library-list li > ul, |
| | 226 | .edit-post-visual-editor li > ol, |
| | 227 | .editor-block-list__block li > ol, |
| | 228 | .block-library-list li > ol { |
| | 229 | margin-bottom: 0; |
| | 230 | } |
| | 231 | |
| | 232 | /*-------------------------------------------------------------- |
| | 233 | 3.0 Blocks - Common Blocks |
| | 234 | --------------------------------------------------------------*/ |
| | 235 | |
| | 236 | /* Paragraph */ |
| | 237 | |
| | 238 | .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter { |
| | 239 | font-size: 5em; |
| | 240 | line-height: 0.68; |
| | 241 | margin: 0.05em 0.1em 0 0; |
| | 242 | text-transform: uppercase; |
| | 243 | font-style: normal; |
| | 244 | } |
| | 245 | |
| | 246 | /* Image */ |
| | 247 | |
| | 248 | @media screen and (min-width: 61.5625em) { |
| | 249 | /* TODO */ |
| | 250 | body:not(.search-results) article:not(.type-page) img.below-entry-meta, |
| | 251 | body:not(.search-results) article:not(.type-page) figure.below-entry-meta { |
| | 252 | clear: both; |
| | 253 | display: block; |
| | 254 | float: none; |
| | 255 | margin-right: 0; |
| | 256 | margin-left: -40%; |
| | 257 | max-width: 140%; |
| | 258 | } |
| | 259 | |
| | 260 | body:not(.search-results) article:not(.type-page) figure.below-entry-meta img.below-entry-meta, |
| | 261 | body:not(.search-results) article:not(.type-page) table figure.below-entry-meta, |
| | 262 | body:not(.search-results) article:not(.type-page) table img.below-entry-meta { |
| | 263 | margin: 0; |
| | 264 | max-width: 100%; |
| | 265 | } |
| | 266 | } |
| | 267 | |
| | 268 | /* Quote */ |
| | 269 | |
| | 270 | .wp-block-quote { |
| | 271 | border: 0 solid #1a1a1a; |
| | 272 | border-left-width: 4px; |
| | 273 | color: #686868; |
| | 274 | font-style: italic; |
| | 275 | line-height: 1.4736842105; |
| | 276 | margin: 0 0 1.4736842105em; |
| | 277 | overflow: hidden; |
| | 278 | padding: 0 0 0 1.263157895em; |
| | 279 | } |
| | 280 | |
| | 281 | .wp-block-quote:not(.is-large):not(.is-style-large).alignleft, |
| | 282 | .wp-block-quote:not(.is-large):not(.is-style-large).alignright { |
| | 283 | border-left: 0; |
| | 284 | padding-left: 0; |
| | 285 | } |
| | 286 | |
| | 287 | .editor-block-list__block .wp-block-quote p { |
| | 288 | font-size: 19px; |
| | 289 | font-size: 1.1875rem; |
| | 290 | margin-bottom: 1.4736842105em; |
| | 291 | } |
| | 292 | |
| | 293 | .wp-block-quote__citation { |
| | 294 | color: #1a1a1a; |
| | 295 | display: block; |
| | 296 | font-size: 16px; |
| | 297 | font-size: 1rem; |
| | 298 | line-height: 1.75; |
| | 299 | } |
| | 300 | |
| | 301 | .wp-block-quote__citation:before { |
| | 302 | content: "\2014\00a0"; |
| | 303 | } |
| | 304 | |
| | 305 | .wp-block-quote em, |
| | 306 | .wp-block-quote i, |
| | 307 | .wp-block-quote__citation:before { |
| | 308 | font-style: normal; |
| | 309 | } |
| | 310 | |
| | 311 | .wp-block-quote strong, |
| | 312 | .wp-block-quote b { |
| | 313 | font-weight: 400; |
| | 314 | } |
| | 315 | |
| | 316 | .wp-block-quote > :last-child { |
| | 317 | margin-bottom: 0; |
| | 318 | } |
| | 319 | |
| | 320 | .wp-block-quote.alignleft { |
| | 321 | margin: 0.3157894737em 1.4736842105em 1.473684211em 0; |
| | 322 | } |
| | 323 | |
| | 324 | .wp-block-quote.alignright { |
| | 325 | margin: 0.3157894737em 0 1.473684211em 1.4736842105em; |
| | 326 | } |
| | 327 | |
| | 328 | .wp-block-quote.aligncenter { |
| | 329 | margin-bottom: 1.473684211em; |
| | 330 | } |
| | 331 | |
| | 332 | @media screen and (min-width: 44.375em) { |
| | 333 | .wp-block-quote.alignleft, |
| | 334 | .wp-block-quote.alignright { |
| | 335 | border-width: 4px 0 0 0; |
| | 336 | padding: 0.9473684211em 0 0; |
| | 337 | width: -webkit-calc(50% - 0.736842105em); |
| | 338 | width: calc(50% - 0.736842105em); |
| | 339 | } |
| | 340 | |
| | 341 | .wp-block-quote:not(.alignleft):not(.alignright) { |
| | 342 | margin-left: -1.473684211em; |
| | 343 | } |
| | 344 | } |
| | 345 | |
| | 346 | @media screen and (min-width: 80em) { |
| | 347 | .editor-block-list__block .wp-block-quote.alignleft { |
| | 348 | margin-left: -40%; |
| | 349 | width: -webkit-calc(60% - 1.4736842105em); |
| | 350 | width: calc(60% - 1.4736842105em); |
| | 351 | } |
| | 352 | } |
| | 353 | |
| | 354 | /* File */ |
| | 355 | |
| | 356 | .wp-block-file__textlink { |
| | 357 | box-shadow: 0 1px 0 0 currentColor; |
| | 358 | color: #007acc; |
| | 359 | } |
| | 360 | |
| | 361 | .wp-block-file .wp-block-file__button { |
| | 362 | background: #1a1a1a; |
| | 363 | border: 0; |
| | 364 | border-radius: 2px; |
| | 365 | color: #fff; |
| | 366 | font-family: Montserrat, "Helvetica Neue", sans-serif; |
| | 367 | font-weight: 700; |
| | 368 | letter-spacing: 0.046875em; |
| | 369 | line-height: 1; |
| | 370 | padding: 0.84375em 0.875em 0.78125em; |
| | 371 | text-transform: uppercase; |
| | 372 | } |
| | 373 | |
| | 374 | /*-------------------------------------------------------------- |
| | 375 | 4.0 Blocks - Formatting |
| | 376 | --------------------------------------------------------------*/ |
| | 377 | |
| | 378 | /* Code */ |
| | 379 | |
| | 380 | .wp-block-code { |
| | 381 | border: 0; |
| | 382 | padding: 0.125em 0.25em; |
| | 383 | } |
| | 384 | |
| | 385 | /* Classic */ |
| | 386 | |
| | 387 | .wp-block-freeform.block-library-rich-text__tinymce blockquote { |
| | 388 | border: 0 solid #1a1a1a; |
| | 389 | border-left-width: 4px; |
| | 390 | color: #686868; |
| | 391 | font-style: italic; |
| | 392 | line-height: 1.4736842105; |
| | 393 | margin: 0 0 1.4736842105em; |
| | 394 | overflow: hidden; |
| | 395 | padding: 0 0 0 1.263157895em; |
| | 396 | } |
| | 397 | |
| | 398 | .editor-block-list__block .wp-block-freeform.block-library-rich-text__tinymce blockquote:not(.alignleft):not(.alignright) { |
| | 399 | margin-left: 0; |
| | 400 | } |
| | 401 | |
| | 402 | .wp-block-freeform.block-library-rich-text__tinymce blockquote p { |
| | 403 | font-size: 19px; |
| | 404 | font-size: 1.1875rem; |
| | 405 | } |
| | 406 | |
| | 407 | .wp-block-freeform.block-library-rich-text__tinymce blockquote cite { |
| | 408 | color: #1a1a1a; |
| | 409 | display: block; |
| | 410 | font-size: 16px; |
| | 411 | font-size: 1rem; |
| | 412 | font-style: normal; |
| | 413 | line-height: 1.75; |
| | 414 | } |
| | 415 | |
| | 416 | .wp-block-freeform.block-library-rich-text__tinymce blockquote cite:before { |
| | 417 | content: "\2014\00a0"; |
| | 418 | } |
| | 419 | |
| | 420 | .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft { |
| | 421 | margin: 0.3157894737em 1.4736842105em 1.473684211em 0; |
| | 422 | } |
| | 423 | |
| | 424 | .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright { |
| | 425 | margin: 0.3157894737em 0 1.473684211em 1.4736842105em; |
| | 426 | } |
| | 427 | |
| | 428 | .wp-block-freeform.block-library-rich-text__tinymce blockquote.aligncenter { |
| | 429 | margin-bottom: 1.473684211em; |
| | 430 | } |
| | 431 | |
| | 432 | @media screen and (min-width: 44.375em) { |
| | 433 | .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignleft, |
| | 434 | .wp-block-freeform.block-library-rich-text__tinymce blockquote.alignright { |
| | 435 | border-width: 4px 0 0 0; |
| | 436 | padding: 0.9473684211em 0 0; |
| | 437 | width: -webkit-calc(50% - 0.736842105em); |
| | 438 | width: calc(50% - 0.736842105em); |
| | 439 | } |
| | 440 | } |
| | 441 | |
| | 442 | /* Custom HTML */ |
| | 443 | |
| | 444 | .wp-block-html .CodeMirror-lines pre { |
| | 445 | background-color: inherit; |
| | 446 | border: inherit; |
| | 447 | font-size: inherit; |
| | 448 | line-height: inherit; |
| | 449 | margin-bottom: inherit; |
| | 450 | padding: inherit; |
| | 451 | } |
| | 452 | |
| | 453 | /* Pullquote */ |
| | 454 | |
| | 455 | .editor-block-list__block .wp-block-pullquote blockquote { |
| | 456 | border: 0; |
| | 457 | margin: 0; |
| | 458 | padding: 0; |
| | 459 | } |
| | 460 | |
| | 461 | .wp-block-pullquote blockquote > .editor-rich-text p { |
| | 462 | color: #686868; |
| | 463 | font-size: 19px; |
| | 464 | font-size: 1.1875rem; |
| | 465 | } |
| | 466 | |
| | 467 | .wp-block-pullquote .wp-block-pullquote__citation { |
| | 468 | color: #1a1a1a; |
| | 469 | display: block; |
| | 470 | font-size: 16px; |
| | 471 | font-size: 1rem; |
| | 472 | font-style: italic; |
| | 473 | line-height: 1.75; |
| | 474 | text-transform: none; |
| | 475 | } |
| | 476 | |
| | 477 | .wp-block-pullquote .wp-block-pullquote__citation:before { |
| | 478 | content: "\2014\00a0"; |
| | 479 | } |
| | 480 | |
| | 481 | /* Table */ |
| | 482 | |
| | 483 | .editor-block-list__block table.wp-block-table th, |
| | 484 | .editor-block-list__block table.wp-block-table td { |
| | 485 | padding: 0; |
| | 486 | } |
| | 487 | |
| | 488 | /*-------------------------------------------------------------- |
| | 489 | 5.0 Blocks - Layout Elements |
| | 490 | --------------------------------------------------------------*/ |
| | 491 | |
| | 492 | /* Buttons */ |
| | 493 | .wp-block-button .wp-block-button__link { |
| | 494 | background: #1a1a1a; |
| | 495 | border: 0; |
| | 496 | border-radius: 2px; |
| | 497 | color: #fff; |
| | 498 | font-family: Montserrat, "Helvetica Neue", sans-serif; |
| | 499 | font-weight: 700; |
| | 500 | letter-spacing: 0.046875em; |
| | 501 | line-height: 1; |
| | 502 | padding: 0.84375em 0.875em 0.78125em; |
| | 503 | text-transform: uppercase; |
| | 504 | } |
| | 505 | |
| | 506 | /*-------------------------------------------------------------- |
| | 507 | 6.0 Blocks - Widgets |
| | 508 | --------------------------------------------------------------*/ |
| | 509 | |
| | 510 | /* Comments */ |
| | 511 | |
| | 512 | .editor-block-list__block .wp-block-latest-comments__comment-meta a { |
| | 513 | box-shadow: none; |
| | 514 | font-weight: 700; |
| | 515 | text-decoration: none; |
| | 516 | } |
| | 517 | |
| | 518 | .wp-block-latest-comments__comment-date { |
| | 519 | color: #686868; |
| | 520 | font-family: Montserrat, "Helvetica Neue", sans-serif; |
| | 521 | font-size: 13px; |
| | 522 | font-size: 0.8125rem; |
| | 523 | line-height: 1.6153846154; |
| | 524 | } |
| | 525 | |
| | 526 | .wp-block-latest-comments .wp-block-latest-comments__comment { |
| | 527 | border-top: 1px solid #d1d1d1; |
| | 528 | margin-bottom: 0; |
| | 529 | padding: 1.75em 0; |
| | 530 | } |
| | 531 | |
| | 532 | .wp-block-latest-comments__comment-excerpt p:last-child { |
| | 533 | margin-bottom: 0; |
| | 534 | } |