Due to using ooui, and a lot of the styles being a lot more generic
in general these days for wider skin support, most of the skin
styles still included with Echo are no longer necessary or may even
be actively breaking things.
For Modern, basically just remove everything; nothing here seems to
apply anymore. Also frees us up to just fix the badge positioning
in the skin itself, and leave future maintenance up to the skin
maintainers, if anyone cares.
Bug: T226684
Change-Id: Id28bbc01b3b344dfeb39be1380a64c1368924289
A positive text-indent causes horizontal scrollbars, so just hide the
screenreader text by making it transparent, and accept that we're going
to have the hover tooltip issue (T161302) in Monobook.
Bug: T226594
Change-Id: I6cb9ec146c2b469cbfb1fdc57937794d237e46db
In c86a1a5cf, the structure of the badge was changed, and the hack for
hiding the screenreader text in the badge was updated accordingly.
However, the Monobook styles were not updated, and this caused the badge
icons to be positioned off-screen.
Update the Monobook styles for the new badge structure, and use a
different hack for hiding the screenreader text because the one used for
other skins doesn't work in Monobook.
Bug: T226503
Change-Id: I190d2719addfbe50a7108193848bf23eef54bccf
Provide visual feedback when focus is set on notification badges.
Also removing outdated `-moz-outline-style` property, which is applied
only in Firefox <= 3.6.
Bug: T186553
Change-Id: Ia523be0f74beb8fc52f8f04a9a7f59d88c7d2082
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
Colours were previously defined only in the monobook- and vector-specific
styles, but with the same styles in each, and appear to work consistently
accross all tested skins (modern, timeless, cologneblue, anisa,
hassomecolours...). Given the UX importance of these colours, better to
apply them as the default for all skins and leave it to any others for
which this doesn't work to resolve any issues on their end.
bug: T181142
Change-Id: Idc22881d6c51aa12adc9a053ce08adfdf0fad2b0
Selector was set on the element's class, not the icon carrying
pseudo class, resulting in a hard to predict
double opacity application. Also changing default opacity to
WikimediaUI Base values.
Bug: T207542
Change-Id: I1f45e721ee30acfd6261edcbc9d81cf92c7217a3
Currently, the 'Mark all as read' button exists only for JS users.
This patch adds the button for no-JS users as well.
Bug: T96061
Change-Id: I1a62c56306597209540ffd694c8fb7b2a92885c9
Just show the textual "Alerts (1)" and "Notices (1)".
Updated NotificationBadgeWidget to use that internally as label,
same as the PHP-generated list item does after d4d325e7.
Bug: T141944
Change-Id: I468c67b0866530e21c9af32cd02816075a3693a1
Looks like we're hitting an edge case where positioning with negative
offsets inside an inline-block element results in incorrect rendering.
We're accidentally rendering an invisible overlay over nearly the
entire page. Twiddle the styles until we no longer hit that case.
Minimal example of the IE 11 bug: https://jsfiddle.net/50v6m0kb/3/
Bug: T161869
Change-Id: Id4b6ccc1ec6a11b455d6ab45c5aaa0e8544385f7
Move unread counter to the left (or right, in RTL)
when it's longuer than 2 characters so as to
have harmonious spacing between the counters and
the next link on the toolbar.
Bug: T142454
Change-Id: Ib8aa673cf9e60ade80490ea0eccb7453d3747cd0
Replacing colors with ones from the overhauled WCAG 2.0 level AA
compliant color palette https://phabricator.wikimedia.org/M82
Applying Less variables where possible for better flexibility
in future design maintenance.
Also introducing some variables from WikimediaUI Base.
Bug: T147365
Depends-on: I16bdfbdada252ee27d5a0de11e0930347315b699
Change-Id: Ic05ed15b44d86752c686d80efc4f2ed2a1e71b41
Introducing stylelint with configuration rules compliant to
Wikimedia CSS Coding Standards 'stylelint-config-wikimedia', nullifying
some for now and making majority pass.
Change-Id: I2c4acee41c9b56d9b00e2a2c5b7ab0ab5de454ce
Have the page hide the sidebar at 982px, when there is
not enough room for both (and when vector switches down to SD).
Make inbox responsive when resizing.
Change-Id: I3daae156d1ebb0619090d466caa5138d0d98e937
Mainly used for mobile actions, and should be appended to the
overlay - this widget assumes it should appear and then fade out
with some confirmation message.
Also moved 'doubleCheck' icon to the ooui definitions, including
an inverted icon that is necessary for this widget.
Bug: T141404
Change-Id: I67a44962eaee6b7bd8cac26dcb5277177fa5d224
In the unseen notifications case, Monobook used badges with
black text on a light red/blue, even though the text
is white on grey in the non-unseen case. Change the unseen style
to white on dark red/blue like Vector, and also make the colors
exactly the same as Vector.
Change-Id: I9d2d1a2614ac1130e027fb952c9288588d25d495
Seems to be fixed by different changes, and now this change
is causing trouble, moving the badges up off-screen.
This reverts commit 0b7f8712a9.
Change-Id: Ia5a0a6b6be3698436a043aee111f251709c22f20
What this really does is:
* Change the forced width of the <a> to the width of the icon
(rather than 1.25x the width of the icon)
* Change the alignment of the :before from 40% to 50% so it
stays in the middle (1.25*40=50)
Change-Id: I0399a20fc84e59fcbcf69da509a4d8bfa9b54a08
It's a lot easier to set 'color' back to the desired value than 'font-size'.
As an amusing side-effect, the hidden text will appear when selected, and
it will be possible to copy it.
Change-Id: I7a7ef8e60f514743c9cb65bcef3ba4e869f5b7b7
I think everything works the same. Some older browsers (IE 10-11,
Opera 12) have funny issues with SVGs in 'content'.
.mw-echo-notifications-badge now has 'height: 24px', as it must be
at least as high as the background to display it. We no longer need
.oo-ui-popupWidget to have 'margin-top: 7px', that was a workaround
for the badge having smaller dimensions in CSS than in reality.
This also allows us to significantly reduce the amount of Monobook-
specific CSS, because we now use the background-image approach for
all skins.
Bug: T142042
Bug: T142248
Change-Id: Iaa22202dbd5b5eb7a9b1ef47d068e80764ed982f
A browser bug causes the badges to be pushed down by 1em in IE11
and below, but not in Edge. The only way I could find to work
around this was to add top:-1em; in IE browsers using CSS hacks.
Bug: T142053
Change-Id: If240f7281dd795085c003af524da294d5bf5ff76
Not sure why it's doing that, because the SVG has explicit 24x24
dimensions, but adding these (theoretically unnecessary) CSS rules helps.
In Chrome/FF (as well as more modern IE versions), this is a no-op.
Bug: T142042
Change-Id: Ibb293f453dc79de90690ab48f522e43d3e66b8e8
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