wikimedia/mediawiki-extensions-Echo
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo synced 2024-09-25 03:09:37 +00:00
Code Issues Packages Projects Releases Wiki Activity
mediawiki-extensions-Echo/modules/echo.variables.less

27 lines
550 B
Plaintext
Raw Normal View History

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-08-13 00:54:16 +00:00
@badge-padding: 0.12em;
@badge-icon-size: 1.1em;
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 16:18:03 +00:00
@badge-distance-adjustment: -0.4em;
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-08-13 00:54:16 +00:00
@notification-background-unseen: #dce8ff;
@notification-background-unread: white;
@notification-background-read: #f1f1f1;
Align popup footer buttons to take 50% width each The alignment of the buttons was done haphazadly before, using padding. This should be done better; we should calculate the buttons width to be 50% of the width of the popup. Since the popup accepts a width config, we know what its value is, and can calculate the proper width. The width was added to the variables.less file for continued use. * Added popupWidth config variable to the badge widget * Added OO.ui.ButtonGroupWidget to place the buttons in for consistency and styling * Added calculated width styles to both footer buttons * Added corrections for MonoBook Change-Id: Iad2c947da06241e9303cf1f35574177a0f602bbb
2015-09-09 20:18:52 +00:00
Increase contrast between header and body text in notifications Bug: T125964 Change-Id: Id597f10a624e8b4e92bfc1c1c8c79857f23b598c
2016-02-15 20:45:43 +00:00
@notification-text-color: #111;
@notification-body-color: #777;
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 18:56:59 +00:00
Adjust group bundle styles Bug: T128069 Change-Id: If1e5d9811f4569e93ab9ba3064699ce6a6d907f7
2016-02-26 22:27:14 +00:00
@bundle-group-padding: 0.7em;
Adjust layout for new notification panel designs Bug: T122646 Change-Id: I6cb6d121eb7e32737b1d73743061e1435e869c93
2016-01-13 03:36:47 +00:00
@notification-popup-width: 500px;
Add OOUI widgets for cross-wiki bundled notifications * Add the ability to use bundled expandable notification groups * Display bundled cross-wiki notifications following the design Bug: T115419 Bug: T115423 Bug: T115422 Change-Id: I8c3eba6d627c3f06d51d74fc9774e3fc2d02915d
2015-10-16 23:18:25 +00:00
@opacity-low: 0.5;
Organize items in bundles with CSS table layout This will make the "flat" positioning of the bundle items a lot more consistent and organized. Bug: T121933 Bug: T123762 Change-Id: I472fcc89e540f1a886168069c547c6dc7e5ce613
2015-12-22 23:16:32 +00:00
@opacity-mid: 0.8;
Styling changes to Special:Notifications headers and toolbar Bug: T136580 Bug: T136568 Change-Id: I1a7f08cca8884ada42eca50ba802b4d1e0b788e0
2016-05-31 00:37:52 +00:00
@specialpage-separation-unit: 0.7em;
Add a cross-wiki sidebar to the Special:Notifications page Add a sidebar with cross-wiki sources and pages of unread notifications. The filter allows the user to fetch notifications from a foreign source and specific pages if those exist. Bug: T129366 Change-Id: I57d827a47f80274d75364c2099a9624049a26834
2016-05-31 22:32:16 +00:00
@specialpage-sidebar-width: 20em;
@grey-light: #777;
@grey-medium: #555;
@grey-dark: #333;
@grey-darkest: #000;
@border-color: #ccc;
Reference in a new issue Copy permalink