Stacks icon indicating copy to clipboard operation
Stacks copied to clipboard

Add unset and none classes

Open dancormier opened this issue 3 years ago • 0 comments

We should add some handy [x]-unset and [x]-none classes.

Context @aaronshekey says (June 1, 2021):

I think an interesting chore would be creating a none and unset for just about every CSS property. We were limited by IE11 and Edge 18 there. No more! For example, ff-unset or z-unset

Classes that already exist*

[x]-none
  • background (.bg-none)
  • background-image (.bg-image-none)
  • box-shadow (.bs-none)
  • clear (.clear-none)
  • display (.d-none)
  • float (.float-none)
  • flex (.fl-none)
  • hyphens (.hyphens-none)
  • list-style (.list-ls-none)
  • outline (.outline-none)
  • pointer-events (.pe-none)
  • text-decoration (.td-none)
  • text-transform (.tt-none)
  • user-drag (.ud-none)
  • user-select (.us-none)
[x]-unset
  • box-sizing (.box-unset)
  • display (.d-unset)
  • font-style (.fs-unset)
  • line-height (.lh-unset)
  • list-style (.list-ls-unset)
  • overflow-wrap (.ow-unset)
  • position (.ps-unset)
  • text-align (.ta-unset)
  • text-transform (.tt-unset)
  • transition-property (.t-unset)
  • transition-delay (.t-delay-unset)
  • vertical-align (.va-unset)
  • word-break (.wb-unset)

*I think I got them all here

Potential issues

From MDN - unset

unset can be applied to any CSS property...

We could literally do this for every CSS property. I'm assuming we don't want to (at least, until we're hardcore purging our unused CSS).

TODO

  • [ ] Determine a reasonable subset of [x]-unset classes to add
    • [ ] ...and add them
  • [ ] Determine a reasonable subset of [x]-none classes to add
    • [ ] ...and add them
  • [ ] update docs

dancormier avatar Jun 04 '21 17:06 dancormier