mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo
synced 2024-11-30 18:45:07 +00:00
Remove badgeicon module, use OOUI icon instead.
Now that OOUI's "alerts" icon pack includes all the icons we need, we can use it and get rid of the badgeicons module. Bug: T139779 Change-Id: I8218530ed2cdd2d81c1fc24509f36ea2b6742bd9
This commit is contained in:
shivanshbindal9
parent
2256c03253
commit
c86a1a5cf3
|
|
@ -386,12 +386,6 @@
|
|||
"desktop",
|
||||
"mobile"
|
||||
]
|
||||
},
|
||||
"ext.echo.badgeicons": {
|
||||
"class": "ResourceLoaderImageModule",
|
||||
"data": "icons/badgeicons.json",
|
||||
"selectorWithoutVariant": ".oo-ui-icon-{name}",
|
||||
"selectorWithVariant": ".oo-ui-image-{variant}.oo-ui-icon-{name}"
|
||||
}
|
||||
},
|
||||
"ResourceFileModulePaths": {
|
||||
|
|
|
|||
|
|
@ -864,7 +864,7 @@ class EchoHooks {
|
|||
// Load the styles for the Notifications badge
|
||||
$out->addModuleStyles( [
|
||||
'ext.echo.styles.badge',
|
||||
'ext.echo.badgeicons'
|
||||
'oojs-ui.styles.icons-alerts'
|
||||
] );
|
||||
}
|
||||
|
||||
|
|
@ -998,8 +998,8 @@ class EchoHooks {
|
|||
$sk->getOutput()->setupOOUI(
|
||||
strtolower( $sk->getSkinName() ), $sk->getOutput()->getLanguage()->getDir() );
|
||||
|
||||
$msgLinkClasses = [ "mw-echo-notifications-badge", "mw-echo-notification-badge-nojs" ];
|
||||
$alertLinkClasses = [ "mw-echo-notifications-badge", "mw-echo-notification-badge-nojs" ];
|
||||
$msgLinkClasses = [ "mw-echo-notifications-badge", "mw-echo-notification-badge-nojs","oo-ui-icon-tray" ];
|
||||
$alertLinkClasses = [ "mw-echo-notifications-badge", "mw-echo-notification-badge-nojs", "oo-ui-icon-bell" ];
|
||||
|
||||
$hasUnseen = false;
|
||||
if (
|
||||
|
|
|
|||
|
|
@ -234,8 +234,8 @@ class SpecialNotifications extends SpecialPage {
|
|||
$out->addModuleStyles( [
|
||||
'ext.echo.styles.notifications',
|
||||
'ext.echo.styles.special',
|
||||
// We already load badgeicons in the BeforePageDisplay hook, but not for minerva
|
||||
'ext.echo.badgeicons'
|
||||
// We already load OOUI icons in the BeforePageDisplay hook, but not for minerva
|
||||
'oojs-ui.styles.icons-alerts'
|
||||
] );
|
||||
|
||||
// Log visit
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
{
|
||||
"variants": {
|
||||
"invert": {
|
||||
"color": "#FFFFFF"
|
||||
}
|
||||
},
|
||||
"images": {
|
||||
"bell": {
|
||||
"file": "icons/bell.svg"
|
||||
},
|
||||
"tray": {
|
||||
"file": "icons/tray.svg"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
||||
<title>
|
||||
bell
|
||||
</title>
|
||||
<path d="M16 7a5.38 5.38 0 0 0-4.46-4.85C11.6 1.46 11.53 0 10 0S8.4 1.46 8.46 2.15A5.38 5.38 0 0 0 4 7v6l-2 2v1h16v-1l-2-2zm-6 13a3 3 0 0 0 3-3H7a3 3 0 0 0 3 3z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 321 B |
|
|
@ -1,7 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
||||
<title>
|
||||
tray
|
||||
</title>
|
||||
<path d="M17 1H3a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2zm0 12h-4l-1 2H8l-1-2H3V3h14z"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 270 B |
|
|
@ -12,12 +12,14 @@
|
|||
height: 20px;
|
||||
margin: 0 2px;
|
||||
// Hide the text, but keep accessible for screen-readers
|
||||
// Later we put the icons back onscreen with an opposite offset
|
||||
top: -@badge-offscreen-offset - 5px;
|
||||
// Later we put the counter back onscreen with a zero text-indent
|
||||
top: -5px;
|
||||
text-indent: -9999px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
line-height: normal;
|
||||
.box-sizing( border-box );
|
||||
opacity: 0.87;
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
|
|
@ -30,28 +32,14 @@
|
|||
opacity: 0.4;
|
||||
}
|
||||
|
||||
// Background icon
|
||||
&:before {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
opacity: 0.87;
|
||||
content: '';
|
||||
background-repeat: no-repeat;
|
||||
// Bring it back onscreen
|
||||
top: @badge-offscreen-offset;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
// Counter
|
||||
&:after {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
// Bring it back onscreen
|
||||
top: @badge-offscreen-offset + 9px;
|
||||
top: 9px;
|
||||
text-indent: 0;
|
||||
left: 55%;
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
|
|
@ -72,9 +60,7 @@
|
|||
}
|
||||
|
||||
&.mw-echo-notifications-badge-all-read {
|
||||
&:before {
|
||||
opacity: 0.51;
|
||||
}
|
||||
opacity: 0.51;
|
||||
|
||||
&:after {
|
||||
visibility: hidden;
|
||||
|
|
@ -82,20 +68,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
#pt-notifications-alert & {
|
||||
&:before {
|
||||
/* @embed */
|
||||
background-image: url( ../icons/bell.svg );
|
||||
}
|
||||
}
|
||||
|
||||
#pt-notifications-notice & {
|
||||
&:before {
|
||||
/* @embed */
|
||||
background-image: url( ../icons/tray.svg );
|
||||
}
|
||||
}
|
||||
|
||||
&.oo-ui-flaggedElement-unseen,
|
||||
&.mw-echo-unseen-notifications {
|
||||
#pt-notifications-alert &:after {
|
||||
|
|
|
|||
|
|
@ -35,6 +35,13 @@
|
|||
if ( config.href !== undefined && OO.ui.isSafeUrl( config.href ) ) {
|
||||
this.$element.attr( 'href', config.href );
|
||||
}
|
||||
if ( this.type === 'alert' ) {
|
||||
this.$element
|
||||
.addClass( 'oo-ui-icon-bell' );
|
||||
} else {
|
||||
this.$element
|
||||
.addClass( 'oo-ui-icon-tray' );
|
||||
}
|
||||
};
|
||||
|
||||
OO.inheritClass( mw.echo.ui.BadgeLinkWidget, OO.ui.Widget );
|
||||
|
|
|
|||
Loading…
Reference in a new issue