sundae/website
sundae/website
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

mobile view fix

Browse source
This commit is contained in:
sundae 2025-08-10 18:07:17 +03:00
parent f20b697aed
commit bc8100b101
No known key found for this signature in database
2 changed files with 35 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

30
_src/assets/css/citrus/citrus.css
View file

@ -1,7 +1,11 @@
@import url("./variables.css");
@import url("../default/variables.css");
@import url("./nav.css");
#bio, #interests, #badges, #artworks, #art {
#bio,
#interests,
#badges,
#artworks,
#art {
font-family: "Pangolin", sans-serif;
}
body {
@ -50,7 +54,12 @@ body > nav {
}
}
& details {
background-image: linear-gradient(-45deg, var(--citrus-primary), var(--citrus-secondary), var(--citrus-primary));
background-image: linear-gradient(
-45deg,
var(--citrus-primary),
var(--citrus-secondary),
var(--citrus-primary)
);
}
}
article {
@ -62,7 +71,7 @@ article {
& .header-anchor {
border-radius: inherit;
background-color: color-mix(in lch, magenta, white);
&:is(:hover,:focus) {
&:is(:hover, :focus) {
background-color: magenta;
}
}
@ -81,7 +90,7 @@ article {
box-shadow: var(--shadow);
background: color-mix(in lch, yellow, white);
&:nth-child(odd) {
transform: rotate(1deg)
transform: rotate(1deg);
}
}
ul:not([role]) li::before {
@ -199,13 +208,12 @@ a:has(img[src*="/assets/img/button"]):is(:hover, :focus) img {
&::before {
content: "";
display: flex;
height: 100%;
height: 32px;
width: calc(100% + var(--pad-xl) * 2);
margin: -4rem 0 0 calc(var(--pad-xl) * -1);
margin: -4rem 0 var(--pad-l) calc(var(--pad-xl) * -1);
background-image: var(--border), var(--lined);
background-size: 32px, 32px;
background-blend-mode: darken;
padding: var(--pad-xl);
}
}
}
@ -232,3 +240,11 @@ a:has(img[src*="/assets/img/button"]):is(:hover, :focus) img {
content: none;
}
}
@media screen and (max-width: 450px) {
#artworks & article {
&::before {
width: calc(100% + var(--pad-l) * 2) !important;
margin: -3rem 0 0 -16px;
}
}
}

31
_src/assets/css/default/default.css
View file

@ -48,7 +48,8 @@ h3 {
border-radius: 0 var(--round) var(--round) 0;
}
main article[id] {
& p, li {
& p,
li {
font-size: 1.2rem;
}
}
@ -170,20 +171,19 @@ a:has(img[src*="/assets/img/button"]):is(:hover, :focus) img {
}
@media screen and (max-width: 920px) {
body>nav {
main {
padding: var(--pad-l);
}
body > nav {
position: initial;
width: 100%;
}
main {
padding: var(--pad-l);
}
main>section {
main > section {
flex-direction: column;
}
main>section {
main > section {
width: initial;
}
@ -192,11 +192,11 @@ a:has(img[src*="/assets/img/button"]):is(:hover, :focus) img {
width: auto;
}
body>nav::before {
body > nav::before {
content: none;
}
body>nav {
body > nav {
flex-direction: row;
border: 0;
width: 100%;
@ -213,16 +213,7 @@ a:has(img[src*="/assets/img/button"]):is(:hover, :focus) img {
}
@media screen and (max-width: 450px) {
main {
padding: var(--pad-sm);
}
article {
padding: var(--pad-l);
border: 0;
}
body>nav {
body > nav {
flex-direction: column;
justify-content: start;