diff options
| author | Kumar Damani <me@kumardamani.net> | 2022-09-12 22:56:16 +0000 |
|---|---|---|
| committer | Kumar Damani <me@kumardamani.net> | 2022-09-12 22:56:16 +0000 |
| commit | e629cc77768ad029445648540a0dd4129ce869a7 (patch) | |
| tree | 3d837f3df3962c8b626b7359558933a9d4c379fc /public/css/typography.css | |
| parent | 89ea076e19c28ebb27b0bd7096b7bb3c319f9563 (diff) | |
moved to hugo
Diffstat (limited to 'public/css/typography.css')
| -rw-r--r-- | public/css/typography.css | 214 |
1 files changed, 214 insertions, 0 deletions
diff --git a/public/css/typography.css b/public/css/typography.css new file mode 100644 index 0000000..5a2c044 --- /dev/null +++ b/public/css/typography.css @@ -0,0 +1,214 @@ +/* Fonts */ +:root { + --font-monospace: "Fira Mono", monospace; +} + +body { + font-family: var(--font-monospace); + font-size: 16px; + line-height: 1.5rem; +} + +/* Headings */ +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: 1rem; + margin: 1.5rem 0 0 0; + font-weight: 600; +} + +h1+h2, +h1+h3, +h1+h4, +h1+h5, +h1+h6, +h2+h3, +h2+h4, +h2+h5, +h2+h6, +h3+h4, +h3+h5, +h3+h6, +h4+h5, +h4+h6, +h5+h6 { + margin: 0; +} + +h1:before { content: "# "; } +h2:before { content: "## "; } +h3:before { content: "### "; } +h4:before { content: "#### "; } +h5:before { content: "##### "; } +h6:before { content: "###### "; } + +h1:before, +h2:before, +h3:before, +h4:before, +h5:before, +h6:before { + color: var(--bright-bg); +} + +h1:first-child { + margin-top: 0; +} + +/* Paragraphs */ +p { + margin: 0 0 1.5rem 0; +} + +/* Links */ + +a:link, a:visited { + color: var(--fg); +} + +a:hover, a:active { + color: var(--bright-fg); +} + +/* Lists */ +ul { + margin: 0 0 1.5rem 0; + padding-left: 1.25rem; +} + +ol { + margin: 0 0 1.5rem 0; + padding-left: 1.75rem; +} + +ul ul, +ul ol, +ol ul, +ol ol { + margin: 0; +} + +ul li::marker { + content: '∗\00A0'; + color: var(--bright-bg); +} + +ol li::marker { + color: var(--bright-bg); +} + +dt { + margin: 0; + font-weight: bold; +} + +dd { + margin: 0 0 0 1.5rem; + font-style: italic; +} + +dd + dt { + margin-top: 1.5rem; +} + +dl { + margin: 0 0 1.5rem 0; +} + +/* Blockquotes */ +blockquote { + position: relative; + margin: 0 0 1.5rem 1.5rem; +} + +blockquote::before { + position: absolute; + left: -1.5rem; + content: ">"; + color: var(--bright-bg); +} + +.twitter-tweet::before { + content: "\f099"; + font-family: "Font Awesome 5 Brands"; + font-weight: 400; +} + +/* Code */ +pre, +code, +kbd, +samp { + background: var(--dark-bg) !important; + font-family: var(--font-monospace); + color: var(--bright-bg); +} + +pre { + overflow-x: auto; + padding: 1.5rem; + margin: 0 0 1.5rem 0; +} + +/* Emphasis */ +b, +strong { + font-weight: 600; +} + +/* Highlighting */ +::selection, +mark { + background-color: var(--yellow); + color: var(--bg); +} + +/* Other typographic elements */ +hr { + border: 0; + margin-bottom: 1.5rem; +} + +hr:after { + content: '---'; + color: var(--bright-bg); +} + + +/* Prevent super/sub from affecting line height */ +sup, sub { + vertical-align: baseline; + position: relative; + top: -0.25rem; + font-size: unset; +} +sub { + top: 0.25rem; +} + +/* Tables */ +table { + border-spacing: 0; + margin: 0 0 1.5rem 0; + overflow-wrap: anywhere; +} +th, td { + padding: 0 .75rem; + vertical-align: top; +} +th:first-child, td:first-child { + padding-left: 0; +} +th { + text-align: inherit; +} + +/* Figures */ +img { + max-width: 100%; + height: auto; +} |
