mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
better dashboard background and text adjustments
This commit is contained in:
Luke Pulverenti
parent
47910db267
commit
10aacca355
7 changed files with 112 additions and 91 deletions
BIN
dashboard-ui/css/images/userdata/played.png
Normal file
BIN
dashboard-ui/css/images/userdata/played.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
BIN
dashboard-ui/css/images/userdata/unplayed.png
Normal file
BIN
dashboard-ui/css/images/userdata/unplayed.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
|
|
@ -16,7 +16,7 @@
|
|||
|
||||
.libraryPage, .itemListContent {
|
||||
background: #262626!important;
|
||||
/*background: #494949 url(images/bgflip.png) repeat-x!important;*/
|
||||
background: #494949 url(images/bgflip.png) repeat-x!important;
|
||||
background-attachment: fixed!important;
|
||||
}
|
||||
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
|
||||
.listHeader {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 5px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -467,11 +467,6 @@ form, .readOnlyContent {
|
|||
|
||||
@media all and (min-width: 750px) {
|
||||
|
||||
.posterViewItem {
|
||||
font-size: 16px;
|
||||
padding-bottom: 29px;
|
||||
}
|
||||
|
||||
.posterViewItemWithDualText {
|
||||
padding-bottom: 58px;
|
||||
}
|
||||
|
|
@ -492,6 +487,11 @@ form, .readOnlyContent {
|
|||
|
||||
@media all and (min-width: 1200px) {
|
||||
|
||||
.posterViewItem {
|
||||
font-size: 16px;
|
||||
padding-bottom: 29px;
|
||||
}
|
||||
|
||||
.posterViewItem img {
|
||||
max-width: 250px;
|
||||
max-height: 200px;
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<div class="ehsContent">
|
||||
<h1 class="listHeader firstListHeader">Views</h1>
|
||||
|
||||
<div>
|
||||
<div id="views">
|
||||
<div class="posterViewItem">
|
||||
<a href="moviesrecommended.html">
|
||||
<img style="background: #E12026;" src="css/images/items/list/chapter.png"><div class="posterViewItemText">Movies</div>
|
||||
|
|
|
|||
|
|
@ -17,90 +17,90 @@
|
|||
|
||||
<div id="listItems" style="clear: both;"></div>
|
||||
|
||||
<div data-role="panel" id="optionsPanel" data-position="right" data-display="overlay" data-theme="b" data-position-fixed="true">
|
||||
</div>
|
||||
<div data-role="panel" id="optionsPanel" data-position="right" data-display="overlay" data-theme="b" data-position-fixed="true">
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal">
|
||||
<a id="btnViewPanel" href="#" data-role="button" data-theme="a" data-mini="true" onclick="ItemListPage.showViewPanel();">View</a>
|
||||
<a id="btnSortPanel" href="#" data-role="button" data-theme="c" data-mini="true" onclick="ItemListPage.showSortPanel();">Sort</a>
|
||||
<a id="btnFilterPanel" href="#" data-role="button" data-theme="c" data-mini="true" onclick="ItemListPage.showFilterPanel();">Filter</a>
|
||||
<a id="btnIndexPanel" href="#" data-role="button" data-theme="c" data-mini="true" onclick="ItemListPage.showIndexPanel();">Index</a>
|
||||
</div>
|
||||
|
||||
<form>
|
||||
<div id="viewpanel" style="display: none;"></div>
|
||||
<div id="sortpanel" style="display: none;">
|
||||
<fieldset data-role="controlgroup">
|
||||
<legend>
|
||||
<h3>Sort By:</h3>
|
||||
</legend>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioSortName" value="on" checked="checked">
|
||||
<label for="radioSortName" onclick="ItemListPage.sortBy('SortName');">Name</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioCommunityRating" value="other">
|
||||
<label for="radioCommunityRating" onclick="ItemListPage.sortBy('CommunityRating');">Community Rating</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioDateCreated" value="other">
|
||||
<label for="radioDateCreated" onclick="ItemListPage.sortBy('DateCreated');">Date Added</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioDatePlayed" value="other">
|
||||
<label for="radioDatePlayed" onclick="ItemListPage.sortBy('DatePlayed');">Date Played</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioPremiereDate" value="other">
|
||||
<label for="radioPremiereDate" onclick="ItemListPage.sortBy('PremiereDate');">Date Released</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioPlayCount" value="off">
|
||||
<label for="radioPlayCount" onclick="ItemListPage.sortBy('PlayCount');">Play Count</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioRandom" value="off">
|
||||
<label for="radioRandom" onclick="ItemListPage.sortBy('Random');">Random</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioRuntime" value="off">
|
||||
<label for="radioRuntime" onclick="ItemListPage.sortBy('Runtime');">Runtime</label>
|
||||
</fieldset>
|
||||
|
||||
<fieldset data-role="controlgroup">
|
||||
<legend>
|
||||
<h3>Sort Order:</h3>
|
||||
</legend>
|
||||
|
||||
<input class="radioSortOrder" data-theme="c" type="radio" name="radioSortOrder" id="radioAscending" value="on" checked="checked">
|
||||
<label for="radioAscending" onclick="ItemListPage.sortOrder('Ascending');">Ascending</label>
|
||||
|
||||
<input class="radioSortOrder" data-theme="c" type="radio" name="radioSortOrder" id="radioDescending" value="other">
|
||||
<label for="radioDescending" onclick="ItemListPage.sortOrder('Descending');">Descending</label>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div id="filterpanel" style="display: none;">
|
||||
|
||||
<fieldset data-role="controlgroup">
|
||||
<legend>
|
||||
<h3>Filters:</h3>
|
||||
</legend>
|
||||
<input type="checkbox" name="chkPlayed" id="chkPlayed" onchange="ItemListPage.filter('IsPlayed', this.checked);" data-theme="c">
|
||||
<label for="chkPlayed">Played</label>
|
||||
|
||||
<input type="checkbox" name="chkUnplayed" id="chkUnplayed" onchange="ItemListPage.filter('IsUnplayed', this.checked);" data-theme="c">
|
||||
<label for="chkUnplayed">Unplayed</label>
|
||||
|
||||
<input type="checkbox" name="chkIsFavorite" id="chkIsFavorite" onchange="ItemListPage.filter('IsFavorite', this.checked);" data-theme="c">
|
||||
<label for="chkIsFavorite">Favorites</label>
|
||||
|
||||
<input type="checkbox" name="chkLikes" id="chkLikes" onchange="ItemListPage.filter('Likes', this.checked);" data-theme="c">
|
||||
<label for="chkLikes">Likes</label>
|
||||
|
||||
<input type="checkbox" name="chkDislikes" id="chkDislikes" onchange="ItemListPage.filter('Dislikes', this.checked);" data-theme="c">
|
||||
<label for="chkDislikes">Dislikes</label>
|
||||
|
||||
<input type="checkbox" name="chkResumable" id="chkResumable" onchange="ItemListPage.filter('IsResumable', this.checked);" data-theme="c">
|
||||
<label for="chkResumable">Resumable</label>
|
||||
</fieldset>
|
||||
|
||||
</div>
|
||||
<div id="indexpanel" style="display: none;"></div>
|
||||
|
||||
</form>
|
||||
<div data-role="controlgroup" data-type="horizontal">
|
||||
<a id="btnViewPanel" href="#" data-role="button" data-theme="a" data-mini="true" onclick="ItemListPage.showViewPanel();">View</a>
|
||||
<a id="btnSortPanel" href="#" data-role="button" data-theme="c" data-mini="true" onclick="ItemListPage.showSortPanel();">Sort</a>
|
||||
<a id="btnFilterPanel" href="#" data-role="button" data-theme="c" data-mini="true" onclick="ItemListPage.showFilterPanel();">Filter</a>
|
||||
<a id="btnIndexPanel" href="#" data-role="button" data-theme="c" data-mini="true" onclick="ItemListPage.showIndexPanel();">Index</a>
|
||||
</div>
|
||||
|
||||
<form>
|
||||
<div id="viewpanel" style="display: none;"></div>
|
||||
<div id="sortpanel" style="display: none;">
|
||||
<fieldset data-role="controlgroup">
|
||||
<legend>
|
||||
<h3>Sort By:</h3>
|
||||
</legend>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioSortName" value="on" checked="checked">
|
||||
<label for="radioSortName" onclick="ItemListPage.sortBy('SortName');">Name</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioCommunityRating" value="other">
|
||||
<label for="radioCommunityRating" onclick="ItemListPage.sortBy('CommunityRating');">Community Rating</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioDateCreated" value="other">
|
||||
<label for="radioDateCreated" onclick="ItemListPage.sortBy('DateCreated');">Date Added</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioDatePlayed" value="other">
|
||||
<label for="radioDatePlayed" onclick="ItemListPage.sortBy('DatePlayed');">Date Played</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioPremiereDate" value="other">
|
||||
<label for="radioPremiereDate" onclick="ItemListPage.sortBy('PremiereDate');">Date Released</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioPlayCount" value="off">
|
||||
<label for="radioPlayCount" onclick="ItemListPage.sortBy('PlayCount');">Play Count</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioRandom" value="off">
|
||||
<label for="radioRandom" onclick="ItemListPage.sortBy('Random');">Random</label>
|
||||
|
||||
<input class="radioSortBy" data-theme="c" type="radio" name="radioSortBy" id="radioRuntime" value="off">
|
||||
<label for="radioRuntime" onclick="ItemListPage.sortBy('Runtime');">Runtime</label>
|
||||
</fieldset>
|
||||
|
||||
<fieldset data-role="controlgroup">
|
||||
<legend>
|
||||
<h3>Sort Order:</h3>
|
||||
</legend>
|
||||
|
||||
<input class="radioSortOrder" data-theme="c" type="radio" name="radioSortOrder" id="radioAscending" value="on" checked="checked">
|
||||
<label for="radioAscending" onclick="ItemListPage.sortOrder('Ascending');">Ascending</label>
|
||||
|
||||
<input class="radioSortOrder" data-theme="c" type="radio" name="radioSortOrder" id="radioDescending" value="other">
|
||||
<label for="radioDescending" onclick="ItemListPage.sortOrder('Descending');">Descending</label>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div id="filterpanel" style="display: none;">
|
||||
|
||||
<fieldset data-role="controlgroup">
|
||||
<legend>
|
||||
<h3>Filters:</h3>
|
||||
</legend>
|
||||
<input type="checkbox" name="chkPlayed" id="chkPlayed" onchange="ItemListPage.filter('IsPlayed', this.checked);" data-theme="c">
|
||||
<label for="chkPlayed">Played</label>
|
||||
|
||||
<input type="checkbox" name="chkUnplayed" id="chkUnplayed" onchange="ItemListPage.filter('IsUnplayed', this.checked);" data-theme="c">
|
||||
<label for="chkUnplayed">Unplayed</label>
|
||||
|
||||
<input type="checkbox" name="chkIsFavorite" id="chkIsFavorite" onchange="ItemListPage.filter('IsFavorite', this.checked);" data-theme="c">
|
||||
<label for="chkIsFavorite">Favorites</label>
|
||||
|
||||
<input type="checkbox" name="chkLikes" id="chkLikes" onchange="ItemListPage.filter('Likes', this.checked);" data-theme="c">
|
||||
<label for="chkLikes">Likes</label>
|
||||
|
||||
<input type="checkbox" name="chkDislikes" id="chkDislikes" onchange="ItemListPage.filter('Dislikes', this.checked);" data-theme="c">
|
||||
<label for="chkDislikes">Dislikes</label>
|
||||
|
||||
<input type="checkbox" name="chkResumable" id="chkResumable" onchange="ItemListPage.filter('IsResumable', this.checked);" data-theme="c">
|
||||
<label for="chkResumable">Resumable</label>
|
||||
</fieldset>
|
||||
|
||||
</div>
|
||||
<div id="indexpanel" style="display: none;"></div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
var page = this;
|
||||
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
|
||||
|
||||
if (!userId) {
|
||||
return;
|
||||
}
|
||||
|
|
@ -25,6 +25,27 @@
|
|||
}));
|
||||
|
||||
});
|
||||
|
||||
var views = [
|
||||
{ name: "Movies", url: "moviesrecommended.html", img: "css/images/items/list/chapter.png", background: "#E12026" },
|
||||
{ name: "TV Shows", url: "tvrecommended.html", img: "css/images/items/list/collection.png", background: "#FF870F" },
|
||||
{ name: "Music", url: "musicrecommended.html", img: "css/images/items/list/audiowide.png", background: "#4BB3DD" }
|
||||
];
|
||||
|
||||
var html = '';
|
||||
|
||||
for (var i = 0, length = views.length; i < length; i++) {
|
||||
|
||||
var view = views[i];
|
||||
|
||||
html += '<div class="posterViewItem">';
|
||||
html += '<a href="' + view.url + '">';
|
||||
html += '<img style="background: ' + view.background + ';" src="' + view.img + '"><div class="posterViewItemText">' + view.name + '</div>';
|
||||
html += '</a>';
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
$('#views', page).html(html);
|
||||
});
|
||||
|
||||
})(jQuery, document);
|
||||
Loading…
Add table
Add a link
Reference in a new issue