wip media query rework, sidebar mostly finished, rewritten njk

This commit is contained in:
sundae 2026-04-04 16:50:30 +03:00
commit 790147ea05
Signed by: sundae
SSH key fingerprint: SHA256:MsJkKuo4PUdjQDpLeaURy81drKkW14exlTHp+8QFu6M
33 changed files with 268 additions and 361 deletions

View file

@ -1,77 +1,3 @@
/* default.css */
@media screen and (max-width: 920px) {
body::after {
content: "" !important;
}
footer {
width: 100% !important;
margin: 0 !important;
}
header {
padding-left: 0 !important;
padding-top: var(--pad-m) !important;
text-align: center !important;
}
main {
padding: var(--pad-l) !important;
}
main > section {
flex-direction: column !important;
}
main > section {
width: initial !important;
}
article {
max-width: initial !important;
width: auto !important;
}
#mobile > nav {
display: flex !important;
}
}
/* nav.css */
@media screen and (min-width: 920px) {
li:has(> button[popovertarget="mobile"]) {
display: none !important;
}
#floating {
display: none;
}
#mobile {
display: flex;
}
}
@media screen and (max-width: 920px) {
#floating {
position: sticky !important;
top: 0 !important;
}
}
/* home.css */
@media screen and (max-width: 920px) {
article#interests {
display: flex !important;
flex-direction: column !important;
& ul {
justify-content: center !important;
}
& li a {
padding: 0 !important;
}
}
}
@media (prefers-reduced-motion: no-preference) {
/* Scrolling pride flag text */
article#bio span[id],
@ -90,23 +16,23 @@
}
@media (prefers-reduced-motion: reduce) {
body {
animation: none !important;
animation: none;
}
/* Buttons */
:is(a, button),
span:has(a) {
transition: none !important;
transition: none;
}
/* Permalinks */
.header-anchor,
article pre {
transition: none !important;
transition: none;
}
/* Images */
#gallery a:has(figure),
#blog article figure,
a img {
transition: none !important;
transition: none;
}
.emoji:has(img[alt*="🐇"]) {
& img {
@ -119,11 +45,11 @@
}
/* Scrolling pride flag text */
article#bio span[id], footer span {
transition: none !important;
animation: none !important;
transition: none;
animation: none;
color: inherit;
background-clip: initial !important;
background: initial !important;
background-clip: initial;
background: initial;
&::before {
content: "";
display: inline-flex;
@ -150,7 +76,7 @@
}
/* Jumping critters */
#pkmn span:hover {
animation: none !important;
animation: none;
transform: translateY(-4px);
}
}