Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update css selector target for button selection #760

Closed
wants to merge 3 commits into from

Conversation

codders
Copy link
Contributor

@codders codders commented Sep 19, 2024

No description provided.

lucaswerkmeister and others added 3 commits September 10, 2024 17:38
This sets up Codex components and design tokens so we can start using
them. No actual components are migrated to Codex yet.

Components from Wikit can be used directly in our own components. The
build is set up so that, when Special:NewLexeme is used within
MediaWiki, Codex will be imported from there; this means that our build
should get substantially smaller once we don’t need Wikit anymore. In
the dev entry point, Codex comes from node_modules/ as expected. (Notice
that the styles are only imported in index.html, so they won’t be
included in our build output either. As far as I could tell, Vite
doesn’t have a CSS equivalent of `external` JS packages in
vite.config.ts yet.)

Design tokens from Codex will have to be imported directly into each
component that uses them, where they will end up being included in the
build. I would’ve liked to use them as CSS variables instead (aka custom
properties), but only a small subset of design tokens is actually made
available as a CSS variable in MediaWiki (and even then it depends on
the skin), so I don’t think this is possible.

Combined, this means that when MediaWiki upgrades to a new Codex
version, Special:NewLexeme will use the new versions of the Codex
components (and their styles) immediately, but the design tokens used in
our own components will stay outdated until this repository is updated
and a new build is pushed in WikibaseLexeme.git.

Bug: T369505
Using the Button component from Codex instead of Wikit is
straightforward – we just need to rename a few props.

Using the variables is a bit more involved. Not only do we need
replacement variables from Codex that aren’t always clear, but the
small-text mixin used for the copyright notice also relies on the Wikit
variables. So for now, this change just keeps importing the Wikit
variables and lets Codex override them wherever they both use the same
name.

Bug: T369505
@lucaswerkmeister
Copy link
Member

I’ve adopted the fix in #761, thank you!

@codders codders closed this Sep 20, 2024
@codders codders deleted the feat/fix-new-lexeme-form-test-20240919 branch September 20, 2024 07:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

2 participants