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

updated mobile and tablet layouts in web client

This commit is contained in:
Luke Pulverenti 2013-12-30 22:43:30 -05:00
parent 722c5a92f3
commit 2861ff68c9
11 changed files with 58 additions and 52 deletions

View file

@ -176,8 +176,11 @@
margin-left: 1em;
}
.labelPageSize, .selectPageSize {
display: none;
@media all and (max-width: 650px) {
.labelPageSize, .selectPageSize {
display: none!important;
}
}
.galleryImageContainer {
@ -559,11 +562,11 @@ a.itemTag:hover {
text-align: center;
}
.detailImageProgressContainer progress {
.detailImageProgressContainer progress {
width: 100%;
margin: 0 auto;
height: 6px;
}
}
@media all and (max-width: 550px) {
@ -696,10 +699,6 @@ a.itemTag:hover {
.viewControls + .listTopPaging {
margin-left: 1em;
}
.labelPageSize, .selectPageSize {
display: inline;
}
}
@media all and (min-width: 750px) {
@ -846,9 +845,9 @@ a.itemTag:hover {
background: rgba(82, 181, 75, .8);
}
.unplayedIndicator div:after {
.unplayedIndicator div:after {
background-color: transparent !important;
}
}
.itemProgress {
vertical-align: top;

View file

@ -1,6 +1,6 @@
/* Now playing bar */
.nowPlayingBar {
padding: 6px 0 6px 0;
padding: 6px 0 24px 0;
border-top: 2px solid green;
}
@ -17,7 +17,7 @@
.nowPlayingBar .barBackground {
border-top: 2px solid green;
position: absolute;
margin: -8px -0.5em !important;
margin: -8px -0.5em -26px !important;
width: 100%;
height: 100%;
}

View file

@ -113,11 +113,11 @@
}
.squarePosterItem {
width: 154px;
width: 142px;
}
.squarePosterItem .posterItemImage {
height: 150px;
height: 138px;
}
.storeReviewCount {
@ -126,27 +126,27 @@
.backdropPosterItem {
width: 292px;
width: 142px;
}
.backdropPosterItem .posterItemImage {
height: 162px;
height: 77.625px;
}
.smallBackdropPosterItem {
width: 172px;
width: 160px;
}
.smallBackdropPosterItem .posterItemImage {
height: 94.5px;
height: 87.75px;
}
.portraitPosterItem {
width: 106px;
width: 90px;
}
.portraitPosterItem .posterItemImage {
height: 153px;
height: 129px;
}
.posterItemProgress .itemProgressBar {
@ -155,13 +155,6 @@
opacity: .6;
}
@media all and (max-width: 400px) {
.backdropPosterItem {
display: block;
}
}
@media all and (min-width: 540px) {
.backdropPosterItem {
@ -171,9 +164,6 @@
.backdropPosterItem .posterItemImage {
height: 144px;
}
}
@media all and (min-width: 540px) {
.smallBackdropPosterItem {
width: 188px;
@ -184,6 +174,26 @@
}
}
@media all and (min-width: 600px) {
.squarePosterItem {
width: 164px;
}
.squarePosterItem .posterItemImage {
height: 160px;
}
.portraitPosterItem {
width: 122px;
}
.portraitPosterItem .posterItemImage {
height: 177px;
}
}
@media all and (min-width: 650px) {
.backdropPosterItem {

View file

@ -59,7 +59,7 @@
.searchHintSecondaryText {
font-size: 13px;
color: #bbb;
color: #ddd;
margin-top: 3px;
white-space: nowrap;
text-overflow: ellipsis;

View file

@ -408,7 +408,7 @@ h1 .imageLink {
@media all and (min-width: 900px) {
.header {
.page:not(.wizardPage) .header {
padding-top: 0;
}
}

View file

@ -24,7 +24,7 @@
<p><strong>A new version of Media Browser Server is available!</strong></p>
<p id="newVersionNumber"></p>
<div id="btnUpdateApplicationContainer">
<button id="btnUpdateApplication" type="button" data-icon="arrow-d" data-theme="b" onclick="DashboardPage.updateApplication();">Update Now</button>
<button id="btnUpdateApplication" type="button" data-icon="arrow-d" data-theme="b">Update Now</button>
</div>
<div id="btnManualUpdateContainer">
Please shutdown the server and <a href="http://www.mediabrowser3.com/download" target="_blank">update manually.</a>

View file

@ -34,7 +34,7 @@ $.fn.checked = function (value) {
$.fn.buttonEnabled = function(enabled) {
return this;
return enabled ? this.attr('disabled', '').removeAttr('disabled') : this.attr('disabled', 'disabled');
};
if (!Array.prototype.filter) {

View file

@ -1108,18 +1108,15 @@
getPlayedIndicatorHtml: function (item) {
if (item.Type == "Series" || item.Type == "Season" || item.Type == "BoxSet") {
if (item.Type == "Series" || item.Type == "Season" || item.Type == "BoxSet" || item.MediaType == "Video") {
if (item.RecursiveUnplayedItemCount) {
return '<div class="unplayedIndicator">' + item.RecursiveUnplayedItemCount + '</div>';
}
}
if (item.PlayedPercentage == 100) {
return '<div class="unplayedIndicator"><div class="ui-icon-check ui-btn-icon-notext"></div></div>';
}
if (item.MediaType == "Video") {
var userData = item.UserData || {};
if (userData.Played) {

View file

@ -20,7 +20,9 @@
items: result.Items,
useAverageAspectRatio: true,
showUnplayedIndicator: false,
shape: "square"
shape: "square",
showTitle: true,
showParentTitle: true
}));
});

View file

@ -117,7 +117,6 @@ var Dashboard = {
showError: function (message) {
$.mobile.loading('show', {
theme: "e",
text: message,
textonly: true,
textVisible: true
@ -135,7 +134,6 @@ var Dashboard = {
var message = options;
$.mobile.loading('show', {
theme: "b",
text: message,
textonly: true,
textVisible: true

View file

@ -17,7 +17,7 @@
</div>
<div data-role="content">
<div class="ehsContent">
<br />
<h1 class="listHeader">Next Up</h1>
<div id="nextUpItems">
</div>
</div>