Drop desktop-first CSS utils
What does this MR do and why?
This drops a few invalid desktop-first CSS utils. Some of those have made their way into GitLab UI as we did not have clear-enough guidelines for using mobile-first utils. We are now progressively migrating to a fully mobile-first approach.
This drops some of the least uses desktop-first utils.
- The first 3 commits rewrite usages of the desktop-first
gl-xs-display-none
util to the mobile-first equivalent (gl-display-none gl-sm-*
). -
a7a1b481 drops the only usage of the desktop-first
gl-xs-mb-4
util in favor ofgl-gap-4
, which lets us remove some complexity from the affected component, but also causes a small visual change in desktop. -
e63a2fc1 drops the desktop-first
gl-sm-pr-5
CSS utils from the projects' package and registries settings. This results in a visual change as well, but the padding in question seemed unnecessary. - 6f19be75 revisits the padding in projects' visibility settings the outermost padding, which varied depending on the viewport's width, is now set to a fixed value. The inner padding is rewritten with mobile-first utils.
Screenshots or screen recordings
a7a1b481)
Group > Analyze > CI/CD analytics (Visual change in desktop viewports. There's slightly more space between both stats:
Before | After |
---|---|
e63a2fc1)
Project > Settings > Packages and registries (Visual change in mobile viewports. The right padding has been removed from the select input:
Before | After |
---|---|
6f19be75)
Project > Settings > Visibility, project features, permissions (Visual change in desktop viewports. The outermost padding has been decreased to match the mobile viewports':
Before | After |
---|---|
How to set up and validate locally
- Visit the affected pages (see screenshots section above).
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Edited by Paul Gascou-Vaillancourt