CodeDevMLH/Jellyfin-Login-Page
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix mobile

Browse Source
This commit is contained in:
MLH
2024-12-07 03:38:24 +01:00
parent 7b4700758a
commit ac320a4ad2
1 changed files with 48 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
custom-login-css.css
View File

@ -14,10 +14,9 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
}
/* Hide Forgot Password */
/*
#loginPage .raised.cancel.block.btnForgotPassword.emby-button {
display: none;
} */
}
#loginPage .readOnlyContent {
padding: 0 !important;
@ -86,20 +85,24 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
padding-top: 20px;
}
@media screen and (max-width: 1165px) {
/*Logo verkleinern*/
@media (max-width: 1165px) {
#login-logo {
max-width: 100%;
height: auto;
}
}
@media screen and (max-width: 1050px) {
@media (max-width: 1050px) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 38vw;
height: 85vh;
max-width: 70%;
padding: 2em 2em 1em 2em !important;
height: 80dvh;
height: 75lvh;
height: 80vh;
max-height: 80%;
padding: 2em 2em 0em 2em !important;
border-radius: 20px;
}
@ -110,25 +113,44 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
/* Square Card */
#loginPage .squareCard {
width: 26%;
width: 24%;
}
/* Verkleinern der Schriftgröße und Anpassung für andere Elemente */
#loginPage .readOnlyContent {
width: 100%;
padding: 1em;
}
}
@media screen and (max-width: 860px) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 50vw;
height: 90vh;
max-width: 80%;
padding: 2em 2em 1em 2em !important;
border-radius: 18px;
/* Mobile Optimierungen für Tablet */
@media (max-width: 886px) {
@media (orientation: landscape) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 32vw;
max-width: 55%;
height: 90dvh;
height: 85lvh;
height: 90vh;
max-height: 90%;
padding: 2em 2em 0em 2em !important;
border-radius: 18px;
}
}
@media (orientation: portrait) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 50vw;
max-width: 75%;
height: 50dvh;
height: 45lvh;
height: 50vh;
max-height: 65%;
padding: 2em 2em 0em 2em !important;
border-radius: 18px;
}
}
/* Schriftgröße der Überschrift */
@ -138,24 +160,26 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
/* Square Card */
#loginPage .squareCard {
width: 28%;
width: 24%;
}
/* Verkleinern der Schriftgröße und Anpassung für andere Elemente */
#loginPage .readOnlyContent {
width: 100%;
padding: 1em;
}
}
/* Mobile Optimierungen */
@media screen and (max-width: 768px) {
/* Mobile Optimierungen für Smartphone*/
@media (max-width: 768px) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 80vw;
height: 90vh;
max-width: 90%;
padding: 2em 2em 1em 2em !important;
height: 90dvh;
height: 85lvh;
height: 90vh;
max-height: 90%;
padding: 2em 2em 0em 2em !important;
border-radius: 16px;
}
@ -166,12 +190,11 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
/* Square Card */
#loginPage .squareCard {
width: 30%;
width: 24%; /* 30% */
}
/* Verkleinern der Schriftgröße und Anpassung für andere Elemente */
#loginPage .readOnlyContent {
width: 100%;
padding: 1em;
}
}