Commit graph

67 commits

Author SHA1 Message Date
jdlrobson
ca0b4bed6a Simplify MonoBook link styles
* Link color comes from the elements ResourceLoaderSkinModule feature
* MonoBook link colors are overriden in skin variables

Depends-On:  I799b46664f01c5631fb9d1ae4f5c43caeeaac818
Bug: T288739
Change-Id: Ifbe2394f2f5beb417a4aa5b288a0e906ed10a691
2021-08-31 08:27:10 +00:00
jdlrobson
bf64fa1aec Restore red links color to the responsive mode
Follow up to c1ca90ce4b

the #p-personal li a is trumped by
the skin--responsive selector. Store the rule next
to the existing link rule to avoid this.

This stylesheet loaded by both modes so works in both.
One with the skin--responsive prefix and one without.

Bug: T288788
Change-Id: Ief4fa9dbbd48f2c6f73a58a73d64255438cd938e
2021-08-18 08:02:14 -07:00
jenkins-bot
ba278242d4 Merge "Restore capitalization styling in MonoBook portlets" 2021-08-16 22:51:18 +00:00
jdlrobson
ba2c0ec06e Restore capitalization styling in MonoBook portlets
Cleaning up the `text-transform` mess and making this specific
rule simpler for the different languages and skin variants like
responsive skin.
Follow up to c1ca90ce4b.

Bug: T97892
Change-Id: Id4b3a3c23396728fa5910b7acfcf618b281390ca
2021-08-13 15:18:11 -07:00
jdlrobson
65cbf78781 Drop double skin-responsive class
This is already added in `skin-responsive.less` so adding it
a second time means the selector no longer matches.

Bug: T288681
Change-Id: I4b08561f8848dc5f8545f5dc42add8b5ec286ca8
2021-08-11 15:12:17 -07:00
jdlrobson
38c49703f1 Add visualClear style to MonoBook
Follow up to ff1d2fcf0f
following guideline on
https://mediawiki.org/wiki/Manual:ResourceLoaderSkinModule#visualClear

Bug: T288288
Change-Id: I3066ac2171a1faa82244152f141208ca8643e00d
2021-08-05 21:16:04 +00:00
jdlrobson
c1ca90ce4b Reduce ResourceLoader modules used by Monobook
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
2021-08-03 12:45:59 -07:00
bwang
ff1d2fcf0f Remove 'legacy' feature, simplify skins.monobook.mobile module
skins.monobook.mobile which was incorrectly identified as
a ResourceLoaderSkinModule is removed. This module was always
loaded in JavaScript alongside one of the modified modules

Bug: T287410
Change-Id: Ia1e15b606b3eee1ae442bd71765778269d11fd38
2021-07-29 23:18:54 +00:00
Jack Phoenix
57e963507c Move capitalize-all-nouns CSS class support from core to MonoBook
Bug: T97892
Change-Id: I598c4469c46d284562ea3aec79330f9a1f40d2ce
2021-06-17 20:20:55 +00:00
bwang
6ce3ce1acb Use Skin::getAfterPortlet instead of deprecated BaseTemplate:getAfterPortlet
Change-Id: Ie00e8c5efe9a1e736251382344a7ae8cd779bb6b
2021-06-11 15:08:45 -05:00
Volker E
a80be96c35 build: Update SVGO to latest v2.3.0 and re-crush SVGs
SVGO v2.x changed configuration to JS, amending configuration.
Adding new 'minify-svg' npm script.
Also re-crushing SVGs.

Bug: T278656
Change-Id: I3c2544e93da008baaffca6c75ff3de15aeb6dc1b
2021-05-18 06:12:46 -07:00
Jdlrobson
0321b399f5 Drop mw-body-content class from Monobook in preparation for glorious future
* Removes the class from site notice - this provides no styling benefits
inside MediaWiki and is inconsistent with other skins. If site styles
need to target this element they should use the siteNotice id
* Replaces mw-body-content class with monobook-body and adapts existing
styles. The mw-body-content class will soon be applied to
$this->get( 'bodytext' ) instead. The core change
I3a91b294fcb3724cd46743e497dff723de0490a6 will shift this class to the
child element. There are no styles outside Monobook that rely on this
class and only 45 Monobook specific site/user styles that could be impacted.
The new class is prefixed monobook to avoid confusion with classes that
originate in core that are prefixed `mw-`

Bug: T279388
Change-Id: I90d85c21f4a62e6697f24e3ce388445a0a53c2b0
2021-05-13 20:14:11 +00:00
Derick A
aa848854ef resources: Remove redundant CSS rule from .mw-indicators class selector
As already mentioned on the task, this has already been made available in
the interface ResourceLoaderSkinModule feature, hence redundant in here.

Bug: T278364
Change-Id: I071f43836bed9991bbefd71b7b0348c2eb13bbec
2021-04-19 17:57:15 +01:00
jenkins-bot
404eade86e Merge "Implement mediawiki.skin.variables.less for MonoBook" 2020-09-16 15:09:44 +00:00
Sam Wilson
9086f450af Set top offset for notifications
Set the top offset for notifications to match the height of the
top tab and link area. Also move this height to a common Less
variable to use in both places it's used.

Bug: T260262
Depends-On: I12db7c1745d17851f6421123a145de4cb916ad51
Change-Id: I679b7bba8d0c43c36c5911b30540e86a77125497
2020-09-16 13:10:49 +08:00
Timo Tijhof
0fe9a86271 Implement mediawiki.skin.variables.less for MonoBook
For now, only define:

- @font-family-sans
- @border-radius-base

Bug: T112747
Depends-On: Icf86c930a3b5524254bb549624737d3b9dccb032
Change-Id: I000f319ab31b711c107e9e0dc2c29b93b761dc82
2020-09-14 17:51:23 +00:00
jdlrobson
3bed284b37 Refactor: Simplify responsive Monobook's optional dependencies
Having module definitions living inside SkinMonobook makes them
less discoverable. It also shouldn't be necessary - even if there
are soft dependencies on other modules.

A new file resources/optional-enhancements.js is added which will
load the two optional dependencies based on whether they have been
installed on the client.

Bug: T203023
Change-Id: If9a88db52deb0cc91d58cbb40693d4cd448eabbc
2020-09-04 15:53:28 +00:00
Derk-Jan Hartman
32b7602e04 Print: Hide accessibility jump links and cookie statement
Hide the accessibility jump navigation links when printing
Also only show the last modified and copyright footer info and hide
all the footer 'places' links by default.

Bug: T250232
Bug: T136786
Change-Id: I039b523d009ddb4f5948dff456ef2845a93439fa
2020-08-15 16:33:28 +02:00
Ammar Abdulhamid
a891fd477c Rename #searchGoButton -> #searchButton (2)
This was missed in I9ced97b

Bug: T255791
Change-Id: Ibee6218afd753750db0bcba2325534151c2db5f1
2020-07-31 12:40:04 +01:00
Ammar Abdulhamid
058fef6bf6 MonoBook: Rename searchGoButton -> searchButton
Bug: T255791
Change-Id: I9ced97b55cf5d6fb675a925825a28458ab7278db
2020-07-25 03:18:49 +01:00
Volker E
8b727fe359 Replace deprecated background-image-svg() mixin calls
Use normal `background-image` properties with SVGs now
that IE 8 and Android 2.1 are removed from Grade C.
Also removing all fallback images.

Bug: T248062
Change-Id: Icd9cb9ea2a102467b5af3829f4dad0f2c5707aee
2020-07-23 23:07:15 -07:00
Volker E
b87a5b66d2 Use 'normalize' module from core's 'mediawiki.skinning'
Also removing covered styles from 'screen-common.less'.

Bug: T256520
Change-Id: I054c77bb5410e0c08bbdcf3b51f2d6fcc8a103f0
2020-07-06 21:58:15 -07:00
AronDemian
1587cdfb60 Add .mw-footer CSS class & replace #footer selector with it
`#footer` kept for backwards compatibility with user styles and gadgets.

Bug: T248137
Change-Id: Ied8e79c5895f8fe383b1ca743a31890549cc8d86
2020-04-24 02:28:15 +00:00
Volker E
09fe3e5567 Remove elements from overqualified element-id combination selectors
There's no need for those in year 2020.

Change-Id: I9ea94bce18d749ada0bb5b1bb9692d1d1886755a
2020-03-21 20:39:46 -07:00
AronDemian
607fbb78ee Extend documentation of CSS trick that sets the minimum content font-size to 11.43px
Change-Id: If90ae377705eb88807be465b24859b9ccc63d09c
2020-02-28 06:37:03 +01:00
Volker E
ac9ba37713 Amend firstHeading selector
Turning it into a class selector similar and amending the distances
to not rely on `line-height` in order to prevent unwanted side-effects
in non Latin scripts.

Follow-up to I85b5172a851bcfbf00606f355453f591782f9cc2

Depends-On: I2edf9f40e5b4b9296195cb581e216f82b28933ca
Bug: T239657
Change-Id: Ia27b48d45ad3fa4ab2f517734bd0cbe0d94f5ed4
2019-12-02 12:26:36 -08:00
Ed Sanders
3314ffcc06 build: Update linters
Change-Id: Ic5ffd9a998e08e09420513114d8f9a89723801f4
2019-10-31 21:47:42 +00:00
Volker E
cdafe2a796 Remove IE 6 & 7 specific code
Bug: T234582
Change-Id: I3b51005bdc4ce49a534f8fc005f8e5a67b5c39e7
2019-10-13 09:15:38 -07:00
Isarra
a2d4476d12 Style RelatedArticle cards
If RelatedArtcles uses the SkinAfterContent hook (depends-on patch)
and we move the hook out of the main content block (parent patch),
it needs some styles to remain consistent.

Bug: T181242
Change-Id: I9fc00c22fb5e5b7d363455abe9d85062e67c7dfa
Depends-On: Iebd759c0d1a536768d18953f372664df762d9e04
2019-07-26 19:50:24 +00:00
Bartosz Dziewoński
6c53b601f8 Use media queries rather than manual checks for mobile hacks
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
2019-07-12 21:59:26 +02:00
Bartosz Dziewoński
3f52a1796c Fix funny Echo integration when mobile hack kicks in after using the icons
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
2019-07-12 21:57:12 +02:00
Bartosz Dziewoński
4c4efadf59 When the personal bar doesn't fit, make overflowing links usable
When the personal menu bar is wider than the screen (browser window),
it gets cut off on the left (and the overflowing links slide under the
logo and then off the screen, making it impossible to click them).
This is caused by the `float: right` rule added in 5a7e620. To avoid
this, add `max-width: 100%`, which results in the menu being cut off
on the right again (which lets the user view the overflowing links by
horizontal scrolling).

Bug: T226875
Change-Id: Id4186215cc069f283f8ebeca0db587e1f1369062
2019-07-12 21:30:21 +02:00
jenkins-bot
fa1deee55e Merge "Move DataAfterContent outside of main content block" 2019-07-08 21:18:35 +00:00
Isarra
5a7e620ed5 Echo compatibility: use float: right instead of text-align: right
on personal tools

Echo badges, like all OOUI buttons and quite a few other elements,
hide their labels with a negative text indent. This does not work
properly with backwards text alignment (align: right in ltr
scripts). We can achieve the same visual effect as the text-align:
right on the personal tools, however, by floating the entire list
right instead, thus unbreaking the default badge label hiding
method and also rendering the skin more consistent with Vector,
Example, etc.

And this should negate the need for bonkers workarounds.

Bug: T226684
Bug: T226594
Change-Id: I0ed21a78feb1b1298c30b969a1c80a4323e74043
2019-06-28 02:18:17 +00:00
Isarra
1e0aa01470 Move DataAfterContent outside of main content block
Bug: T226199
Change-Id: I367302e528a4df7c4b53c93caa5b4ba2bfd30e33
2019-06-20 17:43:25 +00:00
Jack Phoenix
1bb0c40a49 Remove last references to the long-gone CSS classes .editExternally and .editExternallyHelp
See core commit 1890f315a2d756b9fa31856f59437ade8aafea7a for the full explanation, but tl,dr: these classes haven't been used since 2005.

Change-Id: I52d7facccce955da9f66102b657a0e3627904167
2019-04-21 00:05:04 +03:00
Volker E
7698e737bf Remove list-style-image fallback treatment for non-SVG browsers
Bug: T220327
Change-Id: I421716a8d964be4676a82b39446dd78ac78b7fba
2019-04-07 23:15:31 -07:00
Ed Sanders
244bc6b050 build: Update eslint-config-wikimedia to 0.11.0
Change-Id: I408ff717768a00de74868b52d390dcc4b3269bcd
2019-03-13 22:57:00 +00:00
Volker E
0e863dabc4 Remove 'icons-sourcefile.svg'
Removing file originally intended to create icons.

Change-Id: I5cc884c5ea4133a2b9dd7f97db1464405226fd07
2019-02-08 14:17:18 -08:00
Volker E
523c7e0716 build: Add Grunt 'svgmin' task and crush SVGs
Adding 'grunt-svgmin' package and corresponding 'svgmin' task and
also crush in-use SVGs.

Bug: T215485
Change-Id: I3a8ba3daab7b7fb110000d88d9baff9ea1f5b5db
2019-02-08 14:11:03 -08:00
Isarra
e9b62baf8d Put background images back in single set of declarations in body
Separating the two background images out is unnecessary when we already
have a single-image fallback jpeg for old browsers, and also breaks
extensions such as Theme and user/site css affecting the background image.

Change-Id: Ic869b84fb6d0c10b91a171fb1f842e2290d3bc0a
2019-01-22 02:34:52 +01:00
Ed Sanders
7712f1bf22 build: Update eslint-config-wikimedia to 0.10.0
Change-Id: I58983b156eab7090c245ad6febfa47f1552c7188
2019-01-14 21:00:07 +00:00
Isarra
0221daf6ae Fix disappearing page tab issue in mobile
bug: T211378
Change-Id: If69c0c1ed134f2bff1b453ccd853c826d1da07dc
2019-01-06 17:29:18 +00:00
Volker E
af18fc71e5 build: Update 'stylelint-config-wikimedia' to v0.5.0 and make pass
Change-Id: I409d8b260ef56f0ab09619968d513cae71d43471
2018-12-08 12:24:55 -08:00
Volker E
d2a20bd520 Remove obsolete Special:Preferences styles after its transformation to OOUI
These removed styles match no elements in the
Special:Preferences page since the OOUI transformation.

Bug: T208923
Change-Id: If7df130c53bcbbc199a6e10a6d84dbcc8b4e087d
2018-11-07 12:53:36 -08:00
Kunal Mehta
1a1e3ee1a9 Stop using mediaWiki and jQuery globals to fix eslint
Follows up 91f950d6b0677 in MediaWiki core.

Bug: T206324
Change-Id: I28360423cea110259353bb09082e5346f2606e44
2018-10-08 21:25:32 -07:00
Volker E
c131c4c36b Amend border-radius to conform to Apex theme standard
Depends-on: I471655dee3e3fd13f6f4b14461b9b11bf67026e6
Change-Id: Ida58a1a4987dfdaca9332ab1b06bc557fa7f5486
2018-07-12 01:03:04 +02:00
jenkins-bot
8a9bea4df7 Merge "Set mobile width cutoff to 550px" 2018-06-06 21:15:39 +00:00
Isarra
406adb14f2 Set mobile width cutoff to 550px
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
2018-06-06 21:06:13 +00:00
Isarra
940f56a2fe Hide dropdowns instead of removing for screen readers
bug: T196190
Change-Id: I46d6b0683e0b6828d35f95f0bd68486cf22d57dd
2018-06-05 13:10:38 +00:00