diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index 75b5f2f671..e0aba00136 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -103,7 +103,7 @@ } .libraryPage > .ui-content { - padding: 10px 0; + padding: 10px 0px; } .libraryPage, .libraryPage .itemListContent { @@ -379,14 +379,14 @@ a.itemTag:hover { .lnkSibling { position: absolute; - bottom: 240px; + top: 10px; text-decoration: none; - color: #fff!important; font-weight: normal!important; display: none; background-color: rgba(0,0,0,0.6); - border-radius: 3px; - padding: 3px 5px; + color: #ddd!important; + background-color: transparent; + padding: 0; } .lnkSibling:hover { @@ -597,14 +597,6 @@ a.itemTag:hover { .lnkSibling:not(.hide) { display: block; } - - .lnkSibling { - bottom: 270px; - } - - .noBackdrop .lnkSibling { - bottom: 260px; - } } @media all and (min-width: 1000px) { @@ -612,10 +604,6 @@ a.itemTag:hover { .itemBackdrop { background-size: 100% auto; } - - .noBackdrop .lnkSibling { - bottom: 205px; - } } @media all and (min-width: 650px) { @@ -639,6 +627,20 @@ a.itemTag:hover { } } +@media all and (min-width: 800px) { + + .ehsContent { + max-width: 700px; + } +} + +@media all and (min-width: 900px) { + + .ehsContent { + max-width: 880px; + } +} + @media all and (min-width: 1000px) { .ehsContent { @@ -671,14 +673,6 @@ a.itemTag:hover { @media all and (min-width: 1440px) { - .lnkSibling { - bottom: 205px; - color: #ddd!important; - background-color: transparent; - border-radius: 0; - padding: 0; - } - .ehsContent { max-width: 980px; } diff --git a/dashboard-ui/css/livetv.css b/dashboard-ui/css/livetv.css index 318564092a..a697f935e1 100644 --- a/dashboard-ui/css/livetv.css +++ b/dashboard-ui/css/livetv.css @@ -115,8 +115,8 @@ } .channelImageContainer .itemDetailImage { - max-width: 160px; - max-height: 100px; + max-width: 200px; + max-height: 110px; margin-top: 1em; margin-bottom: 1em; } diff --git a/dashboard-ui/css/posteritem.css b/dashboard-ui/css/posteritem.css index 8fb8ff6ff2..8304fe2cac 100644 --- a/dashboard-ui/css/posteritem.css +++ b/dashboard-ui/css/posteritem.css @@ -1,5 +1,5 @@ .posterItem { - margin: 7px; + margin: 6px; text-shadow: none; font-weight: normal!important; display: inline-block; @@ -22,6 +22,12 @@ box-shadow: 0 0 20px 3px #2572EB; } + + +.smallBackdropPosterItem, .smallPosterItem { + margin: 3px; +} + .posterItemImage { background-size: contain; background-repeat: no-repeat; @@ -139,13 +145,13 @@ height: 162px; } - .smallBackdropPosterItem { - width: 192px; - } +.smallBackdropPosterItem { + width: 168px; +} - .smallBackdropPosterItem .posterItemImage { - height: 108px; - } + .smallBackdropPosterItem .posterItemImage { + height: 94.5px; + } .portraitPosterItem { width: 100px; @@ -161,6 +167,13 @@ opacity: .8; } +@media all and (max-width: 400px) { + + .backdropPosterItem { + display: block; + } +} + @media all and (min-width: 540px) { .backdropPosterItem { @@ -172,6 +185,17 @@ } } +@media all and (min-width: 540px) { + + .smallBackdropPosterItem { + width: 184px; + } + + .smallBackdropPosterItem .posterItemImage { + height: 103.5px; + } +} + @media all and (min-width: 650px) { .backdropPosterItem { @@ -189,6 +213,14 @@ .storePosterItem .posterItemImage { height: 110px; } + + .smallBackdropPosterItem { + width: 192px; + } + + .smallBackdropPosterItem .posterItemImage { + height: 108px; + } } @media all and (min-width: 750px) { diff --git a/dashboard-ui/css/search.css b/dashboard-ui/css/search.css index 9314bd7d79..0a38800f81 100644 --- a/dashboard-ui/css/search.css +++ b/dashboard-ui/css/search.css @@ -30,7 +30,7 @@ border-radius: 2px; font-weight: bold; min-width: 54px; - padding: 0 8px; + padding: 0 4px; text-align: center; text-decoration: none !important; -moz-user-select: none; @@ -116,13 +116,6 @@ } } -@media all and (min-width: 340px) { - - .txtSearch { - width: 150px; - } -} - @media all and (min-width: 850px) { .txtSearch { diff --git a/dashboard-ui/scripts/boxsets.js b/dashboard-ui/scripts/boxsets.js index f341bc0b13..7619008fff 100644 --- a/dashboard-ui/scripts/boxsets.js +++ b/dashboard-ui/scripts/boxsets.js @@ -7,7 +7,7 @@ SortOrder: "Ascending", IncludeItemTypes: "BoxSet", Recursive: true, - Fields: "DateCreated", + Fields: "DateCreated,PrimaryImageAspectRatio", StartIndex: 0 }; @@ -29,9 +29,11 @@ var checkSortOption = $('.radioSortBy:checked', page); $('.viewSummary', page).html(LibraryBrowser.getViewSummaryHtml(query, checkSortOption)).trigger('create'); - html += LibraryBrowser.getPosterDetailViewHtml({ + html = LibraryBrowser.getPosterViewHtml({ items: result.Items, - context: "movies" + shape: "portrait", + context: 'movies', + useAverageAspectRatio: true }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index 22af64f18b..1eb1b270e0 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -878,7 +878,7 @@ if (options.showParentTitle) { html += "
"; - html += item.SeriesName || item.Album || " "; + html += item.SeriesName || item.Album || item.AlbumArtist || " "; html += "
"; } diff --git a/dashboard-ui/scripts/movietrailers.js b/dashboard-ui/scripts/movietrailers.js index efd8d44008..b644f2bc37 100644 --- a/dashboard-ui/scripts/movietrailers.js +++ b/dashboard-ui/scripts/movietrailers.js @@ -9,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "Trailer", Recursive: true, - Fields: "DateCreated", + Fields: "DateCreated,PrimaryImageAspectRatio", StartIndex: 0 }; @@ -31,17 +31,12 @@ var checkSortOption = $('.radioSortBy:checked', page); $('.viewSummary', page).html(LibraryBrowser.getViewSummaryHtml(query, checkSortOption)).trigger('create'); - if (view == "Backdrop") { - html += LibraryBrowser.getPosterDetailViewHtml({ + if (view == "Poster") { + html = LibraryBrowser.getPosterViewHtml({ items: result.Items, - preferBackdrop: true, - context: "movies" - }); - } - else if (view == "Poster") { - html += LibraryBrowser.getPosterDetailViewHtml({ - items: result.Items, - context: "movies" + shape: "portrait", + context: 'movies', + useAverageAspectRatio: true }); } diff --git a/dashboard-ui/scripts/musicalbums.js b/dashboard-ui/scripts/musicalbums.js index 8813269626..2c2f909460 100644 --- a/dashboard-ui/scripts/musicalbums.js +++ b/dashboard-ui/scripts/musicalbums.js @@ -9,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "MusicAlbum", Recursive: true, - Fields: "DateCreated", + Fields: "DateCreated,PrimaryImageAspectRatio", StartIndex: 0 }; @@ -32,10 +32,13 @@ $('.viewSummary', page).html(LibraryBrowser.getViewSummaryHtml(query, checkSortOption)).trigger('create'); if (view == "Poster") { - html += LibraryBrowser.getPosterDetailViewHtml({ + html = LibraryBrowser.getPosterViewHtml({ items: result.Items, - context: "music", - shape: "square" + shape: "square", + context: 'music', + useAverageAspectRatio: true, + showTitle: true, + showParentTitle: true }); $('.itemsContainer', page).removeClass('timelineItemsContainer'); } diff --git a/dashboard-ui/scripts/tvupcoming.js b/dashboard-ui/scripts/tvupcoming.js index 1d56b48220..293bf7e81c 100644 --- a/dashboard-ui/scripts/tvupcoming.js +++ b/dashboard-ui/scripts/tvupcoming.js @@ -70,7 +70,6 @@ showNewIndicator: false, shape: "backdrop", showTitle: true, - showParentTitle: true, showPremiereDate: true, showPremiereDateIndex: true, preferThumb: true