Commit graph

105 commits

Author SHA1 Message Date
Roan Kattouw 22caa786c1 Follow-up eed48aa7: remove unnecessary z-index
This z-index rule isn't needed for the floating toolbar, and it
causes the notificationInboxWidget to be on top of MobileFrontend's
semi-transparent cloaking overlay, which makes it look weird.

Change-Id: Ie9d10e4193d15b72ce0199ff9b4e45742afec132
2016-12-09 15:28:14 -08:00
Kavitha Muthu 22389cf69b Add shadow to the notifications top toolbar
Bug: T140964
Change-Id: I5d795bc9c6601d874dfd58010399832b2727b811
2016-11-03 17:08:55 -07:00
Volker E 33655c75e7 Follow overhauled color palette
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
2016-11-01 22:31:28 +00:00
Kavitha Muthu cc2189f009 Remove notifications bottom controls
Bug: T140964
Change-Id: I5c1a07161ab75de0537c002785da89ebeadc508a
2016-10-13 14:16:46 -07:00
jenkins-bot 7441dcc3d2 Merge "ToggleReadCircleButtonWidget: Make circle perfectly round and align color" 2016-10-07 21:06:34 +00:00
Volker E 675d454bad build: Extend stylelint to further rules
Extending stylelint to include further general rules
and remove obsolete .csslintrc file.

Change-Id: I6957cc3731c39f495e985c9dbd40363102e2e6f0
2016-10-05 14:52:29 -07:00
Volker E 6d2e560c1e Introduce stylelint
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
2016-10-04 18:15:02 -07:00
Roan Kattouw 4e5d2a8aa6 Use colors for pressed/selected options in the Special:Notifications sidebar
Unfortunately there's no generic support for using colors for icons in
OOUI yet, so we have to copy what OutlineOptionWidget does and
override setPressed()/setSelected() to add/clear the progressive flag.
Also reintroducing colors for text which are aligned with icons on
the different states and use transitions.

Change-Id: I07cf4011d28c1db4eefb451367e29c271b5efaeb
2016-10-04 17:21:26 -07:00
jenkins-bot f107dbd371 Merge "Reintroduce highlighted and selected background colors in the Special:Notifications sidebar" 2016-10-04 22:45:11 +00:00
jenkins-bot 717b53dbe4 Merge "Make notifications top toolbar controls sticky" 2016-10-04 22:37:27 +00:00
Volker E c4ea2c4af8 Reintroduce highlighted and selected background colors in the Special:Notifications sidebar
After Id1312fee5bb of OOjs UI got merged, we have to reintroduce
`highlighted` and `selected` states background color manually as
it caused issues on simple OptionWidgets.

Change-Id: I3fe7a4d2577bd1bc0fd258bc977b3539e268a84e
2016-10-04 22:34:22 +00:00
Kavitha Muthu eed48aa7fe Make notifications top toolbar controls sticky
Bug: T140964
Change-Id: I483c91344918f602da3280b9f8ad7e966bf55596
2016-10-04 22:27:49 +00:00
Volker E 819545ed7e Add box-sizing mixin
Replacing standard `box-sizing` with MediaWiki's Less mixin, which also
features prefixed properties for older browsers like Firefox 28 and below.

Change-Id: Iafb88b192045fb7df6bbe6954a166a198d04c5cf
2016-10-03 13:21:54 -07:00
Volker E a1ae72a03c ToggleReadCircleButtonWidget: Make circle perfectly round and align color
Due to pixel rounding errors when relying on `em` as base size unit,
the circle isn't always perfectly round and as a result /not/ a circle.
Adding `min-width` and `min-height` ensures the intended layout similar
to Ie61e7303e446 in OOjs UI's ToggleSwitchWidget.
Also aligning `:hover` unread color to OOjs UI progressive button's
`:hover`.

Bug: T141504
Change-Id: Idf130947e8e61a68819e3ac9ba3cb1e105e65370
2016-10-03 19:19:38 +00:00
jenkins-bot c01b053025 Merge "Remove js-truncation of descriptions in Special:Notifications desktop" 2016-09-10 02:49:02 +00:00
Moriel Schottlender a834420533 Remove js-truncation of descriptions in Special:Notifications desktop
In order for the special page to be responsive, the descriptions can't
be truncated in the JS. If they are, they take a bigger portion
of the screen, sometimes going out of its confines.

The popup should still truncate descriptions.

Change-Id: I533f29c00482f6cfbb7b1c9c7417715e3c5809bf
2016-09-09 12:44:03 -07:00
jenkins-bot 39720f926b Merge "Break more rules in break-word so long words can wrap in notifications" 2016-09-08 00:06:47 +00:00
Moriel Schottlender ed453c1026 Hide separator when bundled item is expanded
Bug: T142260
Change-Id: I5ea12d426c29a4b82bdfa5453d14841800b7a108
2016-09-07 16:44:03 -07:00
Moriel Schottlender 22d83568f7 Break more rules in break-word so long words can wrap in notifications
Change-Id: Ib0cde96438175f2bc136bd89d4a2717785cecba0
2016-09-07 16:32:37 -07:00
jenkins-bot 32e8a8c845 Merge "Add confirmation popup widget" 2016-09-02 23:28:09 +00:00
jenkins-bot 4ca6513039 Merge "Hide xwiki widget separator when widget is expanded" 2016-09-02 19:56:22 +00:00
Moriel Schottlender df38f142ef Followup I3daae156d: Don't truncate body text for small screens
We already took away the truncation of header text, the body should
follow for narrow screens and wrap, instead of using the ellipses
truncation.

Change-Id: I3504599044e1c94ccec55c420d455b9370dae474
2016-09-02 11:27:56 -07:00
Ed Sanders b54576564b Fix notification page width responsiveness issues
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
2016-09-01 18:02:06 -07:00
Moriel Schottlender 4047f2f2c1 Hide xwiki widget separator when widget is expanded
Bug: T142260
Change-Id: I24fbd6bd2eba3c7b2d16cb1e46130cfd4a981fb3
2016-09-01 14:30:49 -07:00
Moriel Schottlender f449c68780 Add confirmation popup widget
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
2016-08-31 14:47:59 -07:00
jenkins-bot 4c82613936 Merge "Fix sidebar counts Special:Notifications in monobook" 2016-08-31 02:41:05 +00:00
jenkins-bot 8c03fbb0e4 Merge "Adjust Special:Notifications width for small screens" 2016-08-31 02:41:03 +00:00
jenkins-bot ac62a9361c Merge "Fix line-height for notification item text" 2016-08-31 02:41:02 +00:00
Moriel Schottlender a4aa79fa50 Add the best CSS rule to notifications: word-break: break-word;
Add word-break: break-word; so we make sure even long names or titles
without spaces are broken/wrapped where they need to.

Bug: T142662
Change-Id: I166e834495972ec49eb98e301ab9be85f40f5a5e
2016-08-30 17:23:32 -07:00
Moriel Schottlender 311150a92d Adjust Special:Notifications width for small screens
Bug: T141949
Change-Id: Id0987ea9e7929777c887ceea6757ec00b3bf18ae
2016-08-30 15:29:22 -07:00
Moriel Schottlender 6e0076410c Fix sidebar counts Special:Notifications in monobook
Bug: T143845
Change-Id: Idf5922876f55aca6ed5d6800d0ff5066306c5fb1
2016-08-30 15:23:32 -07:00
Moriel Schottlender 07dde93247 Fix line-height for notification item text
Bug: T140523
Change-Id: I6a1a174ed70324da50970ecfb35ebba21ea703dd
2016-08-30 15:12:07 -07:00
Roan Kattouw 191a3309eb Fix font size for notifications dotdotdot menu in Monobook
Change-Id: Ie75ad192204a652885a82b0021340410b69864f4
2016-08-29 15:22:44 -07:00
Roan Kattouw 68a344d59a Override white background on hover for links in Monobook
p-personal links have a white background on hover, and links
inside the notifications popup were inheriting that CSS rule.

Bug: T144063
Change-Id: I3868e418ab8cce8e5ff6f7cc10e042907cb1e8df
2016-08-29 14:41:54 -07:00
jenkins-bot 4e99a5095f Merge "Add dynamic secondary actions to notification items" 2016-08-23 17:43:08 +00:00
Moriel Schottlender 480ce92bd8 Add dynamic secondary actions to notification items
Allow extensions to add dynamic actions that perform some
API request and display a confirmation message.

Bug: T132975
Change-Id: Ib16d57c3f1a11a9749564c6e2112bf1ca32c55e8
2016-08-22 16:04:48 -07:00
jenkins-bot d51d1ebc23 Merge "Make Monobook use the same badge color scheme as Vector" 2016-08-19 21:58:30 +00:00
jenkins-bot 3fe453cd78 Merge "Make dotdotdot menu not be extremely wide" 2016-08-19 21:58:29 +00:00
Roan Kattouw b9b1363ca6 Make dotdotdot menu not be extremely wide
Work around new styles introduced in oojs-ui in I77cd5212c.

Bonus: remove useless styles targeting the dotdotdot popup
in NotificationItemWidget.less: it's not even a popupWidget
any more and it's located in an overlay anyway, so these
styles didn't do anything.

Change-Id: Ifb16b7bb0b01c1eb2551ba4c173042cc759e9b02
2016-08-19 14:48:29 -07:00
Moriel Schottlender 0b28b4c67a Mobile action menu should stick to bottom of screen
Just like we do in the mobile popup, the menu should be accessible
in mobile clicks/taps by being "stuck" at the bottom of the screen.

Bug: T142013
Change-Id: I730216e717c2a02ad98bbcc28f66b13c1cbe29ed
2016-08-18 13:12:22 -07:00
jenkins-bot 8f7edc6901 Merge "Revert "Dim the title of current wiki if it has 0 notifications"" 2016-08-17 23:01:15 +00:00
Catrope 0e52416fcb Revert "Dim the title of current wiki if it has 0 notifications"
We decided we didn't want this behavior after all.

This reverts commit eadaac1c84.

Bug: T139646
Change-Id: Ib71f8000a59e66968c0fa161e3ab59b9ebdb3b1a
2016-08-17 22:51:28 +00:00
Roan Kattouw f9ac794133 Make Monobook use the same badge color scheme as Vector
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
2016-08-16 17:38:46 -07:00
Roan Kattouw 3cbddb546b Make excerpts in bundles not italic, but still grey
Bug: T141034
Change-Id: I34c376a97e222257ae660149e0fb8172128eb8c0
2016-08-16 11:48:01 -07:00
Roan Kattouw a4caed52cd Make footer notice link blue in Monobook
We have to override a CSS rule that tries to make all <a>s blue,
but not override it so powerfully that the real link in the footer
notice isn't blue.

Change-Id: I5a91419aab7cf6d6fe10c8e707168b52c2451cd8
2016-08-15 11:13:01 -07:00
jenkins-bot 515d38fb85 Merge "Follow-up de795bdbc5: actually hide badge number in Monobook" 2016-08-08 18:39:36 +00:00
Roan Kattouw a27d748f6a Follow-up de795bdbc5: actually hide badge number in Monobook
The color: transparent; hack was being overridden by a color rule
that's only in effect after the popup is opened.

Change-Id: I2f415619603ccadb625ed2482c25fde78765fee4
2016-08-06 01:00:33 +00:00
Moriel Schottlender 9468ff0e1d Don't truncate bundled item content in mobile view
Bug: T140523
Change-Id: I8223d5596825bdd80c3c961576b46c7f2d4654cd
2016-08-04 13:03:35 -07:00
Moriel Schottlender b5c0b2458d Align popup to center of the new badges
Bug: T141677
Change-Id: I24c1a12f325ca6a432d6fe9cc5635fbde10b1685
2016-08-01 13:57:40 -07: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