Briefly describe the Initiative.
Recent bugs shown tag code to depend on the exact elements, their order or selector specificity, and tailored definitions scattered far from the original pill design code. It would be ideal if the whole styling logic was in one place, esp. on single element, and not relying on list item + anchor nesting.
Additional context
There's styling defined both for the list item, and anchor today — as not all tag pills are clickable links (e.g. is-selected / implicit defaults etc.), however conversely the links inside have their own styles for interaction color and padding the hitzone — and ideally the two nested elements ought to match, or overlap precisely to not show any tiny differences through.
Ideally the styling would only be on the LI for both plaintext and anchor content, however ideally any link/focus etc. adjustments are better on the actual links than arbitrary elements, so making the links' decoration as invisible as possible to leave to the parent might cause a11y challenges. Conversely only styling inside links as pills means non–link based pills will need to redefine the same on the side, again.
Add any related issues
Flagged during applying band–aid patches for #3198 and #3281 as something that needs refactoring.
Who is the audience
External consumers having the components exposed consistently. Internal QA easier between page types.
Briefly describe the Initiative.
Recent bugs shown tag code to depend on the exact elements, their order or selector specificity, and tailored definitions scattered far from the original pill design code. It would be ideal if the whole styling logic was in one place, esp. on single element, and not relying on list item + anchor nesting.
Additional context
There's styling defined both for the list item, and anchor today — as not all tag pills are clickable links (e.g. is-selected / implicit defaults etc.), however conversely the links inside have their own styles for interaction color and padding the hitzone — and ideally the two nested elements ought to match, or overlap precisely to not show any tiny differences through.
Ideally the styling would only be on the LI for both plaintext and anchor content, however ideally any link/focus etc. adjustments are better on the actual links than arbitrary elements, so making the links' decoration as invisible as possible to leave to the parent might cause a11y challenges. Conversely only styling inside links as pills means non–link based pills will need to redefine the same on the side, again.
Add any related issues
Flagged during applying band–aid patches for #3198 and #3281 as something that needs refactoring.
Who is the audience
External consumers having the components exposed consistently. Internal QA easier between page types.