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

logo always dynamicialy

Browse Source
This commit is contained in:
MLH
2024-12-07 03:44:04 +01:00
parent ac320a4ad2
commit 073b703427
1 changed files with 61 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
custom-login-css.css
View File

@ -18,32 +18,32 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
display: none;
}
#loginPage .readOnlyContent {
#loginPage .readOnlyContent {
padding: 0 !important;
width: 90% !important;
}
}
#loginPage .padded-left.padded-right.padded-bottom-page {
background: #000000bf;
backdrop-filter: blur(3px);
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
margin: 0;
position: absolute;
border-radius: 24px;
width: 30vw;
height: 74vh;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: flex-start;
align-items: center;
padding: 3em 3em 1em 3em !important;
max-width: 28em;
max-height: 55em;
overflow-y: auto;
background: #000000bf;
backdrop-filter: blur(3px);
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
margin: 0;
position: absolute;
border-radius: 24px;
width: 30vw;
height: 74vh;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: flex-start;
align-items: center;
padding: 3em 3em 1em 3em !important;
max-width: 28em;
max-height: 55em;
overflow-y: auto;
}
#loginPage .squareCard {
@ -51,15 +51,15 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
}
.cardText {
overflow: hidden;
padding: .06em .0em;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
padding: .06em .0em;
text-overflow: ellipsis;
white-space: nowrap;
}
.manualLoginForm {
height: 100%;
width: 90%;
height: 100%;
width: 90%;
}
/* Hintergrund */
@ -86,14 +86,13 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
}
/*Logo verkleinern*/
@media (max-width: 1165px) {
#login-logo {
max-width: 100%;
height: auto;
}
#login-logo {
max-width: 100%;
height: auto;
}
@media (max-width: 1050px) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 38vw;
@ -125,32 +124,34 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
/* 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;
}
/* 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;
}
/* 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 */
@ -171,6 +172,7 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
/* Mobile Optimierungen für Smartphone*/
@media (max-width: 768px) {
/* Login-Container */
#loginPage .padded-left.padded-right.padded-bottom-page {
width: 80vw;
@ -190,7 +192,8 @@ body:not(:has(#loginPage:not(.hide))) .skinHeader {
/* Square Card */
#loginPage .squareCard {
width: 24%; /* 30% */
width: 24%;
/* 30% */
}
/* Verkleinern der Schriftgröße und Anpassung für andere Elemente */