| | |
| | | scroll-behavior: smooth; |
| | | -webkit-text-size-adjust: none; |
| | | text-size-adjust: none; |
| | | overflow-x: hidden; |
| | | width: 100vw; |
| | | } |
| | | |
| | | body { |
| | |
| | | @media all and (max-width: $fullPageWidth) { |
| | | margin: 0 auto; |
| | | padding: 0 1rem; |
| | | max-width: 800px; |
| | | max-width: $pageWidth; |
| | | } |
| | | |
| | | & article { |
| | |
| | | margin-top: 0; |
| | | margin-bottom: 0; |
| | | } |
| | | |
| | | p > strong { |
| | | color: var(--dark); |
| | | } |
| | | } |
| | | |
| | | & > #quartz-body { |
| | |
| | | |
| | | & .center, |
| | | & footer { |
| | | width: $pageWidth; |
| | | margin-left: auto; |
| | | margin-right: auto; |
| | | width: $pageWidth; |
| | | @media all and (max-width: $fullPageWidth) { |
| | | width: initial; |
| | | margin-left: 0; |
| | |
| | | // typography improvements |
| | | h1 { |
| | | font-size: 1.75rem; |
| | | margin-top: 2.75rem; |
| | | margin-top: 2.25rem; |
| | | margin-bottom: 1rem; |
| | | } |
| | | |
| | | h2 { |
| | | font-size: 1.4rem; |
| | | margin-top: 2.4rem; |
| | | margin-top: 1.9rem; |
| | | margin-bottom: 1rem; |
| | | } |
| | | |
| | | h3 { |
| | | font-size: 1.12rem; |
| | | margin-top: 2.12rem; |
| | | margin-top: 1.62rem; |
| | | margin-bottom: 1rem; |
| | | } |
| | | |
| | | h4, |
| | | h5, |
| | | h6 { |
| | | font-size: 1rem; |
| | | margin-top: 2rem; |
| | | margin-top: 1.5rem; |
| | | margin-bottom: 1rem; |
| | | } |
| | | |
| | | div[data-rehype-pretty-code-fragment] { |
| | |
| | | border-radius: 5px; |
| | | overflow-x: auto; |
| | | border: 1px solid var(--lightgray); |
| | | position: relative; |
| | | |
| | | &:has(> code.mermaid) { |
| | | border: none; |
| | | position: relative; |
| | | } |
| | | |
| | | & > code { |
| | |
| | | |
| | | ul.overflow, |
| | | ol.overflow { |
| | | height: 400px; |
| | | height: 300px; |
| | | overflow-y: scroll; |
| | | |
| | | // clearfix |