Commit graph

102 commits

Author SHA1 Message Date
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
Timo Tijhof
6dccc0d96e Re-implement and improve mw-jump links with pure CSS
* Improve their accessibility by giving both links a full label
  ("Jump to x" and "Jump to y" instead of "Jump to: ", "x", "y").

  This also makes things better for localisation.

* Use pure CSS for the toggling of the visibility on focus,
  instead of relying on JavaScript. Especially given the
  JS came from core's 'jquery.mw-jump' module, which is
  considered technical debt per T195256.

* Use plain <a> links in the HTML instead of wrapped in a <div>.
  This solves the long-standing problem whereby the margin
  between #contentSub and #mw-content-text had to be awkwardly
  negated and overridden.

Bug: T195256
Change-Id: I40a769ee3a822a5a9167ec1d144e6b151eb8e141
2018-05-24 01:30:55 +01:00
Isarra
6fe98ca305 Make echo numbers appear on mobile
Change-Id: I812e94dc2de5a527b1e3dce110b8d137466c4068
2018-05-20 15:17:47 +00:00
Isarra
ca53e721ab Mobile - reorganise and clean up p-personal js dropdown
* 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
2018-05-20 10:29:50 +00:00
Isarra
ef1f98e7bd Responsive support: Echo hacks
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
2018-05-19 21:15:31 +00:00
Isarra
0e2ee04c87 Responsive support, JS edition
Dropdown menus and js interactiveness for people who like to pretend
we live in a modern era or something.

Does not actually support newfangled tapping and swiping stuff.
Does not properly support echo. (will follow up)

Change-Id: I27d50c320b1526b9d158016a0e8022567f78ccc1
2018-05-19 20:17:17 +00:00
Isarra
70d426d4fd Responsive support, noJS version
* Add screen-mobile.css with basic mobile styles
* Force loading of screen-desktop on IE8- due to lack of
  @media width support
* Add some new divs and a set of spoof cactions for jumping
  around the page (what's js?)
* Replace cactions label with a more descriptive string (was
  previously set to display:none regardless)
* Also add a set of icons for fixed widths for tabs and things
  (icons-source.svg is the source file for the set, and includes
  a few others that ultimately weren't used here)

Cutoff 850px. Desktop styles should remain unchanged, with
mobile remaining stylistically consistent.

Change-Id: I737a7447db1e44e0d6abaa4c07813295a5ac73a6
2018-05-02 22:20:54 +00:00
Bartosz Dziewoński
33e2eb5eef Convert screen-desktop.less back to .css
A proposed change (I737a7447db1e44e0d6abaa4c07813295a5ac73a6) requires
this not to require Less parsing. It was unnecessary to convert this
to Less when I could have just removed an `/* @embed */` annotation.
Follow-up to ac8b055693.

Change-Id: Iba82f57d4ba3e65c61a5ef795b3b8d9c3f164a39
2018-04-19 01:03:25 +02:00
Bartosz Dziewoński
ac8b055693 Consistently embed images in CSS (or not)
Use .background-image() and .background-image-svg() mixins to embed
all SVG images, but not embed GIF/PNG fallbacks.

Change-Id: I807719dbf07749f4c942b4ba9b023440ca52a510
2018-04-05 16:25:32 +02:00
Mukunda Modell
2e1865640c Use background-image instead of .background-image-svg
Bug: T191237
Change-Id: I84a11685d6e2fefdedafc056e3433f0c8aaa2218
2018-04-04 19:52:41 +00:00
Isarra
155cfd8658 Optimise svgs
Previously added some svg versions of icons and background images.
svgs have now been run through svgo and cleaned up per Nikerabbit's
advice.

Also slightly tweaked user.svg to better match raster version.

Change-Id: Icf7ad259366a7051c66e2b8d6ac229ef1f0388fe
2018-04-01 17:25:18 +00:00
Bartosz Dziewoński
82580b2dd7 Remove unused styles
These elements no longer exist. See comments on the previous patch.

Follow-up to e33b232785.

Change-Id: I58aca1f4255df14d6289e167e180dad31b546a8c
2018-03-27 19:45:32 +00:00
Isarra
e33b232785 Move Cite styles into separate skinStyles sheet
No guarantees that these styles actually apply to anything anymore.
But at least the TODO is resolved!

Change-Id: Ibb43c044f50f026afa84a0151b113dd600956942
2018-03-24 18:38:33 +00:00
Isarra
2b24cbab0e Separate desktop and common styles, clean things up a bit
Part of the move toward responsiveness.

* Use mixins and variables!
* Vectorise existing icons
* Delete a rule or two that don't apply to the source anymore
* Consolidate similar colours into the same ones using variables

Change-Id: I2f0eb2b79cba01d8fa3a06298711e8af4d5508ba
2018-03-24 18:10:23 +00:00
Isarra
7b01f37552 Rename main.less to screen-common.less to prepare for splitting
Part of the move toward responsiveness.

Change-Id: I6ca7c87fff7a65b05b2310885aedaeede9647c78
2018-03-24 18:01:41 +00:00
Isarra
a29f04c254 Vectorise book background image
Also:
* Convert main.css to less because I can't figure out how to do svgs
  and fallbacks by hand
* Add gradient image to fit with book for really, really, really wide
  displays (and move book background to globalWrapper to make it
  actually work)

Change-Id: Ie6f5b6b87b475953274688fc4640f9fa17184fa4
2018-03-23 22:06:25 +00:00
Ed Sanders
4586361991 Fix default overlay selector
Change-Id: I3f73355d11e021cd90579b0bb18766d890883c1c
2018-03-23 00:42:01 +00:00
Isarra
57106ab179 Restructure files according to modern skin practices
Also delete unused images, since even if something is
somewhere using them anyway (looked, couldn't find
anything), it wouldn't be able to find them in the new
image location regardless.

Wiki.png, magnify, and link are all part of core and have
been for some time.

Change-Id: Id7a02155a5f1b207908c9c0c8f7519b6d3f9a886
2018-03-21 21:56:55 +00:00