diff options
Diffstat (limited to 'public/style.css')
| -rw-r--r-- | public/style.css | 708 |
1 files changed, 536 insertions, 172 deletions
diff --git a/public/style.css b/public/style.css index db025d0..b5497de 100644 --- a/public/style.css +++ b/public/style.css @@ -7,32 +7,14 @@ sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; - --color-red-400: oklch(70.4% 0.191 22.216); - --color-red-800: oklch(44.4% 0.177 26.899); - --color-red-950: oklch(25.8% 0.092 26.042); - --color-emerald-400: oklch(76.5% 0.177 163.223); - --color-emerald-800: oklch(43.2% 0.095 166.913); - --color-emerald-950: oklch(26.2% 0.051 172.552); --color-gray-700: oklch(37.3% 0.034 259.733); - --color-zinc-200: oklch(92% 0.004 286.32); - --color-zinc-300: oklch(87.1% 0.006 286.286); - --color-zinc-400: oklch(70.5% 0.015 286.067); - --color-zinc-500: oklch(55.2% 0.016 285.938); --color-black: #000; --color-white: #fff; --spacing: 0.25rem; --container-3xl: 48rem; - --text-xs: 0.75rem; - --text-xs--line-height: calc(1 / 0.75); - --text-sm: 0.875rem; - --text-sm--line-height: calc(1.25 / 0.875); - --text-2xl: 1.5rem; - --text-2xl--line-height: calc(2 / 1.5); --font-weight-normal: 400; --font-weight-bold: 700; - --tracking-wider: 0.05em; --leading-relaxed: 1.625; - --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-font-family: var(--font-sans); @@ -188,9 +170,6 @@ } } @layer utilities { - .pointer-events-none { - pointer-events: none; - } .invisible { visibility: hidden; } @@ -212,9 +191,6 @@ .inset-x-\[0\.3rem\] { inset-inline: 0.3rem; } - .top-1 { - top: var(--spacing); - } .top-1\/2 { top: calc(1 / 2 * 100%); } @@ -287,12 +263,430 @@ .my-\[5vw\] { margin-block: 5vw; } + .prose { + color: var(--tw-prose-body); + max-width: 65ch; + :where(p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 1.25em; + margin-bottom: 1.25em; + } + :where([class~="lead"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-lead); + font-size: 1.25em; + line-height: 1.6; + margin-top: 1.2em; + margin-bottom: 1.2em; + } + :where(a):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-links); + text-decoration: underline; + font-weight: 500; + } + :where(strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-bold); + font-weight: 600; + } + :where(a strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(blockquote strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(thead th strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: decimal; + margin-top: 1.25em; + margin-bottom: 1.25em; + padding-inline-start: 1.625em; + } + :where(ol[type="A"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: upper-alpha; + } + :where(ol[type="a"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: lower-alpha; + } + :where(ol[type="A" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: upper-alpha; + } + :where(ol[type="a" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: lower-alpha; + } + :where(ol[type="I"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: upper-roman; + } + :where(ol[type="i"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: lower-roman; + } + :where(ol[type="I" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: upper-roman; + } + :where(ol[type="i" s]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: lower-roman; + } + :where(ol[type="1"]):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: decimal; + } + :where(ul):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + list-style-type: disc; + margin-top: 1.25em; + margin-bottom: 1.25em; + padding-inline-start: 1.625em; + } + :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *))::marker { + font-weight: 400; + color: var(--tw-prose-counters); + } + :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *))::marker { + color: var(--tw-prose-bullets); + } + :where(dt):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-headings); + font-weight: 600; + margin-top: 1.25em; + } + :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + border-color: var(--tw-prose-hr); + border-top-width: 1px; + margin-top: 3em; + margin-bottom: 3em; + } + :where(blockquote):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + font-weight: 500; + font-style: italic; + color: var(--tw-prose-quotes); + border-inline-start-width: 0.25rem; + border-inline-start-color: var(--tw-prose-quote-borders); + quotes: "\201C""\201D""\2018""\2019"; + margin-top: 1.6em; + margin-bottom: 1.6em; + padding-inline-start: 1em; + } + :where(blockquote p:first-of-type):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { + content: open-quote; + } + :where(blockquote p:last-of-type):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { + content: close-quote; + } + :where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-headings); + font-weight: 800; + font-size: 2.25em; + margin-top: 0; + margin-bottom: 0.8888889em; + line-height: 1.1111111; + } + :where(h1 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + font-weight: 900; + color: inherit; + } + :where(h2):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-headings); + font-weight: 700; + font-size: 1.5em; + margin-top: 2em; + margin-bottom: 1em; + line-height: 1.3333333; + } + :where(h2 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + font-weight: 800; + color: inherit; + } + :where(h3):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-headings); + font-weight: 600; + font-size: 1.25em; + margin-top: 1.6em; + margin-bottom: 0.6em; + line-height: 1.6; + } + :where(h3 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + font-weight: 700; + color: inherit; + } + :where(h4):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-headings); + font-weight: 600; + margin-top: 1.5em; + margin-bottom: 0.5em; + line-height: 1.5; + } + :where(h4 strong):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + font-weight: 700; + color: inherit; + } + :where(img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 2em; + margin-bottom: 2em; + } + :where(picture):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + display: block; + margin-top: 2em; + margin-bottom: 2em; + } + :where(video):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 2em; + margin-bottom: 2em; + } + :where(kbd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + font-weight: 500; + font-family: inherit; + color: var(--tw-prose-kbd); + box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows); + font-size: 0.875em; + border-radius: 0.3125rem; + padding-top: 0.1875em; + padding-inline-end: 0.375em; + padding-bottom: 0.1875em; + padding-inline-start: 0.375em; + } + :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-code); + font-weight: 600; + font-size: 0.875em; + } + :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { + content: "`"; + } + :where(code):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { + content: "`"; + } + :where(a code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(h1 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(h2 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + font-size: 0.875em; + } + :where(h3 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + font-size: 0.9em; + } + :where(h4 code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(blockquote code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(thead th code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: inherit; + } + :where(pre):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-pre-code); + background-color: var(--tw-prose-pre-bg); + overflow-x: auto; + font-weight: 400; + font-size: 0.875em; + line-height: 1.7142857; + margin-top: 1.7142857em; + margin-bottom: 1.7142857em; + border-radius: 0.375rem; + padding-top: 0.8571429em; + padding-inline-end: 1.1428571em; + padding-bottom: 0.8571429em; + padding-inline-start: 1.1428571em; + } + :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + background-color: transparent; + border-width: 0; + border-radius: 0; + padding: 0; + font-weight: inherit; + color: inherit; + font-size: inherit; + font-family: inherit; + line-height: inherit; + } + :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *))::before { + content: none; + } + :where(pre code):not(:where([class~="not-prose"], [class~="not-prose"] *))::after { + content: none; + } + :where(table):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + width: 100%; + table-layout: auto; + margin-top: 2em; + margin-bottom: 2em; + font-size: 0.875em; + line-height: 1.7142857; + } + :where(thead):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + border-bottom-width: 1px; + border-bottom-color: var(--tw-prose-th-borders); + } + :where(thead th):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-headings); + font-weight: 600; + vertical-align: bottom; + padding-inline-end: 0.5714286em; + padding-bottom: 0.5714286em; + padding-inline-start: 0.5714286em; + } + :where(tbody tr):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + border-bottom-width: 1px; + border-bottom-color: var(--tw-prose-td-borders); + } + :where(tbody tr:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + border-bottom-width: 0; + } + :where(tbody td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + vertical-align: baseline; + } + :where(tfoot):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + border-top-width: 1px; + border-top-color: var(--tw-prose-th-borders); + } + :where(tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + vertical-align: top; + } + :where(th, td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + text-align: start; + } + :where(figure > *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + margin-bottom: 0; + } + :where(figcaption):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + color: var(--tw-prose-captions); + font-size: 0.875em; + line-height: 1.4285714; + margin-top: 0.8571429em; + } + --tw-prose-body: oklch(37.3% 0.034 259.733); + --tw-prose-headings: oklch(21% 0.034 264.665); + --tw-prose-lead: oklch(44.6% 0.03 256.802); + --tw-prose-links: oklch(21% 0.034 264.665); + --tw-prose-bold: oklch(21% 0.034 264.665); + --tw-prose-counters: oklch(55.1% 0.027 264.364); + --tw-prose-bullets: oklch(87.2% 0.01 258.338); + --tw-prose-hr: oklch(92.8% 0.006 264.531); + --tw-prose-quotes: oklch(21% 0.034 264.665); + --tw-prose-quote-borders: oklch(92.8% 0.006 264.531); + --tw-prose-captions: oklch(55.1% 0.027 264.364); + --tw-prose-kbd: oklch(21% 0.034 264.665); + --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent); + --tw-prose-code: oklch(21% 0.034 264.665); + --tw-prose-pre-code: oklch(92.8% 0.006 264.531); + --tw-prose-pre-bg: oklch(27.8% 0.033 256.848); + --tw-prose-th-borders: oklch(87.2% 0.01 258.338); + --tw-prose-td-borders: oklch(92.8% 0.006 264.531); + --tw-prose-invert-body: oklch(87.2% 0.01 258.338); + --tw-prose-invert-headings: #fff; + --tw-prose-invert-lead: oklch(70.7% 0.022 261.325); + --tw-prose-invert-links: #fff; + --tw-prose-invert-bold: #fff; + --tw-prose-invert-counters: oklch(70.7% 0.022 261.325); + --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802); + --tw-prose-invert-hr: oklch(37.3% 0.034 259.733); + --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542); + --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733); + --tw-prose-invert-captions: oklch(70.7% 0.022 261.325); + --tw-prose-invert-kbd: #fff; + --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); + --tw-prose-invert-code: #fff; + --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338); + --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); + --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802); + --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733); + font-size: 1rem; + line-height: 1.75; + :where(picture > img):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + margin-bottom: 0; + } + :where(li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0.5em; + margin-bottom: 0.5em; + } + :where(ol > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-inline-start: 0.375em; + } + :where(ul > li):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-inline-start: 0.375em; + } + :where(.prose > ul > li p):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0.75em; + margin-bottom: 0.75em; + } + :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 1.25em; + } + :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-bottom: 1.25em; + } + :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 1.25em; + } + :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-bottom: 1.25em; + } + :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0.75em; + margin-bottom: 0.75em; + } + :where(dl):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 1.25em; + margin-bottom: 1.25em; + } + :where(dd):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0.5em; + padding-inline-start: 1.625em; + } + :where(hr + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + } + :where(h2 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + } + :where(h3 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + } + :where(h4 + *):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + } + :where(thead th:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-inline-start: 0; + } + :where(thead th:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-inline-end: 0; + } + :where(tbody td, tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-top: 0.5714286em; + padding-inline-end: 0.5714286em; + padding-bottom: 0.5714286em; + padding-inline-start: 0.5714286em; + } + :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-inline-start: 0; + } + :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + padding-inline-end: 0; + } + :where(figure):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 2em; + margin-bottom: 2em; + } + :where(.prose > :first-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-top: 0; + } + :where(.prose > :last-child):not(:where([class~="not-prose"], [class~="not-prose"] *)) { + margin-bottom: 0; + } + } .mt-\[0\.5rem\] { margin-top: 0.5rem; } .mt-\[0\.625vw\] { margin-top: 0.625vw; } + .mt-\[1rem\] { + margin-top: 1rem; + } .mt-\[1vw\] { margin-top: 1vw; } @@ -440,19 +834,9 @@ .flex-1 { flex: 1; } - .flex-shrink { - flex-shrink: 1; - } .shrink-0 { flex-shrink: 0; } - .border-collapse { - border-collapse: collapse; - } - .-translate-y-1 { - --tw-translate-y: calc(var(--spacing) * -1); - translate: var(--tw-translate-x) var(--tw-translate-y); - } .-translate-y-1\/2 { --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); @@ -469,9 +853,6 @@ .cursor-grab { cursor: grab; } - .cursor-not-allowed { - cursor: not-allowed; - } .cursor-pointer { cursor: pointer; } @@ -544,6 +925,9 @@ .gap-x-\[1ch\] { column-gap: 1ch; } + .gap-x-\[1rem\] { + column-gap: 1rem; + } .gap-x-\[2rem\] { column-gap: 2rem; } @@ -641,24 +1025,6 @@ border-color: color-mix(in oklab, var(--alt) 30%, transparent); } } - .border-\(--alt\)\/60 { - border-color: var(--alt); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--alt) 60%, transparent); - } - } - .border-\(--alt\)\/70 { - border-color: var(--alt); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--alt) 70%, transparent); - } - } - .border-\(--alt\)\/80 { - border-color: var(--alt); - @supports (color: color-mix(in lab, red, red)) { - border-color: color-mix(in oklab, var(--alt) 80%, transparent); - } - } .border-\(--secondary\)\/60 { border-color: var(--secondary); @supports (color: color-mix(in lab, red, red)) { @@ -698,27 +1064,6 @@ .bg-\[var\(--text\)\] { background-color: var(--text); } - .bg-black { - background-color: var(--color-black); - } - .bg-black\/0 { - background-color: color-mix(in srgb, #000 0%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 0%, transparent); - } - } - .bg-black\/10 { - background-color: color-mix(in srgb, #000 10%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 10%, transparent); - } - } - .bg-black\/15 { - background-color: color-mix(in srgb, #000 15%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 15%, transparent); - } - } .bg-black\/20 { background-color: color-mix(in srgb, #000 20%, transparent); @supports (color: color-mix(in lab, red, red)) { @@ -731,33 +1076,12 @@ background-color: color-mix(in oklab, var(--color-black) 30%, transparent); } } - .bg-black\/50 { - background-color: color-mix(in srgb, #000 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-black) 50%, transparent); - } - } - .bg-white { - background-color: var(--color-white); - } .bg-white\/2 { background-color: color-mix(in srgb, #fff 2%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 2%, transparent); } } - .bg-white\/5 { - background-color: color-mix(in srgb, #fff 5%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 5%, transparent); - } - } - .bg-white\/15 { - background-color: color-mix(in srgb, #fff 15%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-white) 15%, transparent); - } - } .bg-white\/\[0\.03\] { background-color: color-mix(in srgb, #fff 3%, transparent); @supports (color: color-mix(in lab, red, red)) { @@ -809,9 +1133,6 @@ .p-\[3vw\] { padding: 3vw; } - .px-3 { - padding-inline: calc(var(--spacing) * 3); - } .px-3\.5 { padding-inline: calc(var(--spacing) * 3.5); } @@ -869,6 +1190,9 @@ .text-right { text-align: right; } + .font-\(family-name\:--font-normal\) { + font-family: var(--font-normal); + } .font-\[\'JetBrains_Mono\'\] { font-family: 'JetBrains Mono'; } @@ -908,6 +1232,9 @@ .text-\[5vw\] { font-size: 5vw; } + .text-\[17\.6px\] { + font-size: 17.6px; + } .text-\[60\%\] { font-size: 60%; } @@ -935,6 +1262,10 @@ .text-\[170\%\] { font-size: 170%; } + .leading-\[1\.7\] { + --tw-leading: 1.7; + line-height: 1.7; + } .leading-\[normal\] { --tw-leading: normal; line-height: normal; @@ -963,12 +1294,6 @@ .text-\(--alt\) { color: var(--alt); } - .text-\(--alt\)\/20 { - color: var(--alt); - @supports (color: color-mix(in lab, red, red)) { - color: color-mix(in oklab, var(--alt) 20%, transparent); - } - } .text-\(--alt\)\/80 { color: var(--alt); @supports (color: color-mix(in lab, red, red)) { @@ -993,15 +1318,6 @@ .text-\[\#5C6CC1\] { color: #5C6CC1; } - .text-\[\#8eb0c8\] { - color: #8eb0c8; - } - .text-\[\#9A38F4\] { - color: #9A38F4; - } - .text-\[\#9e55e1\] { - color: #9e55e1; - } .text-\[\#46d46c\] { color: #46d46c; } @@ -1014,24 +1330,9 @@ .text-\[\#897ccb\] { color: #897ccb; } - .text-\[\#5079DB\] { - color: #5079DB; - } - .text-\[\#5487ac\] { - color: #5487ac; - } .text-\[\#5874FF\] { color: #5874FF; } - .text-\[\#5947B4\] { - color: #5947B4; - } - .text-\[\#7847D1\] { - color: #7847D1; - } - .text-\[\#487494\] { - color: #487494; - } .text-\[\#BDC3C7\] { color: #BDC3C7; } @@ -1044,9 +1345,6 @@ .text-\[\#D27D9B\] { color: #D27D9B; } - .text-\[\#DD6718\] { - color: #DD6718; - } .text-\[\#ED532D\] { color: #ED532D; } @@ -1068,12 +1366,6 @@ .text-\[\#a34eeb\] { color: #a34eeb; } - .text-\[\#ad72c7\] { - color: #ad72c7; - } - .text-\[\#b56df7\] { - color: #b56df7; - } .text-\[\%v\] { color: %v; } @@ -1089,15 +1381,9 @@ .no-underline { text-decoration-line: none; } - .underline { - text-decoration-line: underline; - } .opacity-0 { opacity: 0%; } - .opacity-40 { - opacity: 40%; - } .shadow-\[0_0_1\.5rem_color-mix\(in_srgb\,var\(--accent\)_25\%\,transparent\)\] { --tw-shadow: 0 0 1.5rem var(--tw-shadow-color, var(--accent)); @supports (color: color-mix(in lab, red, red)) { @@ -1105,10 +1391,6 @@ } box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } - .outline { - outline-style: var(--tw-outline-style); - outline-width: 1px; - } .transition-colors { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); @@ -1118,10 +1400,6 @@ --tw-duration: 150ms; transition-duration: 150ms; } - .select-none { - -webkit-user-select: none; - user-select: none; - } .select-text { -webkit-user-select: text; user-select: text; @@ -1212,14 +1490,6 @@ background-color: color-mix(in oklab, var(--color-white) 10%, transparent); } } - .hover\:bg-white\/20:hover { - background-color: color-mix(in srgb, #fff 20%, transparent); - } - @supports (color: color-mix(in lab, red, red)) { - .hover\:bg-white\/20:hover { - background-color: color-mix(in oklab, var(--color-white) 20%, transparent); - } - } .hover\:text-\(--accent\):hover { color: var(--accent); } @@ -1429,6 +1699,111 @@ transform: scale(1.03); } } +.prose { + --tw-prose-body: var(--text); + --tw-prose-headings: var(--primary); + --tw-prose-links: var(--secondary); + --tw-prose-bold: var(--text); + --tw-prose-bullets: var(--alt); + --tw-prose-counters: var(--alt); + --tw-prose-hr: var(--alt); + --tw-prose-quotes: var(--text); + --tw-prose-quote-borders: var(--alt); + --tw-prose-captions: var(--alt); + --tw-prose-code: var(--extra); + --tw-prose-pre-code: var(--text); + --tw-prose-pre-bg: rgb(0 0 0 / 0.3); + --tw-prose-th-borders: var(--alt); + --tw-prose-td-borders: var(--alt); +} +.prose a.footnote-ref, .prose a.footnote-ref:hover { + text-decoration: none; +} +.prose code::before, .prose code::after { + content: none; +} +.prose :not(pre) > code { + padding: 0.1em 0.4em; + border-radius: 0.3em; + background: var(--alt); + @supports (color: color-mix(in lab, red, red)) { + background: color-mix(in srgb, var(--alt) 25%, transparent); + } + font-size: 0.9em; +} +.prose pre, .prose code { + font-family: var(--font-mono); +} +.js .footnotes { + display: none; +} +.sidenotes { + position: fixed; + overflow: hidden; + pointer-events: none; +} +.sidenote { + position: absolute; + left: 0; + right: 0; + background: var(--background); + font-family: var(--font-normal); + font-size: 16px; + line-height: 1.4; + pointer-events: auto; +} +.sidenotes.bordered .sidenote { + border: 0.1rem solid var(--alt); + padding: 0.4rem 0.6rem; +} +.sidenote-num { + font-size: 70%; + color: var(--secondary); + margin-right: 0.15em; +} +.chroma .k, .chroma .kc, .chroma .kd, .chroma .kn, .chroma .kp, .chroma .kr, .chroma .kt { + color: var(--secondary); +} +.chroma .nf, .chroma .nc, .chroma .nb { + color: var(--primary); +} +.chroma .s, .chroma .sa, .chroma .sb, .chroma .sc, .chroma .dl, .chroma .sd, .chroma .s2, .chroma .se, .chroma .sh, .chroma .si, .chroma .sx, .chroma .sr, .chroma .s1, .chroma .ss { + color: var(--extra); +} +.chroma .m, .chroma .mb, .chroma .mf, .chroma .mh, .chroma .mi, .chroma .il, .chroma .mo { + color: var(--primary); +} +.chroma .c, .chroma .ch, .chroma .cm, .chroma .c1, .chroma .cs, .chroma .cp, .chroma .cpf { + color: var(--alt); + font-style: italic; +} +.codeblock { + margin: 1.2em 0; + border: 0.1rem solid var(--alt); + border-radius: 0.4rem; + background: rgb(0 0 0 / 0.3); + overflow: hidden; +} +.codeblock::before { + content: attr(data-lang); + display: block; + padding: 0.2em 0.8em; + border-bottom: 0.1rem solid var(--alt); + font-size: 0.75em; + color: var(--alt); +} +.codeblock[data-lang=""]::before { + display: none; +} +.codeblock pre { + margin: 0; + padding: 0.8em 1em; + background: transparent; + border-radius: 0; + overflow-x: auto; + font-size: 0.85em; + line-height: 1.5; +} @property --tw-translate-x { syntax: "*"; inherits: false; @@ -1562,11 +1937,6 @@ inherits: false; initial-value: 0 0 #0000; } -@property --tw-outline-style { - syntax: "*"; - inherits: false; - initial-value: solid; -} @property --tw-duration { syntax: "*"; inherits: false; @@ -1576,11 +1946,6 @@ initial-value: ""; inherits: false; } -@keyframes pulse { - 50% { - opacity: 0.5; - } -} @layer properties { @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { @@ -1613,7 +1978,6 @@ --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; - --tw-outline-style: solid; --tw-duration: initial; --tw-content: ""; } |