diff options
Diffstat (limited to 'src/styles/post.css')
| -rw-r--r-- | src/styles/post.css | 129 |
1 files changed, 129 insertions, 0 deletions
diff --git a/src/styles/post.css b/src/styles/post.css new file mode 100644 index 0000000..33b8729 --- /dev/null +++ b/src/styles/post.css @@ -0,0 +1,129 @@ +:root { + --code-bg: #F5F0FF; + --code-border: #D5C8F0; + --code-inline-color: #D0372D; + --meta-color: #707183; +} + +@media (prefers-color-scheme: dark) { + :root:not([data-theme="light"]) { + --code-bg: #1e1b2e; + --code-border: #3d3560; + --code-inline-color: #ff9090; + --meta-color: #8b929e; + } +} + +[data-theme="dark"] { + --code-bg: #1e1b2e; + --code-border: #3d3560; + --code-inline-color: #ff9090; + --meta-color: #8b929e; +} + +pre { + background-color: var(--code-bg); + border: 1px solid var(--code-border); + border-radius: 2px; + padding: 1rem; + overflow: auto; + font-size: 0.8rem; +} + +code { + font-family: "Consolas" sans-serif; + color: var(--code-inline-color); +} + +/* Shiki dual-theme support */ +.astro-code, .astro-code span { + color: var(--shiki-light) !important; + background-color: var(--shiki-light-bg) !important; +} + +@media (prefers-color-scheme: dark) { + :root:not([data-theme="light"]) .astro-code, + :root:not([data-theme="light"]) .astro-code span { + color: var(--shiki-dark) !important; + background-color: var(--shiki-dark-bg) !important; + } +} + +[data-theme="dark"] .astro-code, +[data-theme="dark"] .astro-code span { + color: var(--shiki-dark) !important; + background-color: var(--shiki-dark-bg) !important; +} + +.underline { + text-decoration: underline; +} + +.org-article-title { + display: flex; + flex-direction: row; + justify-content: space-between; +} + +.org-article-title h1 { + margin: 0; + font-family: "Space Grotesk", sans-serif; +} + +.org-article-content { + padding-bottom: 10vh; +} + +.org-article-content h2, +.org-article-content h3, +.org-article-content h4 { + position: relative; + font-family: "Space Grotesk", sans-serif; +} + +.org-article-content h2 { + font-size: 1.6rem; + border-bottom: 2px solid var(--link-color); + padding-bottom: 0.2rem; +} + +.org-article-content h3 { + font-size: 1.2rem; + color: var(--link-color); +} + +.org-article-content h2 > a.heading-anchor, +.org-article-content h3 > a.heading-anchor, +.org-article-content h4 > a.heading-anchor { + position: absolute; + left: -1.4em; + top: 0; + opacity: 0; + text-decoration: none; + font-weight: normal; + color: var(--link-color); + transition: opacity 100ms ease; +} + +.org-article-content h2:hover > a.heading-anchor, +.org-article-content h3:hover > a.heading-anchor, +.org-article-content h4:hover > a.heading-anchor { + opacity: 1; +} + +.figure p { + text-align: center; +} + +.org-article-title > h1 { + margin-bottom: 0; +} + +.org-article-title > span { + color: var(--meta-color); +} + +#org-div-home-and-up { + display: flex; + column-gap: 8px; +} |
