MaximilianGT500/scyfin
1
0
Fork 0
mirror of https://github.com/loof2736/scyfin.git synced 2025-11-04 08:28:52 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixed poster scaling on small-width layouts

Browse Source
This commit is contained in:
loof2736 2024-06-07 18:21:19 -04:00
parent 2564564778
commit 9c5c65b1c9
2 changed files with 25 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
CSS/scyfin-theme-backdrop.css
View File

@ -2,7 +2,7 @@
:root { :root {
--main-accent-color: #00a4dc; --main-accent-color: #00a4dc;
--secondary-accent-color: #00a4dc20; --secondary-accent-color: #00a4dc20;
--main-background-color: #0F0F0F; --main-background-color: #101010;
--secondary-background-color: #181818; --secondary-background-color: #181818;
--main-background-transparent: rgba(35,35,35,0.5); --main-background-transparent: rgba(35,35,35,0.5);
--secondary-background-transparent: rgba(0,0,0,0.6); --secondary-background-transparent: rgba(0,0,0,0.6);
@ -515,7 +515,7 @@
/* Resize show/movie image on details page */ /* Resize show/movie image on details page */
.layout-desktop .detailImageContainer .card { .layout-desktop .detailImageContainer .card {
top: 9em !important; top: 9em !important;
width: 350px !important; width: 18.3vw !important;
} }
/* Re-position content on details page */ /* Re-position content on details page */
@ -531,7 +531,7 @@
.layout-tv .detailLogo { .layout-tv .detailLogo {
right: 0 !important; right: 0 !important;
left: 4% !important; left: 4% !important;
top: 14vh !important; top: 10% !important;
} }
/* Transparent ribbon bar */ /* Transparent ribbon bar */
@ -613,7 +613,7 @@
/* Re-position title */ /* Re-position title */
.layout-desktop .infoWrapper { .layout-desktop .infoWrapper {
margin-top: 245px !important; margin-top: 245px !important;
margin-left: 390px !important; margin-left: 20.4vw !important;
} }
.layout-desktop .detailPagePrimaryContainer { .layout-desktop .detailPagePrimaryContainer {
padding-left: 3.3% !important; padding-left: 3.3% !important;
@ -630,8 +630,8 @@
/* Move description box */ /* Move description box */
.layout-desktop .detailPagePrimaryContent { .layout-desktop .detailPagePrimaryContent {
padding-left: 390px !important; padding-left: 20.4vw !important;
min-height: 550px !important; min-height: 29vw !important;
} }
/* Move track selection box */ /* Move track selection box */
@ -788,6 +788,17 @@
top: -2px !important; top: -2px !important;
} }
} }
@media (max-width: 85em) {
.layout-desktop .detailLogo, .layout-tv .detailLogo {
top: 6% !important;
}
}
@media (max-width: 68.75em) {
.layout-desktop .mainDetailButtons {
position: absolute !important;
left: 140px !important;
}
}

15
CSS/scyfin-theme.css
View File

@ -2,7 +2,7 @@
:root { :root {
--main-accent-color: #00a4dc; --main-accent-color: #00a4dc;
--secondary-accent-color: #00a4dc20; --secondary-accent-color: #00a4dc20;
--main-background-color: #0F0F0F; --main-background-color: #101010;
--secondary-background-color: #181818; --secondary-background-color: #181818;
--main-background-transparent: rgba(35,35,35,0.5); --main-background-transparent: rgba(35,35,35,0.5);
--secondary-background-transparent: rgba(0,0,0,0.6); --secondary-background-transparent: rgba(0,0,0,0.6);
@ -247,7 +247,8 @@
} }
/* Modified background color */ /* Modified background color */
html { html,
.backgroundContainer {
background-color: var(--main-background-color) !important; background-color: var(--main-background-color) !important;
} }
@ -518,7 +519,7 @@ html {
/* Resize show/movie image on details page */ /* Resize show/movie image on details page */
.layout-desktop .detailImageContainer .card { .layout-desktop .detailImageContainer .card {
top: 9em !important; top: 9em !important;
width: 350px !important; width: 18.3vw !important;
} }
/* Re-position content on details page */ /* Re-position content on details page */
@ -534,7 +535,7 @@ html {
.layout-tv .detailLogo { .layout-tv .detailLogo {
right: 0 !important; right: 0 !important;
left: 4% !important; left: 4% !important;
top: 14vh !important; top: 10% !important;
} }
/* Transparent ribbon bar */ /* Transparent ribbon bar */
@ -603,7 +604,7 @@ html {
/* Re-position title */ /* Re-position title */
.layout-desktop .infoWrapper { .layout-desktop .infoWrapper {
margin-top: 245px !important; margin-top: 245px !important;
margin-left: 390px !important; margin-left: 20.4vw !important;
} }
.layout-desktop .detailPagePrimaryContainer { .layout-desktop .detailPagePrimaryContainer {
padding-left: 3.3% !important; padding-left: 3.3% !important;
@ -620,8 +621,8 @@ html {
/* Move description box */ /* Move description box */
.layout-desktop .detailPagePrimaryContent { .layout-desktop .detailPagePrimaryContent {
padding-left: 390px !important; padding-left: 20.4vw !important;
min-height: 550px !important; min-height: 29vw !important;
} }
/* Move track selection box */ /* Move track selection box */