From 4cfcde805a48d8db24e31388db34b3cecf530260 Mon Sep 17 00:00:00 2001 From: zoe Date: Wed, 13 Apr 2022 19:43:30 +0200 Subject: [PATCH] fix lightmode button being weird --- content/posts/lorem.md | 4 + ...s_f300667da4f5b5f84e1a9e0702b2fdde.content | 226 ++++++++++++------ themes/battheme | 2 +- 3 files changed, 162 insertions(+), 70 deletions(-) diff --git a/content/posts/lorem.md b/content/posts/lorem.md index 8241894..778d38d 100644 --- a/content/posts/lorem.md +++ b/content/posts/lorem.md @@ -52,6 +52,10 @@ ordered list: #### Header4 +#### Crash + +#### Crash + Table Header-1 | Table Header-2 | Table Header-3 :--- | :---: | ---: Table Data-1 | Table Data-2 | Table Data-3 diff --git a/resources/_gen/assets/scss/scss/main.scss_f300667da4f5b5f84e1a9e0702b2fdde.content b/resources/_gen/assets/scss/scss/main.scss_f300667da4f5b5f84e1a9e0702b2fdde.content index f565a33..c979e9e 100644 --- a/resources/_gen/assets/scss/scss/main.scss_f300667da4f5b5f84e1a9e0702b2fdde.content +++ b/resources/_gen/assets/scss/scss/main.scss_f300667da4f5b5f84e1a9e0702b2fdde.content @@ -1,26 +1,29 @@ @charset "UTF-8"; +* { + transition: 2s; } + body { background-color: #27234c; color: #e88dc3; - transition: 1s; } + transition: 2s; } body.light { background-color: #dde4ff; color: #4b3d44; } a { - background-color: #f2504b; - color: #27234c; - transition: 1s; } + background-color: transparent; + color: #d3d37c; + transition: 2s; } a.light { - background-color: #733c7c; - color: #dde4ff; } + background-color: transparent; + color: #733c7c; } a.footer-nav-item.active, a.footer-nav-item:hover { color: #f2504b; background-color: #27234c; border-color: #27234c; - transition: 0.24s; } + transition: 0.2s; } a.footer-nav-item.active.light, a.footer-nav-item:hover.light { color: #733c7c; @@ -30,7 +33,7 @@ a.footer-nav-item:hover { footer { background-color: #f2504b; color: #27234c; - transition: 1s; } + transition: 2s; } footer.light { background-color: #733c7c; color: #dde4ff; } @@ -38,7 +41,7 @@ footer { footer a { color: #27234c; background-color: #f2504b; - transition: 1s; } + transition: 2s; } footer a.light { color: #dde4ff; background-color: #733c7c; } @@ -46,7 +49,7 @@ footer a { .togglelabel { background-color: #f2504b; border-color: #27234c; - transition: 1s; } + transition: 2s; } .togglelabel.light { background-color: #733c7c; border-color: #dde4ff; } @@ -54,85 +57,138 @@ footer a { .togglelabel.light::after { background-color: #dde4ff; color: #733c7c; - transition: 1s; } + transition: 2s; } .togglelabel::after { background-color: #27234c; color: #f2504b; - transition: 1s; } + transition: 2s; } body.light #title { color: #dde4ff; background-color: #733c7c; - transition: 1s; } + transition: 2s; } body #title { color: #27234c; background-color: #f2504b; - transition: 1s; } + transition: 2s; } article { background-color: #27234c; border-color: #f2504b; - transition: 1s; } + transition: 2s; } article.light { background-color: #dde4ff; border-color: #733c7c; } -article h2 { +h2 { background-color: #b296ff; color: #27234c; - transition: 1s; } + transition: 2s; } + h2.light { + color: #dde4ff; } -article h3 { +h2 a { + color: #27234c; } + +h3 { background-color: #39b8a3; color: #27234c; - transition: 1s; } + transition: 2s; } -article.light h3 { - background-color: #225091; - color: #dde4ff; - transition: 1s; } - -article h4 { - background-color: #dde4ff; - color: #27234c; - transition: 1s; } - -article.light h4 { - background-color: #27234c; - color: #dde4ff; - transition: 1s; } - -article.light h2 { - background-color: #007582; - color: #dde4ff; - transition: 1s; } - -article h5, -article h6, -article a { - background-color: #f2504b; - color: #27234c; - transition: 1s; } - -article.light h5, -article.light h6, -article.light a { - background-color: #733c7c; - color: #dde4ff; - transition: 1s; } - -a:hover { - color: #f2504b; - background-color: transparent; } - a:hover.light { - color: #733c7c; +h3 a { + color: #27234c; } + h3 a:hover { background-color: transparent; } -article.light a:hover { +h3.light { + background-color: #225091; + color: #dde4ff; + transition: 2s; } + h3.lighta { + color: #dde4ff; } + +h5, +h6, +h4 { + background-color: #dde4ff; + color: #27234c; + transition: 2s; } + h5 a, + h6 a, + h4 a { + color: #27234c; + background-color: transparent; } + +h4.light, +h5.light, +h6.light { + background-color: #27234c; + color: #dde4ff; + transition: 2s; } + +h2.light { + background-color: #007582; + color: #dde4ff; + transition: 2s; } + +article.light a { + background-color: transparent; color: #733c7c; - background-color: transparent; } + transition: 2s; } + article.light a.hash-link { + color: #dde4ff; } + article.light a.hash-link:hover { + background-color: transparent; + color: #dde4ff; } + +a:hover { + color: #27234c; + background-color: #d3d37c; + transition: 0.2s; } + +.previous.light:hover, +.next.light:hover, +.postdescription a.light:hover, +article.light a:hover { + color: #dde4ff; + background-color: #733c7c; + transition: 0.2s; } + +.light.hash-link:hover, +.hash-link:hover { + background-color: transparent; + transition: 2s; } + +h1a.light, +h2a.light, +h3a.light, +h4a.light, +h5a.light, +h6a.light { + background-color: transparent; + color: #dde4ff; } + h1a.light:hover, + h2a.light:hover, + h3a.light:hover, + h4a.light:hover, + h5a.light:hover, + h6a.light:hover { + background-color: transparent; } + +header.light { + background-color: #dde4ff; + transition: 2s; } + +header { + transition: 2s; } + +.posttitle a { + background-color: transparent; + color: #27234c; } + .posttitle a:hover { + background-color: transparent; } html, body { @@ -155,10 +211,16 @@ footer { #content p, #content ul, #content ol, -#content table { +#content table, +.postdescription, +hr { margin-right: 24%; margin-left: 24%; } +#content ol ol, +#content ul ul { + margin-left: 0.12em; } + #footer-left { margin-top: auto; margin-bottom: auto; @@ -210,9 +272,9 @@ h4, h5, h6 { padding-right: 6%; + margin-right: 6%; padding-top: 12pt; padding-bottom: 12pt; - margin-right: 6%; justify-content: right; display: flex; align-items: center; } @@ -228,7 +290,8 @@ h6 { article { margin-inline: auto; } -.titlecontainer { +.titlecontainer, +header { width: 100%; padding-top: 42pt; } @@ -247,14 +310,14 @@ article { h1 { font-size: 42pt; } -h2 { +h2 a { font-size: 42pt; font-style: bold; } -h3, h4 { +h3 a, h4 a { font-size: 32pt; } -h5 h6 { +h5 a, h6 a { font-size: 24pt; } a { @@ -271,8 +334,12 @@ label::after { h6 { font-style: italic; } +::before { + font-family: CaskaydiaCoveMono; } + * { - border-width: 2pt; } + border-width: 2pt; + transition: ease-in-out; } input[type="checkbox"] { cursor: pointer; } @@ -280,6 +347,7 @@ input[type="checkbox"] { .toggleinput { opacity: 0; max-height: 0; + max-width: 0; overflow: hidden; } .togglelabel { @@ -298,7 +366,7 @@ input[type="checkbox"] { width: 20pt; border-width: 1pt; border-radius: 100pt; - transition: 0.3s; + transition: 1s; display: inline-block; vertical-align: middle; text-align: center; @@ -325,10 +393,30 @@ input:checked + label::after { .togglelabel { border: solid; } -h1, h2, h3, h4, h5, h6 { +h1, +h2, +h3, +h4, +h5, +h6 { border-top-right-radius: 48pt; border-bottom-right-radius: 48pt; } + h1 .hash-link:hover, + h2 .hash-link:hover, + h3 .hash-link:hover, + h4 .hash-link:hover, + h5 .hash-link:hover, + h6 .hash-link:hover { + cursor: pointer; } + h1 .hash-link:hover::before, + h2 .hash-link:hover::before, + h3 .hash-link:hover::before, + h4 .hash-link:hover::before, + h5 .hash-link:hover::before, + h6 .hash-link:hover::before { + content: ""; } +.postdescription, #content p, #content ul, #content ol, diff --git a/themes/battheme b/themes/battheme index 76b758d..006d56f 160000 --- a/themes/battheme +++ b/themes/battheme @@ -1 +1 @@ -Subproject commit 76b758dcadedb8053991034a348a9063c975a793 +Subproject commit 006d56f862e085cf0fc921782d11ea14eef872be