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

notification style fixes

Browse source
This commit is contained in:
Luke Pulverenti 2013-07-06 19:08:10 -04:00
parent cfb3392c35
commit fcf672f54d
2 changed files with 62 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

88
dashboard-ui/css/notifications.css
View file

@ -51,20 +51,23 @@
color: #fff!important;
}
.notificationsFlyout {
width: 300px;
}
.flyoutNotification {
border-top: 1px solid #ccc;
background: #f8f8f8;
color: #555;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.flyoutNotification p {
margin: .7em 0;
margin: .5em 0;
}
.notificationsFlyout {
width: 300px;
}
.notificationName {
font-weight: bold;
color: #555;
@ -83,8 +86,8 @@
}
.imgNotification, .imgNotificationInner {
width: 60px;
height: 60px;
width: 40px;
height: 40px;
}
.imgNotificationInner {
@ -108,9 +111,9 @@
background-image: linear-gradient(top,#4d90fe,#4787ed);
}
.imgNotificationNormal .imgNotificationInner {
background-image: url(images/notifications/info.png);
}
.imgNotificationNormal .imgNotificationInner {
background-image: url(images/notifications/info.png);
}
.imgNotificationError {
background-color: #d14836;
@ -122,21 +125,61 @@
background-image: linear-gradient(top,#dd4b39,#d14836);
}
.imgNotificationError .imgNotificationInner {
background-image: url(images/notifications/error.png);
}
.imgNotificationError .imgNotificationInner {
background-image: url(images/notifications/error.png);
}
.imgNotificationWarning {
background-color: #FF7537;
}
.imgNotificationWarning .imgNotificationInner {
background-image: url(images/notifications/error.png);
.imgNotificationWarning .imgNotificationInner {
background-image: url(images/notifications/error.png);
}
.notificationContent {
padding: 0 .5em;
}
@media all and (min-width: 350px) {
.notificationsFlyout {
width: 320px;
}
}
@media all and (min-width: 400px) {
.notificationsFlyout {
width: 370px;
}
}
@media all and (min-width: 450px) {
.notificationsFlyout {
width: 400px;
}
.notificationImage {
margin: 0 .5em 0 1em;
padding: .5em 0;
display: inline-block;
vertical-align: top;
}
.notificationContent {
display: inline-block;
vertical-align: top;
overflow: hidden;
}
}
@media all and (min-width: 500px) {
.notificationsFlyout {
width: 400px;
width: 450px;
}
.imgNotification, .imgNotificationInner {
width: 60px;
height: 60px;
}
}
@ -144,17 +187,4 @@
.notificationsFlyout {
width: 500px;
}
.notificationImage {
display: inline-block;
vertical-align: top;
margin: 0 1em;
padding: .7em 0;
}
.notificationContent {
display: inline-block;
vertical-align: top;
}
}

5
dashboard-ui/scripts/notifications.js
View file

@ -26,7 +26,7 @@
var context = this;
var html = '<div data-role="popup" class="notificationsFlyout" style="min-width:200px;margin-top:30px;margin-right:20px;" class="ui-corner-all">';
var html = '<div data-role="popup" class="notificationsFlyout" style="min-width:250px;margin-top:30px;margin-right:20px;background: #f8f8f8;">';
html += '<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>';
@ -34,7 +34,7 @@
html += '<h3 style="margin: .5em 0;">Notifications</h3>';
html += '</div>';
html += '<div data-role="content" class="ui-corner-bottom ui-content" style="padding: 0;background: #f8f8f8;">';
html += '<div data-role="content" class="ui-corner-bottom ui-content" style="padding: 0;">';
html += '<p class="notificationsFlyoutlist">Loading...';
@ -140,6 +140,7 @@
}
html += '</div>';
html += '</div>';
return html;