Commit graph

70 commits

Author SHA1 Message Date
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
Moriel Schottlender dbefd3b6f0 Specify firstHeading rule for .mw-special-Notifications only
The rule to make the firstHeading limited in height should only
apply to the design of the Special:Notifications page, and not
everywhere on MW.

Bug: T111628
Change-Id: I6636ed7f4ad0ccc7bbf83ace51dda62d09e09a5c
2015-09-06 22:05:34 -07:00
Moriel Schottlender 311c3aad8f Restore echo.alert styles
Change-Id: I079d59b9d9dfea5b53dc2fb73d0a054ba3d7e270
2015-09-04 16:36:01 -07:00
Moriel Schottlender 1ac72cc01a Split alerts and messages in Echo
Split the notifications into 'alert' and 'message' badget with two
different flyouts. Also clean up styling and module behavior.

** Depends on ooui change Id4bbe14ba0bf6c for footers in popups.
** Depends on ooui change Ie93e4d6ed5637c for fixing a bug in
   inverted icons.

** MobileFrontend must also be updated to support the new modules
   in this patch  I168f485d6e54cb4067

In this change:
* Split notifcations into alert and messages and display those in
  two different badges.
* Create two separate flyout/popups for each category with their
  notifications.
* Create a view-model to control notification state and emit events
  for both the popup and the badge to intercept and react to.
* Clean up module load and distribution:
  * Create an ext.echo.ui module for javascript-ui support and ooui
    widgets.
  * Create an ext.echo.nojs module that unifies all base classes that
    are needed for both nojs and js support, that the js version
    builds upon.
  * Create a separate ext.echo.logger module as a singleton that can
    be called to perform all logging.
* Clean up style uses
  * Move the special page LESS file into nojs module so all styles
    load properly even in nojs mode.
  * Transfer some of the styling from JS to LESS for consistency.
  * Make the 'read more' button load already with the styles it
    needs to look like a button, since its behavior is similar in
    nojs and js vesions, but before its classes were applied only
    by the js, making it inconsistent and also making its appearance
    'jump' from a link to a button.
* Delete and clean up all old and unused files.
* Moved 'Help.png' icon from modules/overlay to modules/icons for
  later use.

Bug: T108190
Change-Id: I55f440ed9f64c46817f620328a6bb522d44c9ca9
2015-09-02 15:36:37 -07:00