mediawiki-extensions-Echo/modules/nojs/mw.echo.badge.monobook.less
Moriel Schottlender c1e7fc2208 Adjust notification badges for monobook
Make everything a little smaller, decrease spacing. In order to
make the icons smaller, we had to override the content: url(...)
into using background-image with sizing.

Bug: T141923
Change-Id: Icacb15871c824ae845acc937973fb230b05b489a
2016-08-02 16:41:33 -07:00

53 lines
1.1 KiB
Plaintext

@import '../echo.variables';
@import '../echo.variables.monobook';
/* We have to include the #pt-notifications selector due to monobook */
.mw-echo-notifications-badge {
#pt-notifications-notice &,
#pt-notifications-alert & {
width: 20px;
top: -7px;
&:before {
background-size: 16px 16px;
width: 16px;
height: 16px;
content: "";
}
&:after {
top: 5px;
// Font should be even smaller in monobook
font-size: 12px * 0.7;
}
}
#pt-notifications-notice &:before {
/* @embed */
background-image: url('../icons/tray.svg');
}
#pt-notifications-alert &:before {
/* @embed */
background-image: url('../icons/bell.svg');
}
&.oo-ui-flaggedElement-unseen,
&.mw-echo-unseen-notifications {
#pt-notifications-alert &:after {
background-color: @badge-counter-background-unseen-alert;
color: #000;
}
#pt-notifications-notice &:after {
background-color: @badge-counter-background-unseen-message;
color: #000;
}
}
}
#p-personal #pt-notifications-alert,
#p-personal #pt-notifications-notice {
display: inline-block;
}