Skip to content

Replace duplicate SCSS variables with design tokens from gitlab-ui

Scott de Jonge requested to merge dark-mode-design-tokens into master

What does this MR do and why?

Replace duplicate SCSS variable definitions in _variables.scss with design token SCSS generated output from GitLab UI.

Design tokens provide a single source-of-truth for color definitions and automates SCSS/CSS/JS variable compilation.

This MR also renames $indigo- variable usage to $theme-indigo- to align with other theme color variables names.

How to set up and validate locally

  1. On master: save copies of GDK output CSS stylesheets (e.g. application.css, application-utilities.css) locally
  2. On branch: save copies of GDK output CSS stylesheets
  3. Diff stylesheets, there should be no changes e.g. css-diff.zip 
diff -u application-before.css application-after.css > application-diff.diff
diff -u application-utilities-before.css application-utilities-after.css > application-utilities-diff.diff

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to: #430058 (closed)

Edited by Scott de Jonge

Merge request reports