docs + various polish

This commit is contained in:
Jacky Zhao 2023-07-09 19:32:24 -07:00
parent b90590b9f4
commit 08f8e3b4a4
49 changed files with 1365 additions and 196 deletions
quartz/styles

View file

@ -15,16 +15,23 @@ body {
}
.text-highlight {
background-color: #fff236aa;
background-color: #fff23688;
padding: 0 0.1rem;
border-radius: 5px;
}
p, ul, text, a, tr, td, li, ol, ul, .katex {
p, ul, text, a, tr, td, li, ol, ul, .katex, .math {
color: var(--darkgray);
fill: var(--darkgray);
}
.math {
font-size: 1.1rem;
&.math-display {
text-align: center;
}
}
a {
font-weight: 600;
text-decoration: none;
@ -76,6 +83,10 @@ a {
padding-left: 0;
margin-left: -1.4rem;
}
& li > * {
margin: 0;
}
}
& > #quartz-body {
@ -144,6 +155,11 @@ a {
}
}
.footnotes {
margin-top: 2rem;
border-top: 1px solid var(--lightgray);
}
input[type="checkbox"] {
transform: translateY(2px);
color: var(--secondary);
@ -168,7 +184,7 @@ thead {
font-family: var(--headerFont);
color: var(--dark);
font-weight: revert;
margin: 2rem 0 0;
margin-bottom: 0;
article > & > a {
color: var(--dark);
@ -178,6 +194,8 @@ thead {
}
}
h1, h2, h3, h4, h5, h6 {
&[id] > a[href^="#"] {
margin: 0 0.5rem;
@ -200,13 +218,17 @@ div[data-rehype-pretty-code-fragment] {
& > div[data-rehype-pretty-code-title] {
font-family: var(--codeFont);
font-size: 0.9rem;
padding: 0.1rem 0.8rem;
padding: 0.1rem 0.5rem;
border: 1px solid var(--lightgray);
width: max-content;
border-radius: 5px;
margin-bottom: -0.8rem;
margin-bottom: -0.5rem;
color: var(--darkgray);
}
& > pre {
padding: 0.5rem 0;
}
}
pre {
@ -228,12 +250,17 @@ pre {
counter-increment: line 0;
display: grid;
& .line {
& [data-highlighted-chars] {
background-color: var(--highlight);
border-radius: 5px;
}
& > [data-line] {
padding: 0 0.25rem;
box-sizing: border-box;
border-left: 3px solid transparent;
&.highlighted {
&[data-highlighted-line] {
background-color: var(--highlight);
border-left: 3px solid var(--secondary);
}
@ -245,9 +272,17 @@ pre {
margin-right: 1rem;
display: inline-block;
text-align: right;
color: rgba(115, 138, 148, 0.4);
color: rgba(115, 138, 148, 0.6);
}
}
&[data-line-numbers-max-digits='2'] > [data-line]::before {
width: 2rem;
}
&[data-line-numbers-max-digits='3'] > [data-line]::before {
width: 3rem;
}
}
}
@ -265,6 +300,7 @@ tbody, li, p {
}
table {
margin: 1rem 0;
border: 1px solid var(--gray);
padding: 1.5rem;
border-collapse: collapse;
@ -294,21 +330,6 @@ hr {
background-color: var(--lightgray);
}
section {
margin: 2rem auto;
border-top: 1px solid var(--lightgray);
& > #footnote-label {
& > a {
color: var(--dark);
}
}
& ol, & ul {
padding: 0 1em
}
}
audio, video {
width: 100%;
border-radius: 5px;
@ -322,6 +343,10 @@ ul.overflow, ol.overflow {
height: 400px;
overflow-y: scroll;
// clearfix
content: "";
clear: both;
& > li:last-of-type {
margin-bottom: 50px;
}
@ -334,6 +359,8 @@ ul.overflow, ol.overflow {
position: absolute;
left: 0;
bottom: 0;
opacity: 1;
transition: opacity 0.3s ease;
background: linear-gradient(transparent 0px, var(--light));
}
}