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

fix list avatars

This commit is contained in:
Luke Pulverenti 2015-10-26 14:55:46 -04:00
parent 78bf493400
commit 53f0a1d9c8
20 changed files with 41 additions and 67 deletions

View file

@ -113,7 +113,7 @@
html += '<paper-icon-item role="menuitem" class="lnkPath">'; html += '<paper-icon-item role="menuitem" class="lnkPath">';
html += '<paper-fab class="listAvatar" style="background:#52B54B;" icon="folder" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#52B54B;" icon="folder" item-icon></paper-fab>';
html += '<paper-item-body>'; html += '<paper-item-body>';
html += path; html += path;

View file

@ -55,7 +55,7 @@
html += '<paper-icon-item role="menuitem" class="lnkPath">'; html += '<paper-icon-item role="menuitem" class="lnkPath">';
html += '<paper-fab class="listAvatar" style="background:#52B54B;" icon="folder" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#52B54B;" icon="folder" item-icon></paper-fab>';
html += '<paper-item-body>'; html += '<paper-item-body>';
html += path; html += path;

View file

@ -104,7 +104,7 @@
itemHtml += '<paper-icon-item>'; itemHtml += '<paper-icon-item>';
itemHtml += '<paper-fab class="listAvatar blue" icon="closed-caption" item-icon></paper-fab>'; itemHtml += '<paper-fab mini class="blue" icon="closed-caption" item-icon></paper-fab>';
var atts = []; var atts = [];
@ -228,7 +228,7 @@
html += '<paper-icon-item>'; html += '<paper-icon-item>';
html += '<paper-fab class="listAvatar blue" icon="closed-caption" item-icon></paper-fab>'; html += '<paper-fab mini class="blue" icon="closed-caption" item-icon></paper-fab>';
if (result.Comment) { if (result.Comment) {
html += '<paper-item-body three-line>'; html += '<paper-item-body three-line>';

View file

@ -4,4 +4,4 @@
paper-fab.keyboard-focus.paper-fab-0 { paper-fab.keyboard-focus.paper-fab-0 {
background: #444; background: #444;
} }

View file

@ -145,7 +145,7 @@
<p id="awardSummary"></p> <p id="awardSummary"></p>
<div class="paperList" id="criticRatingSummary"> <div class="paperList" id="criticRatingSummary">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar" style="background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: cover; background-image: url(css/images/fresh.png);" item-icon></paper-fab> <paper-fab mini style="background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: cover; background-image: url(css/images/fresh.png);" item-icon></paper-fab>
<paper-item-body three-line> <paper-item-body three-line>
<div>TOMATOMETER®</div> <div>TOMATOMETER®</div>
<div class="criticRatingScore"></div> <div class="criticRatingScore"></div>

View file

@ -7,30 +7,13 @@
<body> <body>
<div id="myPreferencesMenuPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-contextname="${HeaderSettings}" data-require="scripts/mypreferencescommon,paperbuttonstyle"> <div id="myPreferencesMenuPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-contextname="${HeaderSettings}" data-require="scripts/mypreferencescommon,paperbuttonstyle">
<style>
.listAvatar.green {
background-color: #81c784;
}
.listAvatar.orange {
background-color: #ffd54f;
}
.listAvatar.blue {
background-color: #4fc3f7;
}
.listAvatar.red {
background-color: #e57373;
}
</style>
<div data-role="content"> <div data-role="content">
<div class="readOnlyContent" style="margin: 0 auto;"> <div class="readOnlyContent" style="margin: 0 auto;">
<h1 class="settingsMenuHeader">${HeaderSettings}</h1> <h1 class="settingsMenuHeader">${HeaderSettings}</h1>
<div class="paperList"> <div class="paperList">
<a href="#" class="clearLink lnkDisplayPreferences"> <a href="#" class="clearLink lnkDisplayPreferences">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar blue" icon="tv" item-icon></paper-fab> <paper-fab mini class="blue" icon="tv" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonDisplaySettings}</div> <div>${ButtonDisplaySettings}</div>
<div secondary>${ButtonDisplaySettingsHelp}</div> <div secondary>${ButtonDisplaySettingsHelp}</div>
@ -40,7 +23,7 @@
<a href="#" class="clearLink lnkHomeScreenPreferences"> <a href="#" class="clearLink lnkHomeScreenPreferences">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar red" icon="home" item-icon></paper-fab> <paper-fab mini class="red" icon="home" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonHomeScreenSettings}</div> <div>${ButtonHomeScreenSettings}</div>
<div secondary>${ButtonHomeScreenSettingsHelp}</div> <div secondary>${ButtonHomeScreenSettingsHelp}</div>
@ -50,7 +33,7 @@
<a href="#" class="clearLink lnkLanguagePreferences"> <a href="#" class="clearLink lnkLanguagePreferences">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar green" icon="play-circle-filled" item-icon></paper-fab> <paper-fab mini class="green" icon="play-circle-filled" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonPlaybackSettings}</div> <div>${ButtonPlaybackSettings}</div>
<div secondary>${ButtonPlaybackSettingsHelp}</div> <div secondary>${ButtonPlaybackSettingsHelp}</div>
@ -60,7 +43,7 @@
<a href="#" class="clearLink lnkMyProfile"> <a href="#" class="clearLink lnkMyProfile">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar orange" icon="person" item-icon></paper-fab> <paper-fab mini class="orange" icon="person" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonProfile}</div> <div>${ButtonProfile}</div>
<div secondary>${ButtonProfileHelp}</div> <div secondary>${ButtonProfileHelp}</div>
@ -70,7 +53,7 @@
<a href="#" class="clearLink lnkSync hide"> <a href="#" class="clearLink lnkSync hide">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar" icon="sync" style="background-color: #673AB7;" item-icon></paper-fab> <paper-fab mini icon="sync" style="background-color: #673AB7;" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonSyncSettings}</div> <div>${ButtonSyncSettings}</div>
<div secondary>${ButtonSyncSettingsHelp}</div> <div secondary>${ButtonSyncSettingsHelp}</div>
@ -84,13 +67,13 @@
<div class="paperList"> <div class="paperList">
<a href="selectserver.html" class="clearLink"> <a href="selectserver.html" class="clearLink">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar" icon="wifi" style="background-color: #444;" item-icon></paper-fab> <paper-fab mini icon="wifi" style="background-color: #444;" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${HeaderSelectServer}</div> <div>${HeaderSelectServer}</div>
</paper-item-body> </paper-item-body>
</paper-icon-item> </paper-icon-item>
<paper-icon-item class="btnLogout"> <paper-icon-item class="btnLogout">
<paper-fab class="listAvatar" icon="lock" style="background-color: #444;" item-icon></paper-fab> <paper-fab mini icon="lock" style="background-color: #444;" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonSignOut}</div> <div>${ButtonSignOut}</div>
</paper-item-body> </paper-item-body>
@ -104,7 +87,7 @@
<div class="paperList"> <div class="paperList">
<a href="dashboard.html" class="clearLink"> <a href="dashboard.html" class="clearLink">
<paper-icon-item> <paper-icon-item>
<paper-fab class="listAvatar" icon="settings" style="background-color: #444;" item-icon></paper-fab> <paper-fab mini icon="settings" style="background-color: #444;" item-icon></paper-fab>
<paper-item-body two-line> <paper-item-body two-line>
<div>${ButtonServerDashboard}</div> <div>${ButtonServerDashboard}</div>
</paper-item-body> </paper-item-body>

View file

@ -129,7 +129,7 @@
itemHtml += '<a class="clearLink" href="' + item.Link + '" target="_blank">'; itemHtml += '<a class="clearLink" href="' + item.Link + '" target="_blank">';
itemHtml += '<paper-icon-item>'; itemHtml += '<paper-icon-item>';
itemHtml += '<paper-fab class="listAvatar blue" icon="dvr" item-icon></paper-fab>'; itemHtml += '<paper-fab mini class="blue" icon="dvr" item-icon></paper-fab>';
itemHtml += '<paper-item-body three-line>'; itemHtml += '<paper-item-body three-line>';
@ -1094,10 +1094,10 @@ $(document).on('pageshow', "#dashboardPage", DashboardPage.onPageShow).on('pageb
height: 40 height: 40
}); });
html += '<paper-fab class="listAvatar" style="background-color:' + color + ';background-image:url(\'' + userImgUrl + '\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>'; html += '<paper-fab mini style="background-color:' + color + ';background-image:url(\'' + userImgUrl + '\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>';
} }
else { else {
html += '<paper-fab class="listAvatar" icon="dvr" style="background-color:' + color + '" item-icon></paper-fab>'; html += '<paper-fab mini icon="dvr" style="background-color:' + color + '" item-icon></paper-fab>';
} }
html += '<paper-item-body three-line>'; html += '<paper-item-body three-line>';

View file

@ -36,7 +36,7 @@
var deviceHtml = ''; var deviceHtml = '';
deviceHtml += '<paper-icon-item>'; deviceHtml += '<paper-icon-item>';
deviceHtml += '<paper-fab class="listAvatar" style="background:#999;" icon="tablet-android" item-icon></paper-fab>'; deviceHtml += '<paper-fab mini style="background:#999;" icon="tablet-android" item-icon></paper-fab>';
deviceHtml += '<paper-item-body three-line>'; deviceHtml += '<paper-item-body three-line>';
deviceHtml += '<a class="clearLink" href="device.html?id=' + d.Id + '">'; deviceHtml += '<a class="clearLink" href="device.html?id=' + d.Id + '">';

View file

@ -1130,9 +1130,9 @@
else if (review.Likes != null) { else if (review.Likes != null) {
if (review.Likes) { if (review.Likes) {
html += '<paper-fab class="listAvatar" style="background-color:transparent;background-image:url(\'css/images/fresh.png\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>'; html += '<paper-fab mini style="background-color:transparent;background-image:url(\'css/images/fresh.png\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>';
} else { } else {
html += '<paper-fab class="listAvatar" style="background-color:transparent;background-image:url(\'css/images/rotten.png\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>'; html += '<paper-fab mini style="background-color:transparent;background-image:url(\'css/images/rotten.png\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>';
} }
} }

View file

@ -39,22 +39,22 @@
} }
if (imgUrl) { if (imgUrl) {
html += '<paper-fab class="listAvatar blue" style="background-image:url(\'' + imgUrl + '\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>'; html += '<paper-fab mini class="blue" style="background-image:url(\'' + imgUrl + '\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>';
} }
else if (program.IsKids) { else if (program.IsKids) {
html += '<paper-fab class="listAvatar" style="background:#2196F3;" icon="person" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#2196F3;" icon="person" item-icon></paper-fab>';
} }
else if (program.IsSports) { else if (program.IsSports) {
html += '<paper-fab class="listAvatar" style="background:#8BC34A;" icon="person" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#8BC34A;" icon="person" item-icon></paper-fab>';
} }
else if (program.IsMovie) { else if (program.IsMovie) {
html += '<paper-fab class="listAvatar" icon="movie" item-icon></paper-fab>'; html += '<paper-fab mini icon="movie" item-icon></paper-fab>';
} }
else if (program.IsNews) { else if (program.IsNews) {
html += '<paper-fab class="listAvatar" style="background:#673AB7;" icon="new-releases" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#673AB7;" icon="new-releases" item-icon></paper-fab>';
} }
else { else {
html += '<paper-fab class="listAvatar blue" icon="live-tv" item-icon></paper-fab>'; html += '<paper-fab mini class="blue" icon="live-tv" item-icon></paper-fab>';
} }
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';

View file

@ -6,7 +6,7 @@
html += '<paper-icon-item>'; html += '<paper-icon-item>';
html += '<paper-fab class="listAvatar blue" icon="live-tv" item-icon></paper-fab>'; html += '<paper-fab mini class="blue" icon="live-tv" item-icon></paper-fab>';
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';
html += '<a href="livetvrecordinglist.html?groupid=' + group.Id + '" class="clearLink">'; html += '<a href="livetvrecordinglist.html?groupid=' + group.Id + '" class="clearLink">';

View file

@ -39,7 +39,7 @@
html += '<paper-icon-item>'; html += '<paper-icon-item>';
html += '<paper-fab class="listAvatar" icon="live-tv" item-icon></paper-fab>'; html += '<paper-fab mini icon="live-tv" item-icon></paper-fab>';
html += '<paper-item-body three-line>'; html += '<paper-item-body three-line>';
html += '<a class="clearLink" href="livetvseriestimer.html?id=' + timer.Id + '">'; html += '<a class="clearLink" href="livetvseriestimer.html?id=' + timer.Id + '">';

View file

@ -32,7 +32,7 @@
var tuner = tuners[i]; var tuner = tuners[i];
html += '<paper-icon-item>'; html += '<paper-icon-item>';
html += '<paper-fab class="listAvatar" style="background:#52B54B;" icon="live-tv" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#52B54B;" icon="live-tv" item-icon></paper-fab>';
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';
@ -196,7 +196,7 @@
html += '<paper-icon-item>'; html += '<paper-icon-item>';
html += '<paper-fab class="listAvatar" style="background:#52B54B;" icon="live-tv" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#52B54B;" icon="live-tv" item-icon></paper-fab>';
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';
html += '<a class="clearLink" href="' + href + '">'; html += '<a class="clearLink" href="' + href + '">';
@ -300,7 +300,7 @@
var provider = providers[i]; var provider = providers[i];
html += '<paper-icon-item>'; html += '<paper-icon-item>';
html += '<paper-fab class="listAvatar" style="background:#52B54B;" icon="dvr" item-icon></paper-fab>'; html += '<paper-fab mini style="background:#52B54B;" icon="dvr" item-icon></paper-fab>';
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';

View file

@ -95,7 +95,7 @@
currentHtml += '<paper-icon-item class="viewItem" data-viewid="' + view.Id + '">'; currentHtml += '<paper-icon-item class="viewItem" data-viewid="' + view.Id + '">';
currentHtml += '<paper-fab class="listAvatar" style="background-color:#444;" icon="folder-open" item-icon></paper-fab>'; currentHtml += '<paper-fab mini style="background-color:#444;" icon="folder-open" item-icon></paper-fab>';
currentHtml += '<paper-item-body>'; currentHtml += '<paper-item-body>';

View file

@ -130,9 +130,9 @@
itemHtml += '<paper-icon-item>'; itemHtml += '<paper-icon-item>';
if (notification.Level == "Error") { if (notification.Level == "Error") {
itemHtml += '<paper-fab class="listAvatar" style="background:#cc3333;" icon="error" item-icon></paper-fab>'; itemHtml += '<paper-fab mini class="" style="background:#cc3333;" icon="error" item-icon></paper-fab>';
} else { } else {
itemHtml += '<paper-fab class="listAvatar blue" icon="dvr" item-icon></paper-fab>'; itemHtml += '<paper-fabmini class="blue" icon="dvr" item-icon></paper-fab>';
} }
itemHtml += '<paper-item-body three-line>'; itemHtml += '<paper-item-body three-line>';

View file

@ -32,10 +32,10 @@
itemHtml += '<paper-icon-item>'; itemHtml += '<paper-icon-item>';
if (i.Enabled) { if (i.Enabled) {
itemHtml += '<paper-fab class="listAvatar blue" icon="notifications-active" item-icon></paper-fab>'; itemHtml += '<paper-fab mini class="blue" icon="notifications-active" item-icon></paper-fab>';
} }
else { else {
itemHtml += '<paper-fab class="listAvatar" style="background-color:#999;" icon="notifications-off" item-icon></paper-fab>'; itemHtml += '<paper-fab mini style="background-color:#999;" icon="notifications-off" item-icon></paper-fab>';
} }
itemHtml += '<paper-item-body two-line>'; itemHtml += '<paper-item-body two-line>';

View file

@ -53,7 +53,7 @@
html += '<paper-icon-item class="scheduledTaskPaperIconItem" data-status="' + task.State + '">'; html += '<paper-icon-item class="scheduledTaskPaperIconItem" data-status="' + task.State + '">';
html += "<a item-icon class='clearLink' href='scheduledtask.html?id=" + task.Id + "'>"; html += "<a item-icon class='clearLink' href='scheduledtask.html?id=" + task.Id + "'>";
html += '<paper-fab class="listAvatar" icon="schedule"></paper-fab>'; html += '<paper-fab mini icon="schedule"></paper-fab>';
html += "</a>"; html += "</a>";
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';

View file

@ -50,7 +50,7 @@
html += '<paper-icon-item class="serverItem" data-id="' + server.Id + '">'; html += '<paper-icon-item class="serverItem" data-id="' + server.Id + '">';
html += '<paper-fab class="listAvatar blue lnkServer" icon="wifi" item-icon></paper-fab>'; html += '<paper-fab mini class="blue lnkServer" icon="wifi" item-icon></paper-fab>';
html += '<paper-item-body class="lnkServer" two-line>'; html += '<paper-item-body class="lnkServer" two-line>';
html += '<a class="clearLink" href="#">'; html += '<a class="clearLink" href="#">';
@ -259,7 +259,7 @@
html += '<paper-icon-item class="inviteItem" data-id="' + invite.Id + '">'; html += '<paper-icon-item class="inviteItem" data-id="' + invite.Id + '">';
html += '<paper-fab class="listAvatar blue lnkServer" icon="wifi" item-icon></paper-fab>'; html += '<paper-fab mini class="blue lnkServer" icon="wifi" item-icon></paper-fab>';
html += '<paper-item-body two-line>'; html += '<paper-item-body two-line>';

View file

@ -61,10 +61,10 @@
} }
if (imgUrl) { if (imgUrl) {
html += '<paper-fab class="listAvatar blue" style="background-image:url(\'' + imgUrl + '\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>'; html += '<paper-fab mini class="blue" style="background-image:url(\'' + imgUrl + '\');background-repeat:no-repeat;background-position:center center;background-size: cover;" item-icon></paper-fab>';
} }
else { else {
html += '<paper-fab class="listAvatar blue" icon="sync" item-icon></paper-fab>'; html += '<paper-fab mini class="blue" icon="sync" item-icon></paper-fab>';
} }
html += '<paper-item-body three-line>'; html += '<paper-item-body three-line>';

View file

@ -459,15 +459,6 @@ paper-textarea.mono textarea {
font-family: monospace !important; font-family: monospace !important;
} }
.listAvatar {
display: inline-block;
width: 40px;
height: 40px;
border-radius: 50%;
overflow: hidden;
background: #ccc;
}
.paperList { .paperList {
padding-top: 12px; padding-top: 12px;
margin: 12px auto; margin: 12px auto;