1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

improve padding for headers and buttons on home screen

This commit is contained in:
dkanada 2019-12-12 00:32:33 +09:00
parent 4e683c4fca
commit bff5918c85
4 changed files with 17 additions and 18 deletions

View file

@ -627,7 +627,7 @@ button {
@media (min-width: 43.75em) { @media (min-width: 43.75em) {
.overflowSquareCard, .overflowPortraitCard { .overflowSquareCard, .overflowPortraitCard {
width: 23.3vw; width: 23.1vw;
} }
} }
@ -643,13 +643,13 @@ button {
} }
.overflowSquareCard, .overflowPortraitCard { .overflowSquareCard, .overflowPortraitCard {
width: 23.3vw; width: 23.1vw;
} }
} }
@media (orientation: landscape) and (min-width: 48.125em) { @media (orientation: landscape) and (min-width: 48.125em) {
.overflowBackdropCard, .overflowSmallBackdropCard { .overflowBackdropCard, .overflowSmallBackdropCard {
width: 23.3vw; width: 23.1vw;
} }
} }
@ -661,13 +661,13 @@ button {
@media (min-width: 50em) { @media (min-width: 50em) {
.overflowSquareCard, .overflowPortraitCard { .overflowSquareCard, .overflowPortraitCard {
width: 18.4vw; width: 18.5vw;
} }
} }
@media (min-width: 75em) { @media (min-width: 75em) {
.overflowBackdropCard, .overflowSmallBackdropCard { .overflowBackdropCard, .overflowSmallBackdropCard {
width: 23.3vw; width: 23.1vw;
} }
.overflowSquareCard, .overflowPortraitCard { .overflowSquareCard, .overflowPortraitCard {
@ -780,4 +780,4 @@ button {
.cardOverlayFab-primary:hover { .cardOverlayFab-primary:hover {
transform: scale(1.4, 1.4); transform: scale(1.4, 1.4);
transition: 0.2s; transition: 0.2s;
} }

View file

@ -6,6 +6,7 @@
justify-content: center; justify-content: center;
min-width:104px; min-width:104px;
min-height:24px; min-height:24px;
padding-top: 1.25em;
z-index: 1; z-index: 1;
color: #ffffff; color: #ffffff;
display: flex; display: flex;
@ -15,4 +16,4 @@
min-width: 24px; min-width: 24px;
min-height: 24px; min-height: 24px;
display: block; display: block;
} }

View file

@ -8,14 +8,9 @@
} }
/* align first card in scroller to heading */ /* align first card in scroller to heading */
.emby-scroller .card:first-of-type > .cardBox { .itemsContainer > .card > .cardBox {
margin-left: 0;
}
/* align heading for normal item containers */
/* still not ideal solution but better than the last method */
.verticalSection > .itemsContainer .cardBox {
margin-left: 0; margin-left: 0;
margin-right: 1.2em;
} }
@media all and (max-width:50em) { @media all and (max-width:50em) {
@ -25,4 +20,4 @@
margin-left: 0; margin-left: 0;
margin-right: 0; margin-right: 0;
} }
} }

View file

@ -892,12 +892,15 @@
vertical-align: middle; vertical-align: middle;
} }
/* these next two rules are for the scroller element headers */
.sectionTitleContainer-cards { .sectionTitleContainer-cards {
margin-bottom: 0; margin: 0;
padding-top: 1.25em;
} }
.sectionTitle-cards { div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
margin-bottom: 0; margin: 0;
padding-top: 1.25em;
} }
.sectionTitleButton { .sectionTitleButton {