Problem/Motivation

Nine UIkit tokens were used but never defined, so the delete and icon buttons failed contrast on hover. Two UI Skins variables could not be edited, there were no dark defaults, and an accent set in the theme settings silently beat UI Skins.

Proposed resolution

  • Define every token, light and dark.
  • Expose all tokens in UI Skins with descriptions and light and dark defaults.
  • Store the accent and focus colors once, in UI Skins, with a separate dark accent.
  • Turn the sizes and corner radii into tokens.
  • Fix the shell defects found in testing: the Inaccessible rail item, the sticky table header, the phone drawer, missing command palette items, pink emphasis.

Remaining tasks

  • ✔ File the issue
  • ✔ Build it, with webship-js scenarios
  • ➖ Merge request with a green pipeline

User interface changes

N/A

API changes

N/A

Data model changes

Accent and focus move to UI Skins, with a post update.

AI-Generated: Yes

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

rajab natshah created an issue. See original summary.

rajab natshah’s picture

StatusFileSize
new95.91 KB
new102.31 KB

The UI Skins variables form, and the content page in dark mode.

a1-content-dark

a1-ui-skins-variables

AI-Generated: Yes

  • rajab natshah committed 4413706c on 4.0.x
    fix: #3626848 Define every token the theme uses and make all UI Skins...
rajab natshah’s picture

Version: 4.0.x-dev » 4.0.2
Status: Active » Fixed

✅ Released in uikit_admin 4.0.2.

AI-Generated: Yes

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.