Commit Graph

11 Commits

Author SHA1 Message Date
Jan Drewniak edd2f4ff85 Reorganize LESS files to match ResourceLoader conventions
Separating most LESS files into 2 ResourceLoader modules and a common
folder:

- skins.vector.styles
- skins.vector.styles.legacy
- common

This changes aims to clearly separate the old (“legacy”), the new
(“modern”) and the common styles which were previously all placed under
`skins.vector.styles/`.

Inside each directory are separate folders for `layouts` and
`components`.

The entry files, `skin.less` and `skin-legacy.less` are moved into the
specific folders and a third, `common.less` entry file is created that
contains the common imports for both old and new Vector.

Aliases have been added to the Storybook Webpack config to avoid adding
the story file changes to this patch. Images coming from CSS `url()`'s
have also been temporarily disabled in Storybook until Storybook can be
upgraded to use Webpack 5, and use array values for aliases, in a
follow-up patch.

This patch also slightly changes a footer layout specific rule so that
existing `padding` remains unchanged in rendering due to new common and
component structure.

Bug: T264309
Change-Id: I1cd2681a2b61edb7be56c38f9bb3994827d7e322
2021-04-08 15:47:56 +01:00
Stephen Niedzielski b80ad85bb1 [dev] [Less] centralize z-indices
Move all the LESS `z-index` settings to variables.less so it's easy to
conceptualize how UI will be layered. jQuery CSS rules are untouched but
documented.

Also, remove the seemingly redundant re-setting of the `mw-searchButton`
`z-index`:

  #mw-searchButton
    z-index: 1;
  }

This rule was added in 0c77e4f.

The sidebar work will require `z-index` properties and this refactor
eases the comprehension of those changes, as well as prevents the
accrual of more `z-index` technical debt.

Bug: T246419
Change-Id: Ic112a0ee3f701f87432838797be45c6069fdb522
2020-04-02 15:05:22 -06: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
Bartosz Dziewoński 1f9f35e3f8 Use consistent font size for OOUI dialogs
Everything is 14px (0.875em) now. This overrides 0.8em from MW core.

Bug: T97631
Change-Id: I978de29a082768ecebbc1750a8d09481998979a8
2018-03-20 13:02:43 +01:00
Bartosz Dziewoński ce97818dd2 OOUI: Remove confusing 'position' override
Vector is the only skin that does this, setting 'position: relative'
for .oo-ui-windowManager-modal (normally 'position: static') and for
.ve-ui-overlay-global (normally 'position: absolute').

The override for .oo-ui-windowManager-modal caused it to create a new
stacking context, which is the only reason the 'z-index' override
worked. Use the right selector to override 'z-index' instead.

The override for .ve-ui-overlay-global was completely pointless and
it's surprising that it never broke anything.

Change-Id: Icd1dec43e2da9ef2090b18145099838de3a7890a
2018-01-16 19:25:38 +00:00
Bartosz Dziewoński c573554c23 OOjs UI: Fix z-index and font size for default overlay
Override default font size for .oo-ui-defaultOverlay (0.8em) to the
same as content in Vector (0.875em).

Make it appear on top of the personal menu too.

Bug: T183069
Depends-On: I53888581f9e1da3b036166613c46cbc1085aa55e
Change-Id: I459aad271c0c15248e54e312b8bdc44ed244733b
2017-12-27 06:32:51 +01:00
Moriel Schottlender bf698128f2 Move the 'rcfilters overlay' rule to the RCFilters stylesheet
Depends-On: I8357ef2ff0fe4f46b9ee665ef068624de0afd2e5
Change-Id: Ie36eeddc46c8ea3d154a006fed2fe578be1cd05c
2017-12-22 10:04:15 -08:00
petarpetkovic b0f65a08df Fix detached RCFilters menu
In attempts to fix RCFilters menu overlap with other UI elements when
opening upwards, I1fe6b8b2c9 adds `z-index` rule to overlay element.
But as part of the same rule, `position: relative` is added which
cascades the absolute positioned overlay, causing it to appear in
natural flow of document, which causes menu positioning parameters
to render the menu detached from RCFilters.

Bug: T183442
Change-Id: I3f7db005730d045b2278753cfd655169a96c60a9
2017-12-22 14:07:22 +01:00
Bartosz Dziewoński d4eabd9d10 Fix z-index for RCFilters' overlay
Currently the personal bar displays on top of it. This wasn't
visible until some popups started opening upwards rather than
downwards. We should fix this better some time...

Bug: T182711
Change-Id: I1fe6b8b2c9c1e4d12a9a4d2d1edd1ead269780cf
2017-12-12 23:53:09 +01:00
Ed Sanders 1cce1de1be Apply global overlay z-index to ve-ui-overlay-global
VE keeps the global windowmanager inside a global overlay div,
which has a default z-index of 1. Ensure this is overriden in
Vector. Requires extra specificity due to stylesheet load order.

Bug: T126135
Change-Id: I5ebb4e59e3714dfaa3d755ecf6285009efe7b62a
2016-02-06 21:40:40 +00:00
Ed Sanders 15a990b888 Apply personal bar z-index hack to modal OOUI window managers
Bug: T105300
Change-Id: I1b618b76f0ed917aad74394881115399d9636030
2015-08-08 14:15:06 -07:00