Overhaul CSS in performance bar in Dark mode v1

What does this MR do?

Overhaul CSS in performance bar in Dark mode to make these text visible to mainly fix the regression happened from !52775 (merged) (%13.11).

  • color: #999 ($gray-300) + #fff ($gl-text-white) + #dbdbdb ($gray-100) => #dbdbdb ($gray-100)
  • background: many duplications => eliminated

Most of them has not been changed after gitlab-foss!11439 (merged).

Screenshots v2

env before after
dev dev dev-after-v2 (selection is just artifact)
stg (omitted) stg-after-v2 (simulated)
prd production-cny prd-after-v2 (simulated)
select/option box (dev) on Chrome - chrome-select-closed
select/option box (dev) on Chrome (pull-down) - chrome-select-open
select/option box (dev) on Firefox - firefox-select-closed
select/option box (dev) on Firefox (pull-down) - firefox-select-open

Screenshots for avoiding regressions

Screenshots in Indigo theme:

env after
dev dev-indigo-v2
stg stg-indigo-v2
prd prd-indigo-v2
Screenshots v1
env before after
dev dev dev-after
stg (omitted) stg-after (simulated)
prd production-cny prd-after (simulated)

Screenshots for avoiding regressions

Screenshots in Indigo theme:

env after
dev dev-indigo
stg stg-indigo
prd prd-indigo

Does this MR meet the acceptance criteria?

Conformity

Closes #330702 (closed)

Edited by Takuya Noguchi

Merge request reports

Loading