Commit graph

13 commits

Author SHA1 Message Date
Moh'd Khier Abualruz f83cca3cc5 [Zebra] Merge skins.vector.zebra.styles module into skins.vector.styles
Merges all of the styles in the Zebra module into the default styles.

- skins.vector.zebra.styles ResourceLoader module is removed.
- FIXME's related to Zebra styles are removed.
- Top-level "&" that were used for scoping to feature-flag are removed.
- `$wgVectorZebraDesign` feature flag is removed.

Bug: T347712
Change-Id: I0177541ae87a5d070d5317629ca38de93613d620
2024-01-09 15:46:11 +01:00
bwang badd229bab Fix nonzebra sticky container scrolling behavior and scrollable indicator
- Remove unnecessary CSS from old grid styles
- Consolidate scrollable indicator styles, delete old styles

Bug: T352464
Change-Id: Id33e6d99dba2c680f02b246bbccf26a2aa7e77d9
2023-12-05 19:32:36 +00:00
Moh'd Khier Abualruz 2384a32323 [Zebra] Make .vector-column-start cache compatible
preparing html and css to avoid caching issues
caused by differences between zebra and non-zebra HTML.

Bug: T347712
Bug: T351830
Change-Id: I6f8ae635ba38937729b77ea8517ef2eae0ae12f7
2023-12-04 14:29:06 -06:00
Volker E b55d95c70c styles: Replace legacy Vector breakpoint tokens where applicable
Replacing the legacy Vector breakpoint tokens with the Codex
standard ones. All names have been unified, only some legacy values
remain for backwards compatibility.
Also
- replacing a wrongly applied min-width with the correct max-width
  token,
- replacing a width with an equal value min-width one and
- removing the now equal value mobile min-width one.

Note that we can't do some reference magic here alike
`@max-width-breakpoint-mobile: @min-width-breakpoint-tablet - 1px;` as
this would take the Codex value from skin variables and not the legacy
value.
Also note, that we could move all those Vector legacy definitions into
Vector's 'mediawiki.skin.variables.less' file(s), but that would mean
that extensions don't rely on the Codex default values, but on Vector's
and we want latter to move to the standard, also in foresight of
further standardization to build for all feature teams like a
shared Grid.

Bug: T331403
Change-Id: Ifb968b1977001edb1a79e20df387c61f27043542
2023-10-25 22:03:46 +00:00
bwang 896645be29 Remove common CSS module
Bug: T345766
Change-Id: I57e388be4b620a437274524e20653ef9ba7289ed
2023-10-05 22:35:40 +00:00
Jon Robson d6544e4c5c Clean up FIXMES now the cache has cleared
Follow up to Iad8523037ed364f09962b2d6ca0a3d50d7bd2266

Bug: T346401
Change-Id: Ifa4ab87e43cf28143dc7d753e264d4f0957dcbfa
2023-09-19 20:28:56 +00:00
Moh'd Khier Abualruz c88d72f1d7 [anon prefs] TOC pinned / unpinned
- Status should persist across page views for anonymous users
- Added 'toc-pinned' as a persistable feature in features.js and FeatureManager.php.
- Handling for cached HTML supporting both new and old class names for pinned/unpinned TOC

Based-On: I0fbe0ab458c5bd55d659d3c35a8fbaa6cd6ec0e1

Bug: T316060
Change-Id: Iad8523037ed364f09962b2d6ca0a3d50d7bd2266
2023-09-14 21:37:50 +00:00
Ed Sanders 1177320e3c build: Update linters
Change-Id: Idff91da3e6a490bbd31b39651f35544e9cb3fd9c
2023-08-23 18:46:49 +01:00
Jan Drewniak 3cea6d4132 Scope styles related to zebra feature flag
This change scopes the styles related to the Zebra
update by wrapping the imports in a top-level feature
flag selector,
i.e

.vector-feature-zebra-design-enabled {
    @import "./screen.less"
}

To account for this extra selector, ampersands are
added wherever the html element is targeted in the
affected files. This applies to both zebra enabled
and disabled files.

getDefaultModules() is used in SkinVector22.php to
conditionally load the new skins.vector.zebra.styles
module when the feature is enabled.

Bug: T332600
Change-Id: I5e673df383ff31f296010f982e4188c82f095590
2023-04-19 23:09:08 -04:00
Jan Drewniak da92ecf7cc [Refactor] Prepare existing styles for zebra module
This refactor seeks to make it easier to separate
feature flagged styles by wrapping the imports in
a top-level feature-flag selector, e.g:

    .vector-feature-zebra-design-disabled {
        @import './layouts/preZebra.less';
    }

This change does the following:
- Moves all file @imports to skin.less
- Removes unnecessary @import from MainMenu.less
- Moves .mixin-page-container() to mixins.less
- Moves @min-width-supported variable to variables.less
- Scopes existing Zebra styles at the skin.less file @import level
- Removes selectors ending with ampersands

The last changes makes it easer to reason about changes
specifically when wrapping entire file imports in a selector
since the ampersand ends up inheriting its value
from the skin.less file.

No visual differences are expected with this change.

Bug: T332600
Change-Id: Ife05e28ff38f9c5077e2d9eac653df656566e443
2023-04-19 18:53:11 +00:00
Jan Drewniak 3aaf8666cd Remove CSS selectors for Page Tools feature flag
This removes CSS selectors associated with the Page tools
feature flag, i.e. `vector-feature-page-tools-disabled` as
well as `vector-feature-page-tools-enabled` by removing
the 'disabled' styles and integrating the 'enabled' styles
into the default page tools code.

Bug: T332090
Change-Id: I382e12ca7ce741a3071582ffa84da03c2ba9e343
2023-03-31 11:34:37 -05:00
ksarabia aba94865c2 Removes old style rule
This patch removes the old style rules for .vector-toc-pinned after one
week of cache.
Also removes 'data-name' which was no longer used

Bug: T325032
Change-Id: I7c8d8e51a61646151706b71a1733b1daac5dbd45
2023-03-10 14:31:44 -06:00
Jon Robson d4903b8e57 Remove TableOfContents mustache template and mark layout rules
Follow up to I3484a790ce8ebadf21054ac1d222d5632b2dc5a4

__Template__

The template is not particularly useful - it is only ever
used once in this context and features a static ID which means
it can never be reused. It is also tied to the #vector-toc-collapsed-checkbox
element. In current form it doesn't make sense to have this template.

Maybe in future, I could see an argument for a PinnableTableOfContents component
that wrapped the checkbox and nav element, and generalized the IDs but
currently there's no pressing need or value for that.

__Layouts__

The existing Pinned and Unpinned stylesheets are concerned with how the table
of contents is layed out holistically with regards to other components and
features enabled on the page. I think these should therefore be organized as such.
The way I reason with this, is these styles would be irrelevant in a component
library if the component was rendered in isolation.

Bug: T328719
Change-Id: I9ff0e0eeb35f215a8cae5950d08dc1277b662a71
2023-02-28 00:27:31 +00:00
Renamed from resources/skins.vector.styles/components/TableOfContentsPinned.less (Browse further)