1832120 - Reduce font-weight of Protections Panel labels

Status: NEW

(Firefox :: Protections UI, enhancement, P3)

Description

[Mark Striemer [:mstriemer]]

Attachment: image.png

Based on our design system, we don't expect labels on inputs such as the ETP toggle to have a bold font-weight anymore. In bug 1801936 the toggle is being updated to use our reusable moz-toggle element which makes the Cookie Banner Reduction label stand out and be too bold

We should update the Cookie Banner Reduction (and current toggle, if it's still around when we work on this) so that it is no longer bolded. Similarly the spacing and font colour for the On/Off for this site description text should be updated to follow our label/description format where it is color: var(--text-color-deemphasized) and there is an 8px gap between the label and the description

The .protections-popup-switch-header class [1] is setting the increased font-weight. The Cookie Banner Reduction toolbarbutton [2] could use gap: 8px on its vbox

[1] https://searchfox.org/mozilla-central/rev/373d05f4eabdb90a6480d5d36d983b8bff36c9d8/browser/themes/shared/controlcenter/panel.css#578
[2] https://searchfox.org/mozilla-central/rev/373d05f4eabdb90a6480d5d36d983b8bff36c9d8/browser/components/controlcenter/content/protectionsPanel.inc.xhtml#79-89