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

fix detail images

This commit is contained in:
Luke Pulverenti 2016-07-30 19:23:57 -04:00
parent 7beb5026ec
commit f9089f44cc
4 changed files with 34 additions and 42 deletions

View file

@ -6,7 +6,6 @@
padding: 0;
display: block;
color: inherit !important;
box-shadow: none !important;
outline: none !important;
cursor: pointer;
contain: style;
@ -75,7 +74,6 @@ button.card {
padding: 0 !important;
margin: 0;
transition: none !important;
border-radius: 0 !important;
border: 3px solid transparent;
/* Needed to keep the cardOverlayTarget from showing outside the bounds while it animates */
overflow: hidden;
@ -174,6 +172,10 @@ button.cardContent {
bottom: 0;
}
.round .cardContent {
overflow: visible;
}
.scalableCard .cardImageContainer {
height: 100%;
}
@ -199,18 +201,20 @@ button.cardContent {
opacity: .6;
}
.visualCardBox .cardScalable {
background-color: #222326;
}
.visualCardBox .cardFooter {
/*.visualCardBox {
-moz-box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-ms-box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.1);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}*/
.visualCardBox .cardScalable, .visualCardBox .cardFooter {
background-color: #222326;
}
.visualCardBox .cardFooter {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
background-color: #222326;
}
.innerCardFooter {
@ -267,8 +271,6 @@ button.cardContent {
height: 12vh;
font-size: 12vh;
color: #fff;
position: relative;
top: -8%;
}
.card .indicators {

View file

@ -584,18 +584,12 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
.detailImageProgressContainer {
position: absolute;
bottom: 2px;
right: 0;
left: 0;
bottom: 4px;
right: 1px;
left: 1px;
text-align: center;
}
.detailImageProgressContainer progress {
width: 100%;
margin: 0 auto;
height: 6px;
}
.viewControls, .listTopPaging {
display: inline-block;
}
@ -1062,3 +1056,19 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
vertical-align: top;
margin: 0 4px 0 0;
}
@media all and (min-width: 1000px) {
.itemDetailPage .scalableCard.portraitCard {
width: 25% !important;
}
.itemDetailPage .scalableCard.squareCard {
width: 25% !important;
}
.itemDetailPage .scalableCard.backdropCard, .itemDetailPage .scalableCard.smallBackdropCard {
width: 33.3333333333333333% !important;
}
}

View file

@ -1,4 +1,4 @@
define(['layoutManager', 'cardBuilder', 'datetime', 'mediaInfo', 'backdrop', 'listView', 'itemContextMenu', 'itemHelper', 'userdataButtons', 'dom', 'scrollStyles', 'emby-itemscontainer'], function (layoutManager, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, userdataButtons, dom) {
define(['layoutManager', 'cardBuilder', 'datetime', 'mediaInfo', 'backdrop', 'listView', 'itemContextMenu', 'itemHelper', 'userdataButtons', 'dom', 'indicators', 'scrollStyles', 'emby-itemscontainer'], function (layoutManager, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, userdataButtons, dom, indicators) {
var currentItem;
@ -329,11 +329,9 @@
function refreshDetailImageUserData(elem, item) {
var progressHtml = item.IsFolder || !item.UserData ? '' : LibraryBrowser.getItemProgressBarHtml((item.Type == 'Recording' ? item : item.UserData));
var detailImageProgressContainer = elem.querySelector('.detailImageProgressContainer');
detailImageProgressContainer.innerHTML = progressHtml || '';
detailImageProgressContainer.innerHTML = indicators.getProgressBarHtml(item);
}
function refreshImage(page, item, user) {

View file

@ -891,24 +891,6 @@
});
},
getItemProgressBarHtml: function (item) {
if (item.Type == "Recording" && item.CompletionPercentage) {
return '<progress class="itemProgressBar recordingProgressBar" min="0" max="100" value="' + item.CompletionPercentage + '"></progress>';
}
var pct = item.PlayedPercentage;
if (pct && pct < 100) {
return '<progress class="itemProgressBar" min="0" max="100" value="' + pct + '"></progress>';
}
return null;
},
renderDetailImage: function (elem, item, editable, preferThumb) {
var imageTags = item.ImageTags || {};
@ -1025,7 +1007,7 @@
html += "</a>";
}
var progressHtml = item.IsFolder || !item.UserData ? '' : LibraryBrowser.getItemProgressBarHtml((item.Type == 'Recording' ? item : item.UserData));
var progressHtml = item.IsFolder || !item.UserData ? '' : indicators.getProgressBarHtml(item);
html += '<div class="detailImageProgressContainer">';
if (progressHtml) {