Skip to content

Move labels.scss to page_bundles behind FF

Deepika Guliani requested to merge dg-page-bundles-migration-FF into master

What does this MR do and why?

This MR closes Convert stylesheets/pages/labels.scss into page... (#239844 - closed). In addition to that , this MR introduces these changes behind a new FF named page_specific_styles. Adding these changes behind an FF gives us room to fix them in a timely manner without the site looking broken ( since this is only UI ) and not cause any incidents 🤞

We can turn this FF on for some users and test it out for any uncaught regressions.

History for incident that led to the FF being introduced is here - 2023-09-11: Some project sites looks are broken (gitlab-com/gl-infra/production#16345 - closed)

We can remove the FF completely when all the files in _page_specfic_files.scss are fully migrated

Thanks to @leipert for the idea and the pairing session here 🙇

Screenshots or screen recordings

The following screenshots in both the tables are in the same order as mentioned below:

  1. Admin labels : Admin > Labels
  2. Group labels : Group > Manage > Labels
  3. Project labels : Project > Manage > Labels
Before After
Screenshot_2023-09-06_at_4.22.43_PM Screenshot_2023-09-06_at_4.30.03_PM
Screenshot_2023-09-06_at_4.24.26_PM Screenshot_2023-09-06_at_4.29.35_PM
Screenshot_2023-09-06_at_4.26.00_PM Screenshot_2023-09-06_at_4.28.06_PM
Dark Mode before Dark Mode after
Screenshot_2023-09-06_at_4.10.54_PM Screenshot_2023-09-06_at_4.10.54_PM
Screenshot_2023-09-06_at_4.17.03_PM Screenshot_2023-09-06_at_4.12.03_PM
Screenshot_2023-09-06_at_4.16.22_PM Screenshot_2023-09-06_at_4.13.17_PM

How to set up and validate locally

  1. Turn the FF on
    Feature.enable(:page_specific_styles)
  2. Try visiting/playing with labels list at the project/group and admin level as mentioned in the screenshots
  3. Check that no styling is broken
  4. Check Creating new labels as well as well
  1. Repeat the steps for dark mode

Make sure nothing is broken.

Also , check that nothing is broken when the FF is off 🙂

MR acceptance checklist

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

Edited by Deepika Guliani

Merge request reports