mediawiki-extensions-Echo/modules/overlay/ext.echo.overlay.css
m4tx fb438a1a17 Prevent "Mark as read" and title-overflow text from overlapping
If the echo-overlay-title-overflow text is too long, it's wrapped into multiple lines now.

Bug: 55919
Change-Id: Ib1d252ab26be7d73cbf71c6fb19d84b80d8d30c8
2013-11-30 01:53:59 +01:00

169 lines
3.5 KiB
CSS

.mw-echo-overlay {
position: absolute;
top: 30px;
left: -200px;
border: 1px solid silver;
background-color: #fff;
width: 450px;
min-height: 2em;
padding: 0;
color: #6D6D6D;
z-index: 100;
box-shadow: 0px 3px 8px rgba(50, 50, 50, 0.35);
}
.mw-echo-overlay-pokey {
/* @embed */
background-image: url('PokeyNorth.png');
background-repeat: no-repeat;
width: 21px;
height: 11px;
position: absolute;
z-index: 101;
top: 20px;
left: -5px;
}
#p-personal .mw-echo-overlay ul {
margin: 0;
padding: 0;
overflow: auto;
}
#p-personal .mw-echo-overlay li.mw-echo-notification {
display: block;
float: none;
margin: 0;
padding: 0;
}
#p-personal .mw-echo-overlay li.mw-echo-notification .mw-echo-notification-wrapper {
display: block;
background-color: #F1F1F1;
border-bottom: 1px solid #DDDDDD;
padding: 15px 40px 10px 10px;
white-space: normal;
font-size: 13px;
line-height: 16px;
/* Suppress standard links styles */
color: inherit;
text-decoration: inherit;
}
#p-personal .mw-echo-overlay li.mw-echo-notification:hover .mw-echo-notification-wrapper {
background-color: #F9F9F9;
}
#p-personal .mw-echo-overlay li.mw-echo-notification.mw-echo-unread .mw-echo-notification-wrapper {
background-color: white;
}
#p-personal .mw-echo-overlay li.mw-echo-notification.mw-echo-unread:hover .mw-echo-notification-wrapper {
background-color: #F9F9F9;
}
#p-personal .mw-echo-overlay li.mw-echo-notification:last-child .mw-echo-notification-wrapper {
border-bottom: none;
}
#p-personal .mw-echo-title a {
font-weight: bold;
}
#p-personal .mw-echo-overlay a.mw-echo-grey-link {
color: #6D6D6D;
}
.mw-echo-notification-primary-link {
display: none;
}
.mw-echo-overlay-title {
/*border-bottom: 1px solid #A7D7F9;*/
font-size: 13px;
line-height: 15px;
padding: 15px 15px 15px 28px;
border-bottom: 1px solid #DDDDDD;
}
#mw-echo-overlay-title-text {
display: inline;
zoom: 1;
white-space: normal;
}
#mw-echo-overlay-moreinfo-link {
display: inline-block;
margin: 0px 2px -1px 4px;
height: 13px;
width: 13px;
/* @embed */
background-image: url(Help.png);
background-repeat: no-repeat;
background-position: 0 0;
filter: alpha(opacity=50);
opacity: 0.5;
}
#mw-echo-overlay-moreinfo-link:hover {
filter: alpha(opacity=100);
opacity: 1.0;
}
#mw-echo-overlay-footer {
padding: 0px;
border-top: 1px solid #DDDDDD;
display: table;
}
#mw-echo-overlay-footer a {
float: none;
display: table-cell;
}
#mw-echo-overlay-link {
display: block;
clear: left;
float: left;
padding: 15px 15px 15px 45px;
/* 149px instead of 150px due to Chrome rounding bug (bug 47897) */
width: 149px;
min-height: 14px;
font-size: 13px;
font-weight: bold;
/* @embed */
background: url(../icons/NotificationsPage-ltr.png) no-repeat 20px 15px !important;
white-space: normal;
}
#mw-echo-overlay-link:hover {
text-decoration: none;
}
#mw-echo-overlay-pref-link {
display: block;
float: left;
width: 174px;
min-height: 14px;
font-size: 13px;
font-weight: bold;
padding: 15px 15px 15px 45px;
border-left: 1px solid #DDDDDD;
/* @embed */
background: url(../icons/Settings.png) no-repeat 20px 15px !important;
white-space: normal;
}
#mw-echo-overlay-pref-link:hover {
text-decoration: none;
}
#pt-notifications {
position: relative;
}
.mw-echo-overlay-none {
font-size: 13px;
border-bottom: 1px solid #DDDDDD;
padding: 15px 15px 10px 60px;
}
#mw-echo-mark-read-button {
float: right;
margin: -1px 0 0 10px;
padding: 1px 8px;
font-size: 11px;
line-height: 15px;
font-weight: normal;
}
#mw-echo-overlay-feedback-link {
position: absolute;
bottom: 12px;
right: 15px;
}