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

Rework mobile details page

This commit is contained in:
MrTimscampi 2020-05-08 19:50:56 +02:00
parent d3d4c116a4
commit 617708009e
3 changed files with 28 additions and 11 deletions

View file

@ -24,10 +24,6 @@
padding-top: 7em !important; padding-top: 7em !important;
} }
.layout-mobile .libraryPage {
padding-top: 4em !important;
}
.itemDetailPage { .itemDetailPage {
padding-top: 0 !important; padding-top: 0 !important;
} }
@ -444,6 +440,7 @@
.layout-mobile .itemBackdrop { .layout-mobile .itemBackdrop {
background-attachment: scroll; background-attachment: scroll;
height: 26.5vh;
} }
.layout-desktop .itemBackdrop::after, .layout-desktop .itemBackdrop::after,
@ -467,6 +464,11 @@
padding-right: 2%; padding-right: 2%;
} }
.layout-mobile .detailPageContent {
padding-left: 5%;
padding-right: 5%;
}
.layout-desktop .detailPageContent .emby-scroller, .layout-desktop .detailPageContent .emby-scroller,
.layout-tv .detailPageContent .emby-scroller { .layout-tv .detailPageContent .emby-scroller {
margin-left: 0; margin-left: 0;
@ -551,6 +553,11 @@
text-align: center; text-align: center;
} }
.layout-mobile .mainDetailButtons {
margin-top: 2em;
margin-bottom: 0.5em;
}
.detailPagePrimaryContainer { .detailPagePrimaryContainer {
display: flex; display: flex;
align-items: center; align-items: center;
@ -561,7 +568,7 @@
.layout-mobile .detailPagePrimaryContainer { .layout-mobile .detailPagePrimaryContainer {
display: block; display: block;
position: relative; position: relative;
top: 0; padding: 2.5em 3.3% 1em;
} }
.layout-tv #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer, .layout-tv #itemDetailPage:not(.noBackdrop) .detailPagePrimaryContainer,
@ -694,12 +701,12 @@ div.itemDetailGalleryLink.defaultCardBackground {
.emby-button.detailFloatingButton { .emby-button.detailFloatingButton {
position: absolute; position: absolute;
background-color: rgba(0, 0, 0, 0.5) !important; background-color: rgba(0, 0, 0, 0.5);
z-index: 1; z-index: 3;
top: 50%; top: 100%;
left: 50%; left: 90%;
margin: -2.2em 0 0 -2.2em; margin: -2.2em 0 0 -2.2em;
padding: 0.4em !important; padding: 0.4em;
color: rgba(255, 255, 255, 0.76); color: rgba(255, 255, 255, 0.76);
} }
@ -1150,6 +1157,11 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
margin: 0 0.2em 0 0; margin: 0 0.2em 0 0;
} }
.layout-mobile .detailsGroupItem .label,
.layout-mobile .trackSelections .selectContainer .selectLabel {
flex-basis: 4.5em;
}
.trackSelections .selectContainer .detailTrackSelect { .trackSelections .selectContainer .detailTrackSelect {
font-size: inherit; font-size: inherit;
padding: 0; padding: 0;

View file

@ -1968,7 +1968,7 @@ define(['loading', 'appRouter', 'layoutManager', 'connectionManager', 'userSetti
}); });
} }
playItem(item, item.UserData && 'resume' === mode ? item.UserData.PlaybackPositionTicks : 0); playItem(item, item.UserData && mode === 'resume' ? item.UserData.PlaybackPositionTicks : 0);
} }
function onPlayClick() { function onPlayClick() {

View file

@ -453,3 +453,8 @@ html {
.metadataSidebarIcon { .metadataSidebarIcon {
color: #00a4dc; color: #00a4dc;
} }
.emby-button.detailFloatingButton {
background-color: #00a4dc;
color: #fff;
}