MonoBook supports two modes - one that is responsive and one that
is not. To do this it adds 3 modules. These can be reduced to 1
module by loading all the code and adding client side checks to
determine whether to use it.
The skin--responsive class is added by core for responsive skins so
can be used to make that check.
This does lead to additional download for all users (particularly
the addition of oojs-ui.styles.icons-alerts) but given the default
behaviour is to load these, and non-responsive skin requires an opt
in I don't see this as a problem.
Thanks to gzip the increase in render blocking styles is minimal:
Before:
skins.monobook.styles: 15.21KB
skins.monobook.responsive: 16.14KB
After:
skins.monobook.styles: 16.63KB
See bug for QA plan.
Bug: T285492
Change-Id: I76bb644145539c8ec0220704c8fe9a78a4819c03
If the page was long enough to have a vertical scrollbar, the check
for `$( window ).width()` would be incorrect because of the width of
the scrollbar itself. The correct value is `$( window ).outerWidth()`.
But rather than deal with that, we can instead use the API
specifically for matching media queries [1], then copy-paste the
media query from CSS and not have to think about it at all!
[1] https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia
Bug: T227916
Change-Id: I79478040620391f5391b10aee52134fde0b88adf
When the icons are clicked for the first time, they are replaced with
a JS interface by Echo code, so don't cache them in a long-lived variable.
Otherwise if the user clicks one of the notification icons, then
resizes the browser to a mobile width, and then resizes it back, we
would insert duplicate Echo icons.
Also rename the temporary variable per conventions.
Bug: T227916
Change-Id: I08f2e3d2e293d727ac4492d1fb6fe2c7c65df4ad
Should avoid more of the issues with unwanted appearance of mobile
layouts. Cutoff results in layout switch when sidebar becomes ~a
third of the total window width.
bug: T196213
Change-Id: I9b8baee5fe53316128f864e732c86750b4e5470e
* Reorder ULS and Echo links
* Rename conditional module load hook to be more generic, and add
ULS module
* Remove .active bolding from dropdown
Change-Id: I7e746e7c5af8ffd7c4ca06742ab1fe6bc94ba531
Have echo just show the numbers instead of the badges, and add a
text link to special:notifications in the dropdown, as opposed to
entirely reimplementing the flyout layout
Change-Id: I072dbc2b7bf70b6675469e09e3beb3927e06d0f7