mirror of
https://forgejo.ellis.link/continuwuation/continuwuity.git
synced 2025-06-26 17:46:36 +02:00
feat: Deal with low screen widths in CSS
This commit is contained in:
parent
9b8b37f162
commit
5bae8b4f6c
1 changed files with 64 additions and 47 deletions
|
@ -47,7 +47,7 @@ html {
|
|||
}
|
||||
|
||||
.panel {
|
||||
width: min(clamp(24rem, 12rem + 40vw, 48rem), 100vw);
|
||||
width: min(clamp(24rem, 12rem + 40vw, 48rem), calc(100vw - 3rem));
|
||||
border-radius: 15px;
|
||||
background-color: var(--panel-bg);
|
||||
padding-inline: 1.5rem;
|
||||
|
@ -55,6 +55,23 @@ html {
|
|||
box-shadow: 0 0.25em 0.375em hsla(0, 0%, 0%, 0.1);
|
||||
}
|
||||
|
||||
@media (max-width: 24rem) {
|
||||
.panel {
|
||||
padding-inline: 0.25rem;
|
||||
width: calc(100vw - 0.5rem);
|
||||
border-radius: 0;
|
||||
margin-block-start: 0.2rem;
|
||||
}
|
||||
main {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
padding-inline: 0.25rem;
|
||||
height: max(fit-content, 2rem);
|
||||
}
|
||||
|
||||
.project-name {
|
||||
text-decoration: none;
|
||||
background: linear-gradient(
|
||||
|
|
Loading…
Add table
Reference in a new issue