Skip to content

Adjust styling in group and project lists

What does this MR do and why?

Related to #420800 (closed)

Adjusts styling in Vue groups and projects lists. See #420800 (closed) for styling recommendations that are implemented in this MR.

Screenshots or screen recordings

Groups and projects page

Groups

Desktop
Before After
Screenshot_2023-12-08_at_4.42.55_PM Screenshot_2023-12-11_at_4.05.08_PM
Mobile
Before After
Screenshot_2023-12-08_at_4.47.11_PM Screenshot_2023-12-11_at_4.05.52_PM

Projects

Desktop
Before After
Screenshot_2023-12-08_at_4.43.26_PM Screenshot_2023-12-11_at_4.07.26_PM
Mobile
Before After
Screenshot_2023-12-08_at_4.47.41_PM Screenshot_2023-12-11_at_4.07.49_PM

Front page

Groups

Desktop
Before After
Screenshot_2023-12-08_at_4.45.04_PM Screenshot_2023-12-11_at_4.08.32_PM
Mobile
Before After
Screenshot_2023-12-08_at_4.52.57_PM Screenshot_2023-12-11_at_4.08.56_PM

Projects

Desktop
Before After
Screenshot_2023-12-08_at_4.45.42_PM Screenshot_2023-12-11_at_4.09.27_PM
Mobile
Before After
Screenshot_2023-12-08_at_4.53.53_PM Screenshot_2023-12-11_at_4.09.55_PM

How to set up and validate locally

  1. Open the rails console
    • bin/rails console
  2. Enable the :ui_for_organizations feature flag
    • Feature.enable(:ui_for_organizations)
  3. Navigate to /-/organizations/default/groups_and_projects

Note: the data on this page is mock data while we wait for API support

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 Peter Hegman

Merge request reports