diff --git a/print/stephen.css b/print/stephen.css index 357964e..bf31985 100644 --- a/print/stephen.css +++ b/print/stephen.css @@ -1,4 +1,106 @@ #section-9{ -color: red; + :root{ + --color1: #666; + --color2: #666; + --color3: #666; + --color4: #666; + --baseline: 4mm; + } + @media print{ + @page{ + size: 100mm 200mm; + bleed: 3mm; + marks: crop; + margin: 10mm; + @bottom{ + color: var(--color1); + font-weight: 600; + } + } + /* @page:right {margin-left: 20mm;} */ + /* @page:left {margin-right: 20mm;} */ + } + a{ + color: inherit; + text-decoration: none; + word-break: break-all; + } + .bibliography{ + font-size: 10px; + /* color: var(--color1); */ + line-height: 3mm; + hyphens: auto; + } + body{ + font-family: 'Work Sans', 'HK Grotesk', sans-serif; + font-weight: 500; + font-size: 11px; + line-height: var(--baseline); + counter-reset: captions; + } + h1, h2, h3, h4, h5, h6{ + color: var(--color1); + font-size: inherit; + margin: 0; + /* font-weight: bold; + border-top: 3px solid #666; + border-bottom: 3px solid #666; + padding: 5mm 0; */ + break-before: always; + } + h3, h3 + br{display: none;} + p{ + margin: 0 0 var(--baseline); + position: relative; + top: 1.2mm; + } + img{width: 100%;} + figcaption{ + font-size: 0.75em; + color: var(--color1); + counter-increment: captions; + margin: 0.75mm 0 0; + line-height: 3mm; + } + figcaption:before{ + opacity: 1; + content: counter(captions) " "; + } + figure{ + margin: 0; + break-before: always; + } + ul, ol{ + list-style: none; + color: var(--color2); + margin: 0; + padding: 0 + } + /* quote */ + li{ + margin: 0 0 var(--baseline); + color: var(--color2); + } + .indent .indent{ + margin-left: calc(var(--baseline) * 2); + } + .indent .indent .indent .indent .indent .indent .indent .indent{ + margin-left: 0; + } + /* interview */ + .bullet{ + margin-left: var(--baseline); + } + .bullet li{ + text-indent: calc(-1 * var(--baseline)); + color: var(--color3); + } + .bullet .no-indent{text-indent: 0;} + .conor li{ + text-indent: -5.9mm; + } + /* annotation */ + .number li{color: var(--color4);} + }