187 lines
4 KiB
CSS
187 lines
4 KiB
CSS
/* Layout */
|
|
|
|
body > .page,
|
|
body > .view {
|
|
margin-top: var(--header-height) !important;
|
|
}
|
|
|
|
|
|
body > .view .emby-scroller > .scrollSlider.padded-top-page,
|
|
body > .view.emby-scroller > .scrollSlider.padded-top-page {
|
|
padding-top: 0.8rem !important;
|
|
}
|
|
|
|
|
|
@media all and (min-width: 60em) {
|
|
|
|
html.withFullDrawer .backdropContainer, html.withFullDrawer .backgroundContainer {
|
|
margin-inline-start: 33.15ch;
|
|
margin-inline-start: clamp(33.15ch, 30%, 45.5ch);
|
|
}
|
|
|
|
|
|
@media all and (pointer: fine) {
|
|
|
|
|
|
html.withFullDrawer .backdropContainer, html.withFullDrawer .backgroundContainer {
|
|
margin-inline-start: 30ch !important;
|
|
margin-inline-start: calc(30ch + env(safe-area-inset-left, 0)) !important;
|
|
}
|
|
|
|
html.withFullDrawer.rtl:root .backdropContainer, body:has(.mainDrawer.mainDrawer-mini) .backgroundContainer {
|
|
margin-inline-start: calc(30ch + env(safe-area-inset-right, 0));
|
|
}
|
|
}
|
|
|
|
body:has(.mainDrawer.mainDrawer-mini) .backdropContainer, body:has(.mainDrawer.mainDrawer-mini) .backgroundContainer {
|
|
margin-inline-start: 10ch;
|
|
}
|
|
}
|
|
|
|
@media all and (min-width: 60em) {
|
|
|
|
.page-withDockedDrawer .padded-left {
|
|
padding-inline-start: 2.7rem;
|
|
}
|
|
|
|
.page-withDockedDrawer .padded-right {
|
|
padding-inline-end: 2.7rem;
|
|
}
|
|
}
|
|
|
|
@media all and (min-width: 90em) {
|
|
|
|
.page-withDockedDrawer .padded-left {
|
|
padding-inline-start: 3rem;
|
|
}
|
|
|
|
.page-withDockedDrawer .padded-right {
|
|
padding-inline-end: 3rem;
|
|
}
|
|
}
|
|
|
|
@media all and (min-width: 60em) {
|
|
|
|
.page-withDockedDrawer .padded-right-withalphapicker {
|
|
padding-inline-end: 3rem;
|
|
}
|
|
|
|
.page-withDockedDrawer .padded-right-withlist.padded-right-withalphapicker {
|
|
padding-inline-end: 3rem;
|
|
}
|
|
}
|
|
|
|
|
|
body > .view.margin-top-page-listheader {
|
|
clip-path: margin-box !important;
|
|
margin-top: 14.3em !important;
|
|
margin-top: calc(var(--header-height) + 8.7em) !important;
|
|
}
|
|
|
|
.margin-top-page-listheader:not(:has(.alphaPicker:not(.hide))) .itemsContainer_header_fixed {
|
|
margin-inline-end: 5px !important;
|
|
}
|
|
|
|
.margin-top-page-listheader:not(.view) {
|
|
margin-top: 6em !important;
|
|
}
|
|
|
|
|
|
.itemsTab .itemsViewSettingsContainer-fixed {
|
|
top: -1.2em;
|
|
}
|
|
|
|
.itemsTab .itemsContainer_header_fixed {
|
|
top: 3em;
|
|
}
|
|
|
|
body.settings-view-active .page-withDockedDrawer .padded-right {
|
|
padding-inline-end: 2.0rem;
|
|
}
|
|
|
|
form, .readOnlyContent {
|
|
max-width: 120ch;
|
|
}
|
|
|
|
.headerMiddle {
|
|
overflow: hidden;
|
|
flex-grow: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: start;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.headerMiddle-withSectionTabs:not(.headerMiddle-tv) {
|
|
margin-top: 0;
|
|
/* overflow: visible;
|
|
*/
|
|
}
|
|
|
|
.headerLeft, .headerRight, .headerMiddle {
|
|
height: 3.4em;
|
|
}
|
|
|
|
@media not all and (min-width: 66em) {
|
|
.headerMiddle-withSectionTabs:not(.headerMiddle-tv) {
|
|
height: 3.4em;
|
|
}
|
|
}
|
|
|
|
|
|
.headerRight {
|
|
padding-inline-end: 0;
|
|
}
|
|
|
|
.headerLeft .headerMenuButton {
|
|
order: -1;
|
|
}
|
|
|
|
.skinHeader.videoOsdHeader {
|
|
right: 1.08em;
|
|
inset-inline-start: 0;
|
|
inset-inline-end: 1.08em;
|
|
}
|
|
|
|
|
|
.paper-icon-button-light.md-icon.headerSettingsButton {
|
|
font-weight: 300;
|
|
font-size: 190% !important;
|
|
padding: .233em;
|
|
font-variation-settings: "GRAD" -50;
|
|
/* font-variation-settings: "OPSZ" 40; */
|
|
}
|
|
|
|
.verticalSection.verticalSection-cards.aboutSection {
|
|
font-size: 100% !important;
|
|
}
|
|
|
|
/* .headerFullScreenButton, .headerExitButton {
|
|
display: none;
|
|
}
|
|
|
|
|
|
html.isFullScreen .headerFullScreenButton, html.isFullScreen .headerExitButton {
|
|
display: block;
|
|
}
|
|
*/
|
|
.topDetailsMain-graphic {
|
|
text-shadow: none !important;
|
|
}
|
|
|
|
|
|
.infoBanner {
|
|
padding: 0.5rem 1rem;
|
|
border-radius: .3rem;
|
|
box-shadow: none;
|
|
border: solid 1px var(--line-background);
|
|
}
|
|
|
|
/* Need a better spot for this. used by directory picker and other areas */
|
|
.warningBanner {
|
|
padding: 0.5rem 1rem;
|
|
border-radius: .3rem;
|
|
box-shadow: none;
|
|
border: solid 1px var(--line-background);
|
|
font-weight: 500;
|
|
}
|