Changes

Jump to: navigation, search

Accessibility/Design Guide

489 bytes added, 21:08, 15 June 2023
Add blur guidance
* Controls, sidebars, toolbars, dialogs, and other views should be bounded by a solid, 1px border at minimum. This border should inherit the component's foreground color unless the component requires a combination of colors (like the "selected tab" example above). In addition, the component should have adequate padding to ensure the border does not reduce the legibility of the component's content.A border is not necessary if the component's (semantically appropriate) background color differs from the background of its embedded component.
* With HCM enabled, the set of styles our style system will permit is reduced. Properties [https://searchfox.org/mozilla-central/search?q=ignored_when_colors_disabled&redirect=false here] with a value of `ignored_when_colors_disabled=True` may be tweaked by the style system before computed style is set. Learn more [https://searchfox.org/mozilla-central/rev/25997ce8267ec9e3ea4b727e0973bd9ef02bba79/servo/components/style/properties/cascade.rs#388 here].
* Blur effects, drop shadows, semi-opaque overlays, and other potentially distracting styles should be removed and/or replaced with their solid colour equivalent. For example, if a modal renders above content on a blurred background in non-HCM, when HCM is active it should render on a solid Canvas colour background. Drop shadows should be replaced with borders, following the guidance above. On most platforms, enabling HCM also enables "Reduce Transparency" -- we should respect this.
=== Independent of HCM (with or without HCM enabled) ===
Confirm
35
edits

Navigation menu