feat: keep dashboard title visible even when user is scrolling [v39]

[jenniferarnesen]

Implements UX-173

Backport of #3095, though that one is closed as obsolete, since a new dashboard design has been introduced for continuous release supported versions.

Key features
Adjusts design of the TitleBar component to remain visible while scrolling a dashboard.
Adjusts design of TitleBar components to reduce visual noise.
Description
This PR implements changes to the Dashboard view mode to make it easier to understand which dashboard is currently selected. Visual design changes also reduce visual noise.
(This PR supersedes #2210, which had become stale and had an unfixable-to-me bug with the progressive loading.)

TODO

• Tweak the magic numbers used for control bar rows. It's noticable once you get to 5 rows of chips
• Margins are missing in edit mode
• In small screen view, the dashboards bar horizontal scrollbar isn't visible
• In small screen view, the search button needs better vertical alignment
• Scrolling in dashboards bar (with a lot of dashboards)

[dhis2-bot]

🚀 Deployed on https://pr-3156.dashboard.netlify.dhis2.org

[cypress]

dashboards-app    Run #5049

Run Properties:   Failed #5049  •  ca8bcc0b15: fix: correct calculation of number of rows with new chip dimensions

Project	dashboards-app
Branch Review	feat/title-bar-improvements-v39
Run status	Failed #5049
Run duration	05m 20s
Commit	ca8bcc0b15: fix: correct calculation of number of rows with new chip dimensions
Committer	Jen Jones Arnesen
View all properties for this run ↗︎

---

Test results
Failures	7
Flaky	0
Pending	0
Skipped	0
Passing	51
View all changes introduced in this branch ↗︎

---

Tests for review

  view_errors.feature • 1 failed test • e2e

View Output Video

Test		Artifacts
Errors while in view mode > Edit dashboard containing item that is missing type		Screenshots Video

  view_dashboard.feature • 2 failed tests • e2e

View Output Video

Test		Artifacts
Viewing dashboards > I expand the control bar		Screenshots Video
Viewing dashboards > I expand the control bar when dashboard not found		Screenshots Video

  responsive_dashboard.feature • 1 failed test • e2e

View Output Video

Test		Artifacts
Small screen dashboard > I view a dashboard		Screenshots Video

  dashboard_filter.feature • 3 failed tests • e2e

View Output Video

Test		Artifacts
Dashboard filter > I add a Period filter		Screenshots Video
Dashboard filter > I add a Organisation unit filter		Screenshots Video
Dashboard filter > I add a Facility Type filter		Screenshots Video

[sonarqubecloud]

Quality Gate failed

Failed conditions
1 New issue
1 New Code Smells (required ≤ 0)

See analysis details on SonarQube Cloud

Catch issues before they fail your Quality Gate with our IDE extension SonarQube for IDE