mirror of
https://github.com/loof2736/scyfin.git
synced 2025-11-03 16:08:53 +01:00
Re-factored code for top-left item background to be more dynamic
This commit is contained in:
parent
30cf0b7b53
commit
039873f396
@ -71,29 +71,28 @@
|
||||
margin-right: 3.3% !important;
|
||||
}
|
||||
|
||||
/* Background for home, hamburger, and Jellyfin */
|
||||
.layout-desktop:not(.transparentDocument) .headerLeft::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 39px;
|
||||
left: 10px;
|
||||
width: 245px;
|
||||
height: 45px;
|
||||
/* Background for top left buttons */
|
||||
.layout-desktop .headerLeft {
|
||||
padding: 2px 15px 2px 2px !important;
|
||||
top: -3px !important;
|
||||
background-color: rgba(35, 35, 35, 0.5) !important;
|
||||
border-radius: 50px !important;
|
||||
backdrop-filter: blur(50px) !important;
|
||||
}
|
||||
.headerLeft {
|
||||
flex-grow: 0 !important;
|
||||
-webkit-flex-grow: 0 !important;
|
||||
}
|
||||
.headerRight {
|
||||
position: absolute !important;
|
||||
right: 12px !important;
|
||||
}
|
||||
|
||||
/* Reduce the size of the header when the logo is not present */
|
||||
.layout-desktop .skinHeader.semiTransparent .headerTop .headerLeft::before {
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.layout-desktop .headerLeft {
|
||||
padding: 2px !important;
|
||||
top: -3px !important;
|
||||
}
|
||||
|
||||
.layout-desktop .pageTitle {
|
||||
z-index: 1099 !important;
|
||||
}
|
||||
|
||||
@ -65,29 +65,28 @@
|
||||
margin-right: 3.3% !important;
|
||||
}
|
||||
|
||||
/* Background for home, hamburger, and Jellyfin */
|
||||
.layout-desktop:not(.transparentDocument) .headerLeft::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 39px;
|
||||
left: 10px;
|
||||
width: 245px;
|
||||
height: 45px;
|
||||
/* Background for top left buttons */
|
||||
.layout-desktop .headerLeft {
|
||||
padding: 2px 15px 2px 2px !important;
|
||||
top: -3px !important;
|
||||
background-color: rgba(35, 35, 35, 0.5) !important;
|
||||
border-radius: 50px !important;
|
||||
backdrop-filter: blur(50px) !important;
|
||||
}
|
||||
.headerLeft {
|
||||
flex-grow: 0 !important;
|
||||
-webkit-flex-grow: 0 !important;
|
||||
}
|
||||
.headerRight {
|
||||
position: absolute !important;
|
||||
right: 12px !important;
|
||||
}
|
||||
|
||||
/* Reduce the size of the header when the logo is not present */
|
||||
.layout-desktop .skinHeader.semiTransparent .headerTop .headerLeft::before {
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.layout-desktop .headerLeft {
|
||||
padding: 2px !important;
|
||||
top: -3px !important;
|
||||
}
|
||||
|
||||
.layout-desktop .pageTitle {
|
||||
z-index: 1099 !important;
|
||||
}
|
||||
|
||||
@ -1,9 +1,7 @@
|
||||
/* Increase size of Jellyfin logo */
|
||||
.layout-desktop .pageTitleWithLogo {
|
||||
margin-left: 15px !important;
|
||||
width: 100px !important;
|
||||
height: 40px !important;
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
|
||||
/* Static left drawer */
|
||||
|
||||
@ -1,9 +1,7 @@
|
||||
/* Increase size of Jellyfin logo */
|
||||
.layout-desktop .pageTitleWithLogo {
|
||||
margin-left: 15px !important;
|
||||
width: 100px !important;
|
||||
height: 40px !important;
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
|
||||
/* Static left drawer */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user