diff options
| author | mms <michal@sapka.me> | 2024-05-23 20:05:14 +0200 |
|---|---|---|
| committer | mms <michal@sapka.me> | 2024-05-23 20:05:14 +0200 |
| commit | 56b41b128f1f13d80ae4d317a29bc9c14d9bdeae (patch) | |
| tree | a96a45c04af7f5c5f728feb745310c42225e0cd2 /layouts/brain-rot/baseof.html | |
| parent | 4b12cdfcd78d3762769e64d439190f5914ed4075 (diff) | |
feat: brain rot, preview:
Diffstat (limited to 'layouts/brain-rot/baseof.html')
| -rw-r--r-- | layouts/brain-rot/baseof.html | 140 |
1 files changed, 140 insertions, 0 deletions
diff --git a/layouts/brain-rot/baseof.html b/layouts/brain-rot/baseof.html new file mode 100644 index 0000000..15f96d7 --- /dev/null +++ b/layouts/brain-rot/baseof.html @@ -0,0 +1,140 @@ +<!DOCTYPE html> +<html lang="en"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + {{ partial "header/meta" . }} + <style> + :root { + --content-bg: #fff; + --highlight-color: #978b27; + --text-color: 000; + } + html { + height:100%; + font-family: helvetica; + font-size: 1em; + color: var(--text-color); + } + body { + margin: 0; + padding: 0; + height: 100%; + background-color: var(--content-bg); + } + a { + color: var(--text-color); + } + a:hover { + color: var(--highlight-color); + } + .container { + display: flex; + min-height: 100%; + max-width: 1020px; + } + + .decoration-left { + background-color: #000; + width: 200px; + min-height: 100%; + flex-shrink: 0; + mask: conic-gradient(from -135deg at right,#0000,#000 1deg 89deg,#0000 90deg) 50%/100% 35px; + {{- $bg := resources.Get "brain-rot/bg-stars.jpg" }} + background-image: url("{{ $bg.Permalink }}"); + } + + .main { + flex-grow: 1; + padding: 15px; + padding-left: 40px; + padding-top: 70px; + padding-bottom: 40px; + } + + @media only screen and (max-width: 600px) { + .decoration-left { + width: 30px; + } + + .main { + padding-left: 20px; + } + } + + + .breadcrumbs, .lastup { + font-size: 0.8em; + } + + h1 { + margin-top: 5px; + margin-bottom: 10px; + font-family: sans-serif; + font-size: 1.8em; + font-weight: 500; + } + + article { + text-align: justify; + line-height: 1.6em; + } + + img { + max-width: 99%; + height: auto; + } + + article figure { + text-align: enter; + margin: 0; + max-width: 100%; + font-size: 0.8em; + } + img.float-right { + float: right; + display: inline; + margin-left: 10px; + } + img.center { + max-width: 100%; + height: auto; + } + img.small { + max-width: 50%; + height: auto; + } + figure.graph { + background-color: var(--highlight-bg); + padding: 5px; + padding-top: 20px; + } + figure.graph img { + width: 95%; + } + + .rating-box { + float: right; + margin: 10px; + text-align: center; + } + </style> + <body> + <div class="container"> + <div class="decoration-left"></div> + <div class="main"> + <nav class="home"> + <a href="/brain-rot/">Michal's Brain Rot:</a> + </nav> + <h1> {{ .Page.Title }}</h1> + + <nav class="breadcrumbs"> + </nav> + + <hr> + <main> + {{ block "main" . }} + {{ end }} + </main> + </div> + </div> + </body> +</html> |