mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fix web project
This commit is contained in:
parent
911880340e
commit
4ad1f56376
5 changed files with 39 additions and 35 deletions
|
@ -135,7 +135,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.detailButtonsContainer {
|
.detailButtonsContainer {
|
||||||
padding: 0 0 .5em;
|
padding: 0 0 1em;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -370,7 +370,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-position: center 15%;
|
background-position: center 15%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
height: 500px;
|
height: 550px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -421,10 +421,15 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
|
|
||||||
.detailImageContainer {
|
.detailImageContainer {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
top: -66px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.detailImageContainer {
|
.portraitDetailImageContainer {
|
||||||
top: -66px;
|
top: -26px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.thumbDetailImageContainer {
|
||||||
|
top: -26px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.itemDetailImage {
|
.itemDetailImage {
|
||||||
|
@ -434,19 +439,19 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
border: solid 1px #222;
|
border: solid 1px #222;
|
||||||
}
|
}
|
||||||
|
|
||||||
.thumbDetailImage {
|
.thumbDetailImageContainer img {
|
||||||
max-width: 360px;
|
max-width: 360px;
|
||||||
max-height: 360px;
|
max-height: 360px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.squareDetailImage {
|
.squareDetailImageContainer img {
|
||||||
max-width: 240px;
|
max-width: 240px;
|
||||||
max-height: 240px;
|
max-height: 240px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.portraitDetailImage {
|
.portraitDetailImageContainer img {
|
||||||
max-width: 240px;
|
max-width: 240px;
|
||||||
max-height: 360px;
|
max-height: 300px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.itemDetailGalleryLink img:hover {
|
.itemDetailGalleryLink img:hover {
|
||||||
|
@ -464,7 +469,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
}
|
}
|
||||||
|
|
||||||
.detailContentEffectedByPortraitImage {
|
.detailContentEffectedByPortraitImage {
|
||||||
margin-left: 260px;
|
margin-left: 220px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.detailContentEffectedByImage a {
|
.detailContentEffectedByImage a {
|
||||||
|
@ -479,7 +484,7 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
}
|
}
|
||||||
|
|
||||||
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
|
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
|
||||||
min-height: 140px;
|
min-height: 115px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.parentName {
|
.parentName {
|
||||||
|
@ -499,20 +504,20 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
margin-left: 20px;
|
margin-left: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.thumbDetailImage {
|
.thumbDetailImageContainer img {
|
||||||
max-width: 340px;
|
max-width: 340px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.squareDetailImage {
|
.squareDetailImageContainer img {
|
||||||
max-width: 220px;
|
max-width: 220px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.portraitDetailImage {
|
.portraitDetailImageContainer img {
|
||||||
max-width: 220px;
|
max-width: 220px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
|
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
|
||||||
min-height: 110px;
|
min-height: 85px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -532,6 +537,9 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
||||||
padding: 0 1em;
|
padding: 0 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.lastDetailContentEffectedByImage.detailContentEffectedByPortraitImage {
|
||||||
|
min-height: initial;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.parentName {
|
.parentName {
|
||||||
|
|
|
@ -140,8 +140,8 @@
|
||||||
<p id="itemLinks"></p>
|
<p id="itemLinks"></p>
|
||||||
<div class="detailButtonsContainer desktopDetailButtons" style="text-align: left;">
|
<div class="detailButtonsContainer desktopDetailButtons" style="text-align: left;">
|
||||||
<button class="btnPlay hide" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button>
|
<button class="btnPlay hide" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button>
|
||||||
<button class="btnMoreCommands hide" type="button" data-icon="ellipsis-v" data-inline="true" data-mini="true">${ButtonOptions}</button>
|
|
||||||
<a class="btnSync hide" data-role="button" data-icon="cloud" data-inline="true" data-mini="true" href="#">${ButtonSync}</a>
|
<a class="btnSync hide" data-role="button" data-icon="cloud" data-inline="true" data-mini="true" href="#">${ButtonSync}</a>
|
||||||
|
<button class="btnMoreCommands hide" type="button" data-icon="ellipsis-v" data-inline="true" data-mini="true">${ButtonMore}</button>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
@ -149,8 +149,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="detailButtonsContainer mobileDetailButtons">
|
<div class="detailButtonsContainer mobileDetailButtons">
|
||||||
<button class="btnPlay hide" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button>
|
<button class="btnPlay hide" type="button" data-icon="play" data-inline="true" data-mini="true">${ButtonPlay}</button>
|
||||||
<button class="btnMoreCommands hide" type="button" data-icon="ellipsis-v" data-inline="true" data-mini="true">${ButtonOptions}</button>
|
|
||||||
<a class="btnSync hide" data-role="button" data-icon="cloud" data-inline="true" data-mini="true" href="#">${ButtonSync}</a>
|
<a class="btnSync hide" data-role="button" data-icon="cloud" data-inline="true" data-mini="true" href="#">${ButtonSync}</a>
|
||||||
|
<button class="btnMoreCommands hide" type="button" data-icon="ellipsis-v" data-inline="true" data-mini="true">${ButtonMore}</button>
|
||||||
</div>
|
</div>
|
||||||
<p class="itemOverview mobileOverview"></p>
|
<p class="itemOverview mobileOverview"></p>
|
||||||
<div data-role="content" style="padding-top: 0;">
|
<div data-role="content" style="padding-top: 0;">
|
||||||
|
|
|
@ -13,12 +13,12 @@
|
||||||
<a href="livetvtimers.html">${TabScheduled}</a>
|
<a href="livetvtimers.html">${TabScheduled}</a>
|
||||||
<a href="livetvseriestimers.html">${TabSeries}</a>
|
<a href="livetvseriestimers.html">${TabSeries}</a>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div style="padding: 1em 0;">
|
||||||
<div>
|
<div>
|
||||||
<table class="detailPageContent primaryDetailPageContent">
|
<table class="detailPageContent primaryDetailPageContent">
|
||||||
<tr>
|
<tr>
|
||||||
<td style="vertical-align: top; padding: 0 1em 0 0;">
|
<td style="vertical-align: top; padding: 0 1em 0 0;">
|
||||||
<div id="itemImage" class="itemImageContainer"></div>
|
<div id="itemImage" class="itemImageContainer smallDetailImageContainer"></div>
|
||||||
</td>
|
</td>
|
||||||
<td style="vertical-align: top; padding: 0;">
|
<td style="vertical-align: top; padding: 0;">
|
||||||
<p><span class="itemName inlineItemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
|
<p><span class="itemName inlineItemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
|
||||||
|
|
|
@ -18,7 +18,7 @@
|
||||||
<table class="detailPageContent primaryDetailPageContent">
|
<table class="detailPageContent primaryDetailPageContent">
|
||||||
<tr>
|
<tr>
|
||||||
<td style="vertical-align: top; padding: 0 1em 0 0;">
|
<td style="vertical-align: top; padding: 0 1em 0 0;">
|
||||||
<div id="itemImage" class="itemImageContainer"></div>
|
<div id="itemImage" class="itemImageContainer smallDetailImageContainer"></div>
|
||||||
</td>
|
</td>
|
||||||
<td style="vertical-align: top; padding: 0;">
|
<td style="vertical-align: top; padding: 0;">
|
||||||
<p><span class="itemName inlineItemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
|
<p><span class="itemName inlineItemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
|
||||||
|
|
|
@ -2334,24 +2334,14 @@
|
||||||
|
|
||||||
if (detectRatio && item.PrimaryImageAspectRatio) {
|
if (detectRatio && item.PrimaryImageAspectRatio) {
|
||||||
|
|
||||||
if (Math.abs(item.PrimaryImageAspectRatio - 1.777777778) < .3) {
|
if (item.PrimaryImageAspectRatio >= 1.48) {
|
||||||
shape = 'thumb';
|
shape = 'thumb';
|
||||||
} else if (Math.abs(item.PrimaryImageAspectRatio - 1) < .2) {
|
} else if (item.PrimaryImageAspectRatio >= .85 && item.PrimaryImageAspectRatio <= 1.34) {
|
||||||
shape = 'square';
|
shape = 'square';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
var imgCssClass = 'itemDetailImage';
|
html += "<img class='itemDetailImage' src='" + url + "' />";
|
||||||
if (shape == 'thumb') {
|
|
||||||
imgCssClass += ' thumbDetailImage';
|
|
||||||
}
|
|
||||||
else if (shape == 'square') {
|
|
||||||
imgCssClass += ' squareDetailImage';
|
|
||||||
} else {
|
|
||||||
imgCssClass += ' portraitDetailImage';
|
|
||||||
}
|
|
||||||
|
|
||||||
html += "<img class='" + imgCssClass + "' src='" + url + "' />";
|
|
||||||
|
|
||||||
if (linkToGallery) {
|
if (linkToGallery) {
|
||||||
html += "</a>";
|
html += "</a>";
|
||||||
|
@ -2378,20 +2368,26 @@
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage');
|
detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage');
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage');
|
detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage');
|
||||||
|
|
||||||
detailContentEffectedByImage.addClass('detailContentEffectedByThumbImage');
|
elem.addClass('thumbDetailImageContainer');
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage');
|
elem.removeClass('portraitDetailImageContainer');
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage');
|
elem.removeClass('squareDetailImageContainer');
|
||||||
}
|
}
|
||||||
else if (shape == 'square') {
|
else if (shape == 'square') {
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedByThumbImage');
|
detailContentEffectedByImage.removeClass('detailContentEffectedByThumbImage');
|
||||||
detailContentEffectedByImage.addClass('detailContentEffectedBySquareImage');
|
detailContentEffectedByImage.addClass('detailContentEffectedBySquareImage');
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage');
|
detailContentEffectedByImage.removeClass('detailContentEffectedByPortraitImage');
|
||||||
|
|
||||||
|
elem.removeClass('thumbDetailImageContainer');
|
||||||
|
elem.removeClass('portraitDetailImageContainer');
|
||||||
|
elem.addClass('squareDetailImageContainer');
|
||||||
} else {
|
} else {
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedByThumbImage');
|
detailContentEffectedByImage.removeClass('detailContentEffectedByThumbImage');
|
||||||
detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage');
|
detailContentEffectedByImage.removeClass('detailContentEffectedBySquareImage');
|
||||||
detailContentEffectedByImage.addClass('detailContentEffectedByPortraitImage');
|
detailContentEffectedByImage.addClass('detailContentEffectedByPortraitImage');
|
||||||
|
|
||||||
|
elem.removeClass('thumbDetailImageContainer');
|
||||||
|
elem.addClass('portraitDetailImageContainer');
|
||||||
|
elem.removeClass('squareDetailImageContainer');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue