mediawiki-extensions-Echo/modules/overlay/ext.echo.overlay.css
kaldari 9448c6cab0 Add 'Mark all as read' button to overlay
Button is only shown if there are more unread notifications than
fit in the overlay.

To avoid performance issues, this version only works for cases where
the number of unread notifications is less than the maximum count
(99 currently). Otherwise the button to mark all as read isn't
displayed (it's also limited on the server-side for good measure).

Bug: 47092
Change-Id: Ifcb0a436e2b31062741c441cca239d35ddefa0e1
2013-04-18 00:29:36 -07:00

129 lines
2.5 KiB
CSS

.mw-echo-overlay {
position: absolute;
top: 2.6em;
left: -200px;
border: 1px solid silver;
background-color: #fff;
width: 450px;
min-height: 2em;
padding: 0;
color: #6D6D6D;
z-index: 60;
box-shadow: 0px 3px 8px rgba(50, 50, 50, 0.35);
/* Override for Monobook */
text-align: left;
}
.mw-echo-overlay-pokey {
/* @embed */
background-image: url('PokeyNorth.png');
background-repeat: no-repeat;
width: 21px;
height: 11px;
position: absolute;
z-index: 61;
top: 21px;
left: -9px;
}
#p-personal .mw-echo-overlay ul {
margin: 0;
padding: 0;
overflow: auto;
/* Override for Monobook */
text-align: left;
}
#p-personal .mw-echo-overlay li.mw-echo-notification {
background-color: #F0F0F0;
display: block;
float: none;
border-bottom: 1px solid #DDDDDD;
padding: 15px 40px 10px 10px;
margin: 0;
white-space: normal;
font-size: 13px;
line-height: 16px;
}
#p-personal .mw-echo-overlay li.mw-echo-notification:hover {
background-color: #F8F8F8;
}
#p-personal .mw-echo-overlay li.mw-echo-notification.mw-echo-unread,
#p-personal .mw-echo-overlay li.mw-echo-notification.mw-echo-unread:hover {
background-color: white;
}
#p-personal .mw-echo-overlay li.mw-echo-notification:last-child {
border-bottom: none;
}
.mw-echo-overlay-title {
/*border-bottom: 1px solid #A7D7F9;*/
font-size: 13px;
line-height: 15px;
height: 15px;
padding: 15px 15px 15px 28px;
border-bottom: 1px solid #DDDDDD;
font-weight: bold;
position: relative;
}
#mw-echo-overlay-footer {
padding: 0px;
border-top: 1px solid #DDDDDD;
}
#mw-echo-overlay-link {
display: block;
clear: left;
float: left;
padding: 15px 15px 15px 60px;
width: 150px;
min-height: 14px;
font-size: 13px;
/* @embed */
background-image: url(../icons/NotificationsPage-ltr.png);
background-repeat: no-repeat;
background-position: 17% 50%;
}
#mw-echo-overlay-pref-link {
display: block;
float: left;
width: 174px;
min-height: 14px;
font-size: 13px;
padding: 15px 15px 15px 35px;
border-left: 1px solid #DDDDDD;
/* @embed */
background-image: url(../icons/Settings.png);
background-repeat: no-repeat;
background-position: 5% 50%;
}
#pt-notifications {
position: relative;
}
#pt-notifications .mw-badge {
margin-left: 3px;
}
#pt-notifications a.mw-echo-short-link .mw-badge {
margin-left: -5px;
}
.mw-echo-overlay-none {
font-size: 13px;
border-bottom: 1px solid #DDDDDD;
padding: 15px 15px 10px 60px;
}
#mw-echo-mark-read-button {
position: absolute;
bottom: 12px;
right: 15px;
padding: 1px 8px;
font-size: 11px;
line-height: 15px;
font-weight: normal;
}