Commit Graph

1235 Commits

Author SHA1 Message Date
Volker E 0e0d77fef3 Replace raster image gradients with CSS where easily applicable
Replace raster image gradients (before base64 embedded) for modern
browsers by CSS gradients. Only relying on conventional image URLs
in browsers that don't support linear-gradient.
Also
- adding a darkened border for inactive tabs to harmonize visual
  perception of border as one continuous line and
- DRYing tab separator selectors, saving ~8 bytes gzipped.

Bug: T63099
Bug: T121730
Change-Id: I76d32b84ddff06a2c7ef983e6f89ca6e74257a67
2019-10-01 14:24:07 -07:00
jenkins-bot ad3c268a93 Merge "Replace portal break image by SVG gradient" 2019-10-01 19:11:24 +00:00
Volker E 5ed9bf8be6 Replace portal break image by SVG gradient
Replace raster image gradients (before base64 embedded) for modern
browsers by CSS gradients. Only relying on conventional image URLs
in browsers that don't support linear-gradient.
Also updating color to Wikimedia Design Style Guide color and
removing obsolete *-ltr/*-rtl images that have been introduced in
MW core 1.16.0beta1 but have been replaced by unified 'portal-break'
image afterwards.

Bug: T63099
Bug: T121730
Change-Id: Id0ab5eb7d4a5751316ce750aff2dffbda62f6b09
2019-10-01 19:39:34 +01:00
Translation updater bot 46ad65a7b8 Localisation updates from https://translatewiki.net.
Change-Id: I656224205bd85d4c3ec95df6e18a0e7a4ee0bc82
2019-10-01 08:34:32 +02:00
Volker E 0175a2be2e Remove unneeded portal background properties.
Have been in since before Idfc38503d8397ffe where 'portal-break.png'
was still applied on `div.portal` and not ever after on `.portal .body`.

Change-Id: Icbaed3f9d41a46a0f5d17266c29703024ffc1412
2019-09-30 19:09:38 -07:00
Volker E 7227e50b0a Simplify watch link selectors
Change-Id: I51b1f66900dbc4982156b5356783a69a7025ebe7
2019-09-30 14:05:31 -07:00
Volker E 190d9830ca Reduce specificity by using classes without element selector addition
That's not only good practice, it also allows to widely simplify
'watchstar.less' selectors.

Change-Id: Ic31452f985e99d60f6fc71473be7de08bdc16148
2019-09-30 00:36:32 -07:00
Volker E 1d7c3fac99 Remove unneeded selector
Has been added in 8db5779682, but there's no `span` as direct child
of the watchstar `a` (any more).

Change-Id: I989cfd0c1fe30a0b4821f79e1d9377b8d888c24b
2019-09-30 00:07:17 -07:00
Volker E e3f9cdcf70 Variablize all `color` property values
Also going with `--modifier` naming scheme when direct pseudo-class
modifying variable. And fixing small typo.

Change-Id: Ife2f9dc9cb57c063a43e4b3dfad3c737aaf3b72b
2019-09-29 23:36:58 -07:00
Volker E 2b0a28cdcb Unify on variables and file names on 'navigation'
Navigation is the appropriate, general term – settling on it and
unifying file name and common abbreviation 'nav' for variable names.

Change-Id: I237b56320544de15e3b97c4806f6e2387bc54ca0
2019-09-29 13:27:15 -07:00
Volker E daa3611bce Unify LESS variable naming scheme for remaining `@color-*` variable
Unifying remaining navigation variable.

Change-Id: I9ff7f1d33e06d175c6e2fdd1ec5b58306d63e737
2019-09-28 01:16:24 -07:00
Volker E f29a1eba0a Unify LESS variable naming scheme for `@border-*` variables
Unifying variable naming to property-identifier-modifier scheme and
use already existing variables out of mediawiki.ui variables file,
which gets imported by Vector and its variables (like
`@border-width-base`) are already in use in a few places.

Change-Id: Ic25b1517bf180a9bce437215c1309bb9f4dd15be
2019-09-28 00:35:16 -07:00
Volker E 62560debb9 Unify LESS variable naming scheme for `@margin-*`/`@padding-*` variables
Unifying variable naming to property-identifier-modifier scheme.
Also removing `@padding` variable with only one single usage, instead of
extracting it from its place of application enable simpler readability.

Change-Id: I602fe645b233000bcecaeee6cf19d20e49a64c78
2019-09-27 23:24:34 -07:00
Volker E 0a2aa9f683 Unify heading font size variable naming
Follow-up to I378e8a2af91fe079

Change-Id: Ib1affae440f23e7d9b648ce4b8b85cf2d3a2e1d2
2019-09-27 22:45:01 -07:00
Volker E 83fbe68b5f Unify LESS variable naming scheme for `@line-height-*` variables
Unifying variable naming to property-identifier-modifier scheme.
Settling on non-em-based `line-height` values with one exception
of Vector tabs, where removing `em` would lead to different
calculation.
Also removing unneeded `inherit` assignment on content paragraphs
that has been part since Ic5ba836364.

Bug: T4013
Change-Id: I514467e4065d27de8d0ea82cdd3d23ccef6cffe3
2019-09-27 21:41:23 -07:00
jenkins-bot 0d097a2a43 Merge "Remove @embed page load delays (and misc optimisations)" 2019-09-28 02:06:38 +00:00
Volker E 78252928da Improve print LESS variable setting and handling
Print-only variables should belong only to print stylesheet.
Also clarifying usage and naming throughout file.

Change-Id: I40dec1baadcf3dbbcf44252a8f577f19017fcbbc
2019-09-27 16:11:40 -07:00
DannyS712 5de3655dfc Fix typo in skin.json ResourceModuleSkinStyles
Bug: T234003
Change-Id: I75ca8af43f68ea88eaed2244abac312de6d3edc4
2019-09-27 18:35:00 +00:00
Timo Tijhof 9cf7901ec9 Remove @embed page load delays (and misc optimisations)
* page-fade:
  Remove redundant 'background-image' PNG fallback for
  IE6-8 in '#mw-page-base' because the vertical-gradient() already
  creates a solid fallback color which seems good enough for IE6-8.

  Remove the 'background-color' rule which was only there to fill
  the gap above the the IE6-8 PNG image fallback, which in turn
  overrode the background-color rule from vertical-gradient.
  The background-repeat rule is also redundant with background-image
  gone.

* watch-icon-loading:
  This is only used when the JS code is active and the user
  clicks the watch star. It does not need a PNG fallback, as it
  is only needed in Grade A browsers where the JS executes,
  which are expected to support SVG.
  Also removed the embedding as the rendering of article text
  on page load should not be delayed by an icon that might
  be used if and when the user clicks on the watchstar (and
  irrelevant to logged-out users).

Bug: T121730
Change-Id: Ief4b80432fbe2ce7ebddf429f02c161048ed61d1
2019-09-27 18:03:25 +01:00
Translation updater bot 62d3053bf2 Localisation updates from https://translatewiki.net.
Change-Id: Ie347628c1ec3baed5aeda3711594c5b0fe72a620
2019-09-27 08:33:21 +02:00
Volker E 6cc10e47ac Replace fixed value with mediawiki.ui variable
Change-Id: Ie2f2c0519f543f7131ef62c0d94c8de27481d008
2019-09-26 18:54:56 -07:00
Volker E 9055676640 Unify LESS variable naming scheme for `@font-size-*` variables
Unifying variable naming to property-identifier-modifier scheme, while
also collecting all non-print values variables in corresponding file.
We will amend the `em` based values to calculations that will enable
rendered full pixel values and also fix some connected
usability issues in the future.

Change-Id: I378e8a2af91fe0790708e6fb2d2e7a5718ce93c5
2019-09-26 18:53:00 -07:00
jenkins-bot 0dcc6bf431 Merge "Update LESS variable naming scheme for `@font-family*` variables" 2019-09-27 00:25:18 +00:00
jenkins-bot fcfe5e3fd3 Merge "Align LESS color variables to naming scheme, combine and cleanup" 2019-09-27 00:25:17 +00:00
Volker E 258fdde8bf Update LESS variable naming scheme for `@font-family*` variables
Reyling only on base font family variables. It's debatable if
something like `@font-family-base` would make sense, but with only
3 variables the abstraction would seem over-engineered for the time being.

Change-Id: I294ef8753dd3c73f4ed3fd89d43978dfaf6e0f06
2019-09-26 15:54:46 -07:00
jenkins-bot 9a2ae86110 Merge "Remove `tabindex` attribute from search input" 2019-09-26 22:53:32 +00:00
Volker E 66aaf36bf6 Align LESS color variables to naming scheme, combine and cleanup
Merging similar value applications in generalized variables,
and aligning to property-identifier-modifier scheme.

Change-Id: I274ef24140a36e285c67b33a41ab6afe7c98676b
2019-09-26 15:39:25 -07:00
jenkins-bot dca6da5767 Merge "Increase distance of button to container" 2019-09-26 22:12:09 +00:00
Volker E bfc5a578d2 Remove `tabindex` attribute from search input
Relying on natural tab order seems to be the appropriate approach here.

Bug: T226148
Change-Id: I304996bfb8fba0e4172e01e0969162fd8cf0e0ee
2019-09-26 13:20:06 -07:00
Volker E 484077de01 Increase distance of button to container
Increasing the distance of the button slightly changes the position
from end, putting the icon in a more appropriate place (harmonized
whitespace of input value and icon).
Also simplifying `font-size` calculations readability and equalling
their values in search input and button.

Bug: T225331
Change-Id: I57f7efc61f3b770d7470d820402e2ea533364238
2019-09-26 12:15:38 -07:00
Translation updater bot 6f1afed52a Localisation updates from https://translatewiki.net.
Change-Id: I5c1b7f440d3cb862ff695b4605c11f53f89a2cc5
2019-09-25 08:41:33 +02:00
Translation updater bot d70b90e169 Localisation updates from https://translatewiki.net.
Change-Id: Ib3ffdfde2ad21589976a20346a71a2c9b48b7869
2019-09-23 08:30:09 +02:00
jenkins-bot 0f4c3f1197 Merge "Reduce footer selector specificity and clean up CSS" 2019-09-20 22:40:57 +00:00
jenkins-bot c15f05d7c9 Merge "Remove obsolete `.vectorMenu ul` selector" 2019-09-19 20:43:08 +00:00
Translation updater bot 1821589eb7 Localisation updates from https://translatewiki.net.
Change-Id: I3bbed8a105a4ed889c2cf801e784f66f7e56906c
2019-09-19 09:09:06 +02:00
Volker E 606365367f Reduce footer selector specificity and clean up CSS
Reducing specificity, simplifying output and merging `padding`
in one place into one shorthand attribute.

Change-Id: Ida96f18e9d90d55492ea114a7b5e3e1b8020c71f
2019-09-18 22:37:22 -07:00
Volker E b11b5d44f9 Remove obsolete `.vectorMenu ul` selector
Has been made obsolete in I8e45af51ffc.

Change-Id: I23c69b5615199899be9bc16ba012ed21e920f317
2019-09-18 15:37:36 -07:00
Translation updater bot 9e37e6b177 Localisation updates from https://translatewiki.net.
Change-Id: I946aaec653c69845f529a71b60f35232320949dd
2019-09-17 08:25:06 +02:00
Translation updater bot 4c4f944c05 Localisation updates from https://translatewiki.net.
Change-Id: I9e9c98b2c2c8df62d6c25a48ba6416e5607cbdcc
2019-09-16 09:16:43 +02:00
Translation updater bot 03da028209 Localisation updates from https://translatewiki.net.
Change-Id: I31c9a765064759519b1772d048d6102f70a53358
2019-09-13 09:34:57 +02:00
Translation updater bot 7e1a843ab2 Localisation updates from https://translatewiki.net.
Change-Id: Ie66b1a154f5722d042f4ee6d9897ec980afaa472
2019-09-12 08:38:51 +02:00
jenkins-bot bfb8ca9724 Merge "Decrease onresize debounce from 100ms to 10ms" 2019-09-11 21:04:22 +00:00
jenkins-bot a29c815a4f Merge "Use mw.util.debounce() in collapsibleTabs.js" 2019-09-11 21:01:37 +00:00
Timo Tijhof 75af9ec9b5 Decrease onresize debounce from 100ms to 10ms
The debounce is trailing, not leading/throttled. This means
the value doesn't decide how often it runs while the user is
resizing. It decides how long after they stop resizing will
it first run.

Given the calculation isn't super expensive, a much lower value
should suffice. The main thing we want is that while the user
is actively resizing and 100s of events are queued up (faster than
JS can process), that we wait until the end of the chain before
computing it (once). If the user actually stops moving, even for
a little bit, that little bit however small should be more than
long enough for a repaint to take place.

Test Plan:
* Open two tabs, one after checking out master, and
  one after checking out this patch. Make sure you are logged-in
  on MW as an administrator user (to get more tabs).
* Verify that `mw.loader.getVersion('skins.vector.js')` returns
  different values from the console for each.
* Resize the window from wide to very narrow and back.
  Before, the tab bar updates relatively late it feels sluggish.
  After, the tab bar appears to update as/while you let go.

Change-Id: If02338559abc71668d0655e8b3be1a5f73e646a9
2019-09-11 19:44:04 +00:00
Timo Tijhof f169c8b3f9 Use mw.util.debounce() in collapsibleTabs.js
Bug: T213426
Depends-On: If370b959b2617d0f506ac3ed344af8c6a667e70d
Change-Id: Ib006a570f9405bbd48bb7e81a3d98b562df22b00
2019-09-11 19:29:46 +00:00
jenkins-bot b5b5b3c5e3 Merge "vector.js: Use idle callback (not rAF) for computed style read" 2019-09-11 19:16:35 +00:00
Timo Tijhof 9b2bcbbcae vector.js: Use idle callback (not rAF) for computed style read
requestAnimationFrame (rAF) is called before styles are computed.
Performing a style read there can require a forced style
recalcution which interrupts the browser's natural rendering
life cycle.

To gracefully observe layout of the page without inducing the
cost to render it, it should be accessed after rendering.
A suitable API to schedule time there is requestIdleCallback.

In any event, if the code that needs this measurement executes
very early for some reason, it is still computed on-demand which
means it can't cause any functional regression.

Change-Id: I0d8d3a0b158fa3d9e0895760d0691757f918d91d
2019-09-11 02:18:04 +01:00
Translation updater bot be43cb9628 Localisation updates from https://translatewiki.net.
Change-Id: Ie704a4a2de9612b6078f8e6dc990d9b5fdf88af8
2019-09-09 08:32:50 +02:00
Translation updater bot 42f1a3d605 Localisation updates from https://translatewiki.net.
Change-Id: Ibaa1252d2741b54a1dbeb7e4fac5502b2a41eb4d
2019-09-04 09:16:36 +02:00
libraryupgrader 9eacb7ea30 build: Updating eslint-utils to 1.4.2
* https://npmjs.com/advisories/1118

Additional changes:
* Added .eslintcache to .gitignore.

Change-Id: I4a30cdbb28b52a7b2f2745ba5d644778cd301fdf
2019-08-24 03:17:50 +00:00