fix(ui): Replace deprecated design tokens in sidebar.scss

Replaces deprecated color design tokens in sidebar.scss with their semantic equivalents so the file no longer triggers Danger warnings on every MR that touches it.

Files changed

Change File
Modified app/assets/stylesheets/framework/sidebar.scss: $gray-100 → var(--gl-action-neutral-background-color-hover), $blue-600 → var(--gl-status-info-text-color) / var(--gl-status-info-icon-color)

The three replacements:

  • Collapsed-sidebar hover highlight (background-color): $gray-100 → var(--gl-action-neutral-background-color-hover). This is the token GlButton uses for its tertiary-variant hover, which is the interaction this hover mimics (per review suggestion from @nickleonard).
  • Pending-todo icon color: $blue-600 → var(--gl-status-info-text-color).
  • Pending-todo icon fill: $blue-600 → var(--gl-status-info-icon-color).

An earlier draft of this MR used --gl-background-subtle and --gl-text-info / --gl-fill-status-info, which are not real custom properties. They were inferred from the gl-bg-subtle / gl-text-info utility class names. With no fallback, an undefined var() drops the whole declaration, so the hover would have rendered transparent and the icon would have lost its blue. The tokens above are the actual custom properties defined in @gitlab/ui's token build.

Screenshots or screen recordings

No visual change. The semantic tokens resolve to the same computed values.

How to set up and validate locally

  1. Open any page with the collapsed sidebar (e.g. a project page at a narrow viewport).
  2. Hover a collapsed sidebar item. The background highlights.
  3. Inspect the pending-todo icon. It renders blue.

No tests added: this is a pure CSS token rename of three declarations, consistent with the maintenance::refactor label.

Acceptance Checklist

All N/A. Three-line CSS token rename, no backend/database/auth/feature-flag changes. Danger no longer reports deprecated-token warnings for this file.


This contribution contains AI-generated code and documentation.

Edited by kier

Merge request reports

Loading
Loading