diff options
Diffstat (limited to 'themes/JustZvan/assets/css')
| -rw-r--r-- | themes/JustZvan/assets/css/main.css | 206 |
1 files changed, 206 insertions, 0 deletions
diff --git a/themes/JustZvan/assets/css/main.css b/themes/JustZvan/assets/css/main.css new file mode 100644 index 0000000..9804cf4 --- /dev/null +++ b/themes/JustZvan/assets/css/main.css @@ -0,0 +1,206 @@ +body { + background: #000; + color: #fff; + font-family: "JetBrains Mono Regular"; + margin: 0; + display: flex; + flex-direction: column; + min-height: 100vh; +} + +*, +*::before, +*::after { + box-sizing: border-box; +} + +a { + color: #fff; +} + +a:visited { + color: #fff; +} + +.sitename { + font-family: "Pencil Child"; + font-size: 5rem; + margin: 0; +} + +header { + padding: 1rem; + display: flex; + justify-content: center; +} + +footer { + text-align: center; + padding: 1rem; + opacity: 0.7; + font-size: 0.9rem; +} + +main { + flex: 1; + display: flex; + flex-direction: column; +} + +.home-hero { + flex: 1; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 1.5rem; + text-align: center; + padding: 1rem; +} + +.home-about { + max-width: 60ch; + line-height: 1.6; +} + +.home-about p { + margin: 0; +} + +nav ul { + list-style: none; + display: flex; + flex-wrap: nowrap; + justify-content: center; + align-items: center; + gap: 1.25rem; + margin: 0; + padding: 0; + white-space: nowrap; + overflow-x: auto; +} + +nav li { + flex: 0 0 auto; +} + +nav a { + letter-spacing: 0.03em; +} + +.home-social-links { + display: flex; + flex-wrap: nowrap; + justify-content: center; + align-items: center; + gap: 1rem; + white-space: nowrap; + overflow-x: auto; +} + +.home-social-links a { + text-decoration: none; +} + +.home-social-links a:hover { + text-decoration: underline; +} + +.post-page { + flex: 1; + width: min(65ch, 100%); + margin: 0 auto; + padding: 2.5rem 1rem; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: stretch; + text-align: left; +} + +.post-page > * { + width: 100%; +} + +.post-page h1, +.post-page time { + text-align: center; +} + +.post-page img, +.post-page video, +.post-page iframe, +.post-page table, +.post-page pre { + max-width: 100%; +} + +.post-page pre { + overflow-x: auto; +} + +.post-page p, +.post-page li { + overflow-wrap: anywhere; +} + +.list-page { + width: min(65ch, 100%); + margin: 0 auto; + padding: 2.5rem 1rem; + display: flex; + flex-direction: column; + gap: 2rem; +} + +.page-title { + text-align: center; + margin: 0 0 2rem 0; +} + +.post-list { + display: flex; + flex-direction: column; + gap: 3rem; +} + +.post-list-item { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +.post-list-meta time { + font-size: 0.9rem; + opacity: 0.7; + letter-spacing: 0.05em; +} + +.post-list-title { + margin: 0; + font-size: 1.5rem; +} + +.post-list-title a { + text-decoration: none; +} + +.post-list-title a:hover { + text-decoration: underline; +} + +.post-list-summary { + margin: 0; + opacity: 0.8; + line-height: 1.6; +} + +@font-face { + font-family: "JetBrains Mono Regular"; + src: url("/fonts/JetBrainsMono-Regular.woff2"); +} + +@font-face { + font-family: "Pencil Child"; + src: url("/fonts/Pencil Child.ttf"); +} |