diff --git a/configuration/template.html b/configuration/template.html index 6705b3b..70ffdac 100644 --- a/configuration/template.html +++ b/configuration/template.html @@ -1,216 +1,240 @@ - -{weblog-title}{separator}{post-title} - - -{feeds} - - - + article { + background-color: var(--article-background-color); + padding: 1em; + border-radius: 10px; + border: 2px solid var(--border-color); + } -
-

{weblog-title}

- {navigation} -
+ .fa-solid.fa-heart { + color: #c81d25; + } -
+ .pride-img { + margin: 0 auto; + } + + + +
+

{weblog-title}

+ {navigation} +
-
- {body} - - -
+
+
+ {body} + + +
-
+
+ a mashup of the transgender and bisexual pride flags. the two flags are flipped in the middle to form a heart shape of both -

Recent posts

+

Recent posts

-{recent-posts} + {recent-posts} +
-
- - - - + + diff --git a/weblog/page-template.md b/weblog/page-template.md index ad85f04..986d8ff 100644 --- a/weblog/page-template.md +++ b/weblog/page-template.md @@ -17,83 +17,83 @@ Title: Page Template @import url('https://static.omg.lol/type/fontawesome-free/css/all.css'); :root { - --foreground: #212529; - --background: #ffcccc; - --article-background-color: #ffe9e3; - --link-color: #4B0082; - --link-hover: #FF1493; - --accent: #868e96; - --border-color: #DB7093; - --font-size: 1rem; +--foreground: #212529; +--background: #ffcccc; +--article-background-color: #ffe9e3; +--link-color: #4B0082; +--link-hover: #FF1493; +--accent: #868e96; +--border-color: #DB7093; +--font-size: 1rem; } - @media (prefers-color-scheme: dark) { - :root { - --foreground: #f1dac4; - --background: #011627; - --article-background-color: #2f184b; - --link-color: #4cc9f0; - --link-hover: #f72585; - --accent: #868e96; - --border-color: #003566; - } +@media (prefers-color-scheme: dark) { +:root { +--foreground: #f1dac4; +--background: #011627; +--article-background-color: #2f184b; +--link-color: #4cc9f0; +--link-hover: #f72585; +--accent: #868e96; +--border-color: #003566; +} } -* { - box-sizing: border-box; -} +- { + box-sizing: border-box; + } html { - font-size: 16px; +font-size: 16px; } body { - font-family: 'Lato', sans-serif; - font-size: var(--font-size); - color: var(--foreground); - background: var(--background); - letter-spacing: 0.125rem; +font-family: 'Lato', sans-serif; +font-size: var(--font-size); +color: var(--foreground); +background: var(--background); +letter-spacing: 0.125rem; } header nav ul { - list-style-type: none; - margin: 0; - padding: 0; +list-style-type: none; +margin: 0; +padding: 0; } header nav li { - display: inline-block; +display: inline-block; } header nav li a { - display: block; - text-decoration: none; - margin-right: 1em; +display: block; +text-decoration: none; +margin-right: 1em; } h1, h2, h3, h4, h5, h6 { - font-family: 'VC Honey Deck', serif; - margin: 1rem 0; +font-family: 'VC Honey Deck', serif; +margin: 1rem 0; } p, li { - line-height: 1.25rem; +line-height: 1.25rem; } header, main, footer { - max-width: 60em; - margin: 2em auto; - padding: 0 1em; +max-width: 60em; +margin: 2em auto; +padding: 0 1em; } header { - margin-top: 4em; +margin-top: 4em; } footer p { - margin-top: 5em; - font-size: 90%; - text-align: center; +margin-top: 5em; +font-size: 90%; +text-align: center; } a:link { color: var(--link-color); } @@ -102,83 +102,87 @@ a:hover { color: var(--link-hover); } a:active { color: var(--link-color); } .post-info, .post-tags { - font-size: 85%; - color: var(--accent); - text-align: right; +font-size: 85%; +color: var(--accent); +text-align: right; } .post-info i:nth-child(2) { - margin-left: .75em; +margin-left: .75em; } .tag { - background: var(--accent); - color: var(--background) !important; - padding: .3em .4em; - margin: .8em 0 0 .4em; - border-radius: .5em; - text-decoration: none; - display: inline-block; +background: var(--accent); +color: var(--background) !important; +padding: .3em .4em; +margin: .8em 0 0 .4em; +border-radius: .5em; +text-decoration: none; +display: inline-block; } hr { - border: 0; - height: 1px; - background: #333; - margin: 2em 0; +border: 0; +height: 1px; +background: #333; +margin: 2em 0; } code { - padding: .2em .3em; - border: 1px solid var(--accent); - white-space: pre-wrap; - word-wrap: break-word; +padding: .2em .3em; +border: 1px solid var(--accent); +white-space: pre-wrap; +word-wrap: break-word; } pre, code { - font-family: 'MD IO 0.4'; - font-size: var(--font-size); +font-family: 'MD IO 0.4'; +font-size: var(--font-size); } pre code { - background: #000; - color: #eee; - display: inline-block; - padding: 1em; - white-space: pre-wrap; - word-wrap: break-word; +background: #000; +color: #eee; +display: inline-block; +padding: 1em; +white-space: pre-wrap; +word-wrap: break-word; } img { - max-width: 100%; +max-width: 100%; } table { - border-collapse: collapse; +border-collapse: collapse; } td, th { - padding: .75em; - text-align: left; - border: 1px solid var(--accent); +padding: .75em; +text-align: left; +border: 1px solid var(--accent); } - .weblog-title a { - text-decoration: none; - color: var(--foreground); +text-decoration: none; +color: var(--foreground); } main { - padding: 1em; - background-color: var(--article-background-color); - border-radius: 10px; - border: 2px solid var(--border-color); +padding: 1em; +background-color: var(--article-background-color); +border-radius: 10px; +border: 2px solid var(--border-color); } .fa-solid.fa-heart { - color: #c81d25; +color: #c81d25; +} + +.pride-img { +margin: 0 auto; } + @@ -192,7 +196,7 @@ main { {body}
- +a mashup of the transgender and bisexual pride flags. the two flags are flipped in the middle to form a heart shape of both