Index: web-extra/martin.css.pp ================================================================== --- web-extra/martin.css.pp +++ web-extra/martin.css.pp @@ -40,29 +40,29 @@ @import url('normalize.css'); /* Let us first address the matter of font size in different screen sizes. */ /* Mobile portrait screens will see a minimum 18px font. */ -html { font-size: 18px; } +html { font-size: 22px; } /* Start increasing type size dynamically at screen widths of 768px */ @media only screen and (min-width: 768px) { - html { font-size: 2.3vw; } + html { font-size: 2.8vw; } } /* Top out at 23px for screens up to 800px TALL */ -@media only screen and (min-width: 1000px) and (max-height: 800px) { - html { font-size: 23px; } /* = 2.3% of 1000px (min-width) */ -} +◊; @media only screen and (min-width: 1000px) and (max-height: 800px) { +◊; html { font-size: 26px; } /* = 2.6% of 1000px (min-width) */ +◊; } -/* Top out at 26px for screens 801px-1000px TALL */ -@media only screen and (min-width: 1130px) and (min-height: 801px) and (max-height: 1000px) { - html { font-size: 26px; } /* = 2.3% of 1130px (min-width) */ +/* Top out at 28px for screens 801px-1000px TALL */ +@media only screen and (min-width: 1000px) and (max-height: 920px) { + html { font-size: 28px; } /* = 2.8% of 1000px (min-width) */ } /* For screens taller than 1000 px, top out at 32px */ -@media only screen and (min-width: 1400px) and (min-height: 1001px) { - html { font-size: 32px; } /* = 2.3% of 1400px (min-width) */ +@media only screen and (min-width: 1178px) and (min-height: 921px) { + html { font-size: 33px; } /* = 2.8% of 1178px (min-width) */ } ◊; Since line height is used in so many places... ◊(define LINEHEIGHT 1.3) ◊(define lineheight (string-append (number->string LINEHEIGHT) "rem")) @@ -205,16 +205,13 @@ margin: 0 0 ◊x-lineheight[1] 0; font-style: italic; font-weight: normal; } - /* If you DO add an actual, formal title to an article, we’ll put it in small caps (Fabiol comes with - some really nice small caps). - */ + /* Titles non-bold, non-smallcaps by default. This can be overridden in document markup. */ article>h1.entry-title { margin: 0 0 0 0; - font-feature-settings: "smcp" on; text-transform: none; font-style: normal; line-height: 1.7rem; } @@ -396,10 +393,15 @@ border: 0; background: none; font-style: italic; font-size: 0.75rem; } + + pre.code { + border: dotted #aaa 2px; + padding-left: 0.2em; + } pre.verse { font-family: ◊body-font; font-size: 1rem; line-height: ◊x-lineheight[1]; @@ -654,10 +656,13 @@ padding-top: 1.5rem; } section.entry-content { grid-area: main; + /* Prevent content from overriding grid column sizing */ + /* See https://css-tricks.com/preventing-a-grid-blowout/ */ + min-width: 0; } section.entry-content:first-child { margin-top: 0 !important; }