Commit graph

53 commits

Author SHA1 Message Date
jenkins-bot 6886c18c03 Merge "Revert "Hack around browser bug in IE breaking badge alignment in Monobook"" 2016-08-11 23:27:25 +00:00
Catrope 092c4c64fb Revert "Hack around browser bug in IE breaking badge alignment in Monobook"
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
2016-08-11 23:15:15 +00:00
Roan Kattouw 68479f7442 Reduce the amount of space between the badges a bit
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
2016-08-05 18:01:48 -07:00
Moriel Schottlender adab7f087b Fix top position of badges in monobook
Change-Id: Ie2638445d020baf1be79ac1689b446ac1abc2f63
2016-08-05 16:00:49 -07:00
jenkins-bot c9f48a80bb Merge "mw.echo.badge: Use 'color: transparent' rather than 'font-size: 0' to hide text" 2016-08-05 21:58:02 +00:00
jenkins-bot af3d0a4b0f Merge "mw.echo.badge: Use 'background-image' rather than 'content'" 2016-08-05 21:58:00 +00:00
jenkins-bot e86a21e1eb Merge "Hack around browser bug in IE breaking badge alignment in Monobook" 2016-08-05 21:53:03 +00:00
Bartosz Dziewoński de795bdbc5 mw.echo.badge: Use 'color: transparent' rather than 'font-size: 0' to hide text
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
2016-08-05 21:41:41 +00:00
Bartosz Dziewoński 3656c74fd1 mw.echo.badge: Use 'background-image' rather than 'content'
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
2016-08-05 14:34:08 -07:00
Roan Kattouw 300c64ae1f Don't use a smaller font size for the badge numbers in Monobook
Bug: T142149
Change-Id: I1456581625f405512f448c2793c194c5ba199302
2016-08-04 16:04:25 -07:00
Roan Kattouw 0b7f8712a9 Hack around browser bug in IE breaking badge alignment in Monobook
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
2016-08-03 17:08:58 -07:00
Roan Kattouw 59db7844e4 Prevent IE from rendering the badge SVGs ridiculously big
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
2016-08-03 15:18:21 -07:00
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
jenkins-bot d80e2a5896 Merge "Remove fixed width from notifications heading" 2016-07-30 00:29:39 +00:00
Ed Sanders 72a1f292cf Remove fixed width from notifications heading
Bug: T141627
Change-Id: I7828cf8289baf04718233e8f8f1670670669ecf3
2016-07-29 16:38:50 +01:00
Moriel Schottlender 9ab351352f Redo the notification badges
Bug: T115845
Bug: T140900
Depends-On: Ic666540d70de52f
Change-Id: I34e2736490319989a3a251a43fbe8080ab960b00
2016-07-27 11:51:05 -07:00
Moriel Schottlender 1dd3af10bb Adjust mobile view for the new settings cog menu
Now that we have the cog menu, it should be placed correctly in
mobile and the "preferences" link should be hidden.

Since MobileFrontend doesn't have the personal toolbar, and we
can't cheat by using jQuery and grabbing the url of preferences,
we have to get SpecialNotifications.php to output the urls
to a wg variable and reading it from there.

Bug: T115528
Change-Id: I6a69823d6f75c376c04e9a21d79916321e417178
2016-07-25 19:30:44 +00:00
Moriel Schottlender 4ac79a6253 Hide the 'preferences' link from Special:Notifications JS
In JS version, the preferences link is in the cog menu.

Bug: T115528
Bug: T141141
Change-Id: I18503f1deccf82c9f6580198570822e97f053f9b
2016-07-22 22:10:00 +00:00
jenkins-bot 7d29b6088e Merge "Make Special:Notifications responsive" 2016-07-21 21:07:56 +00:00
Moriel Schottlender 35a5384900 Change 'pt-notification-message' to 'pt-notification-notice'
And change all CSS and JS dependent calls/tags based on the new
tooltip message and ID of the personal tool <li> item.

Change-Id: I136fabe5710f90da10eb8d4afe92acdb77571eec
2016-07-21 11:19:17 -07:00
Moriel Schottlender 545d4e67ae Add a mark-all-read button and a settings menu to Special:Notifications
Add a global-wiki 'mark all as read' to the Special:Notifications page.
The 'mark all as read' will makr all notifications in the given
wiki. The context of the wiki changes when filters are chosen,
and so the message of the button changes as well.

Bug: T115528
Change-Id: Ibd9dcdf7072d6cbc1a268c18e558e6d0df28f929
2016-07-20 17:25:38 -07:00
Moriel Schottlender 8a69d86d18 Make Special:Notifications responsive
As a first step for mobile support, make the page responsive,
hide the sidebar, and slightly adjust button/title positions and
sizes so they fit in a small screen.

Bug: T140687
Change-Id: I98f264948a57924f6370a861381456ce9c82f8d8
2016-07-19 15:11:47 -07:00
Matthew Flaschen 188e8d7395 No-JS special page: One-click mark as read
Bug: T136361
Change-Id: I7896dbdf25d2c1624f97777f4c8d0af41b195ef0
Depends-On: Ic31f857c749d62a32cafae68dc3f1cbd86e1e382
2016-05-27 17:23:29 -07:00
jenkins-bot 95bea57983 Merge "Initial version of Special:Notifications Javascript page" 2016-05-27 21:34:44 +00:00
Moriel Schottlender 9262614ded Initial version of Special:Notifications Javascript page
Bug: T129176
Change-Id: I2f55358c16f78e234ec19154b944a4edebfbe639
2016-05-27 13:42:25 -07:00
matejsuchanek 38adb78619 Use native MediaWiki linking to help pages
There was quite a small link under the main title in Special:Notifications
which pointed to a related help page. Now the OutputPage::addHelpLink()
method is used which moves this link to the upper right corner and allows
configuring this on-wiki (instead of LocalSettings.php or so).

Bug: T101057
Change-Id: Ib4aecee8006b8d71bb3cd86f1d4ebdfee9080870
2016-05-27 20:40:41 +02:00
Stephane Bisson 52525249e6 Adjust styling for "Mark group as read"
Bug: T134204
Change-Id: Ia0486fa400be7e96ffc4e1ad47f952c17f40042c
2016-05-26 13:30:49 -07:00
Stephane Bisson c96bc7ec38 Pagination on no-js Special:Notifications
Bug: T129169
Change-Id: I48aff35352bbda7f8818d456284c5c7adb346bb1
2016-05-23 15:39:43 -07:00
Moriel Schottlender 8f5c718a4f Add 'mark section as read' to Special:Notifications
Allow marking notifications as read per 'section' (days) in the
Special:Notifications page.

Bug: T115528
Bug: T134204
Change-Id: I7324a2c693aa92b9327cf8ff98f125293d5fba10
2016-05-11 20:00:24 +00:00
Moriel Schottlender 15a44768f4 Add mark-as-read button to notifications in Special:Notifications
Bug: T115528
Change-Id: I54dba5f86d28a069659d66dede5b7ab9981213aa
2016-05-11 10:41:32 -07:00
Roan Kattouw 6c49d3edda Update OOUI hacks for I8987dade5ed
min-width and min-height are now set on icons. This breaks the ability
to scale icons down, so override these rules.

Change-Id: I6372f0fe17ccfd853bde497730c49cbcf9f89a41
2016-04-19 15:57:11 -07:00
Stephane Bisson 98d428df71 Increase space between notification header and body
Bug: T125968
Change-Id: Ifec5f819fa687637d7421fb062b7345621a83428
2016-02-15 15:56:59 -05:00
Stephane Bisson 779b7030d9 Truncate usernames, titles and excerpts in notifications
Bug: T121822
Change-Id: Ia0a52926133ab7e04d7d9c2a095ef8f9d0871a49
2016-01-29 07:04:23 -05:00
Roan Kattouw 88d6f01c33 Make notification body text lighter
Use #888 instead of #666 to match secondary link text
(which is #000 with 50% opacity), both in the flyout and
on the special page.

Bonus: use LESS variables for these colors.

Change-Id: Ifc1182a001e9b25f6ff7c213b6fcde3dc2f0acd2
2015-12-18 13:13:22 -08:00
jenkins-bot 7a68a05083 Merge "Prevent link color on hover for the body ("payload") as well as the header" 2015-11-20 23:39:37 +00:00
jenkins-bot acdcdb29f0 Merge "Remove styling for nonexistent mw-echo-title-heading class" 2015-11-20 23:38:58 +00:00
Moriel Schottlender 4bbaf77c2a Change the naming of 'notification option' to 'notification item' widgets
This is in preparation of adding more item models and widget types,
and in preparation of switching the notification widget away from being
a select widget.

Change-Id: I518fb3d80f4f67d677c21ca5593638269acfa544
2015-11-19 16:52:04 -08:00
Roan Kattouw c8d0115fd5 Prevent link color on hover for the body ("payload") as well as the header
Change-Id: Id221af75ed76122b03f741c184053e73bd2f4ee5
2015-11-18 20:10:40 -08:00
Roan Kattouw 8e46160210 Remove styling for nonexistent mw-echo-title-heading class
Change-Id: Ia1ce2889ec0e740d0fcc7d49809d5c64d24a696c
2015-11-18 20:07:53 -08:00
Ed Sanders 219b3d8b28 Separate skin specific styles and improve Monobook appearance
Bug: T112290
Change-Id: I1e73c92c69cf6df7c4d08b27a392f9c9bc19446f
2015-11-10 17:57:44 -08:00
Siebrand Mazeland 33126b69aa Update formatting
In preparation of Code Sniffer based updates.

Change-Id: Id5d43332b44a37665d57dc24ef8c432bc65b2f6a
2015-10-03 23:28:54 -04:00
Moriel Schottlender 16ddd5c7d7 Fix Echo popup alignment in RTL
Bug: T114184
Change-Id: I2b2b8c332efbcf0e646bf77f688433559da7b628
2015-09-29 16:05:31 -07:00
Moriel Schottlender 429b11148b Replace entire <li> element to produce button and popup separately
We need the button to remain a standalone <a> element so it preserves
the exact same styling as the output we're getting from the PHP. the
only way to do this is to create the widget as the entire <li> and then
replace the original.

Bug: T112218
Change-Id: Ib6fd4369d46cb7f37b14675d63bbce9950abcd48
2015-09-19 17:56:29 +02:00
Moriel Schottlender c5905962ab Only load ext.echo.ui if the user clicks the echo badge
There is no need to load the entire of Echo's ui module (especially
since that includes ooui widgets and their styles) on every page load.
There's only need to load the entire module if and when a user clicks
the Echo notification badge.

Also, make the echo.dm model accept an external fetchNotifications
promise so we can send the API request alongside loading the echo UI
and "feed" it into the DM for processing.

CSS adjusted to make the "jump" between the nojs and the js buttons
seem less jumpy.

Bug: T112401
Change-Id: I516e655ffd198511d694489a0702c5c713a5fd68
2015-09-15 17:11:46 -07:00
Roan Kattouw 0c5869c216 Use math to compute badge padding in nojs
More clearly indicates how those numbers get there, and fixes
a discrepancy of 0.02em.

Change-Id: Idbc33878953fda85185cada5550f99a1076b9036
2015-09-14 18:47:29 +02:00
Roan Kattouw b046a1062d Don't load oojs-ui.styles on every page
We don't really need it to render the no-JS version
of the notification badges (the only rule we were missing
was background-repeat: no-repeat;) and it significantly
increased the amount of render-blocking CSS.

This means we do need to call setupOOUI() ourselves
in order for our get_class( OOUI\Theme::singleton() ) hack
to keep working.

Bug: T112401
Change-Id: I148f8ac19dfe62cc84abe03e1a2ff00683d515c1
2015-09-14 12:38:44 +02:00
Pau Giner b6712be9a3 Reduce distance between notification badges
Notification badges are conceptually closer together than the rest of toolbar elements.
So it makes sense to move them closer visually too.

This is just a small CSS adjustment to compensate for the default margin
that items in the menu get. If there is a cleanner way to achieve the same,
feel free to refactor.

Bug: T108190
Change-Id: I06403f67c24f045c125c505dca2101f9eed79594
2015-09-09 11:36:18 -07:00
Moriel Schottlender 73e3ed3717 Add a tooltip to the notification badges
Since the nojs "base" version uses the automatic title creation
of the personal tools, the message keys were adjusted accordingly,
and the old unified message was removed.

Bug: T108190
Change-Id: I1f242f530aa68562aa4dc885156586c22c4df618
2015-09-08 14:03:34 -07:00
Moriel Schottlender 327466a2d3 Align notification badge higher on the personal navigation bar
Bug: T108190
Change-Id: Id25213689c2ec9a6031bd120020c0b5ebde6e14f
2015-09-07 16:32:57 -07:00
jenkins-bot 04edd414cf Merge "Specify firstHeading rule for .mw-special-Notifications only" 2015-09-07 05:22:01 +00:00