Background
As a result of the design decisions made in T382024: Shadows: revisit box-shadow-drop tokens, we need to implement the new shadows within Codex. Original iteration was in T297003: Define the system's box shadow styles.
Developer notes
The reason for providing box-shadow shorthand tokens is that we have a few often used box-shadow combos, but then also numerous colors with just a few directionalities. Making this split useful for consistency and application. That was also the original plan on splitting the directionalities from the colors.
box-shadow-color-base at a commit in the past has changed from before transparent color to a solid black. In order to make base not be a transparent color, which seemed bad to designers and myself behind the decision back then. -base has just never been used in action ever since.
Also for completion usage of
CodeSearch all transparent carrying shadows and CodeSearch all opacity 0 carrying ones.
Accessibility note
Even though the box-shadows with border combinations aren't currently 100% fulfilling contrast, we refrain for the time being from lowering the contrast even further to accommodate a bigger group of users of different visual acuity or device low contrast environments (sunset and similar).
Acceptance criteria
Design
- Include the new shadows in the Figma library
Development
- Restructure box-shadow tokens
- Update box-shadow tokens
- Add new 300 level/large box-shadow token
- Deprecate 500 level/xx-large box-shadow token
- Update components to use or not use new shadows
- Write brief guidance on box-shadow page
