boris/ElegantFin
1
0
Fork 0
mirror of https://github.com/lscambo13/ElegantFin.git synced 2025-09-18 12:40:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix: Responsive Design: Part 1

Browse Source 
Fixes to portrait cards
This commit is contained in:
lscambo13
2025-01-10 13:18:52 -08:00
parent f653d2a906
commit cb9ec0cc39
1 changed files with 49 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
Theme/ElegantFin-theme-nightly.css
View File

@@ -217,28 +217,70 @@ html {
max-width: 18em;
}
@media (min-width: 31.25em) {
/* @media (min-width: 31.25em) {
.portraitCard,
.smallBackdropCard,
.squareCard {
width: 30% !important;
}
} */
/* if the window width is equal to or more than (at minimum) 100em then the code in the query will trigger */
@media (min-width: 120em) {
.portraitCard,
.squareCard {
width: 10.4% !important;
}
}
@media (min-width: 43.75em) {
/* if the window width is equal to or less than (at maximum) 100em then the code in the query will trigger */
@media (max-width: 120em) {
.portraitCard,
.squareCard {
width: 13.2% !important;
}
}
@media (max-width: 100em) {
.portraitCard,
.squareCard {
width: 15.2% !important;
}
}
@media (max-width: 60em) {
.portraitCard,
.squareCard {
width: 17.7% !important;
}
}
/* @media (max-width: 50em) {
.portraitCard,
.squareCard {
width: 17.7% !important;
}
} */
/* @media (max-width: 43.75em) {
.portraitCard,
.squareCard {
width: 23% !important;
}
}
} */
@media (min-width: 50em) {
@media (max-width: 30em) {
.portraitCard,
.squareCard {
width: 23% !important;
width: 28.8% !important;
}
}
@@ -305,8 +347,8 @@ h1 {
.portraitCard {
min-width: 5em;
width: 29.5%;
max-width: 12.9em;
/* width: 29.5%; */
/* max-width: 12.9em; */
}
.headerHomeButton {