chakra-ui-vue icon indicating copy to clipboard operation
chakra-ui-vue copied to clipboard

Ability to totally remove System UI styling

Open kissu opened this issue 4 years ago • 0 comments

Is your feature request related to a problem? Please describe. I wish to use Chakra only for it's a11y capabilities and not the styling, for which I do already have TailwindCSS. How can I strip the System UI styling?

Describe the solution you'd like Allow to not load any default theme and provide it's own styling. Will also probably decrease the total bundle size in cases it's not used.

Describe alternatives you've considered

  • using a more specific CSS selector + @apply overrides Chakra but it's really annoying and time consuming
  • using important: true in tailwind.config.js is working but I'd rather avoid this kind of bazooka if possible
  • don't give a penny and say f*** to a11y but... 😕

Additional context This is the code that I do have

<c-text as="span" class="font-script">family not applied</c-text>
<span class="font-script">family applied</span>
<c-text class="forced-font-script">forced family with @apply</c-text>

This is the rendered content image

And this is the CSS for the font-family of the 3rd tag. image

As we can guess, the 1st tag (aka c-text as="span" class="font-script" combo) is having it's font-script class overriden by the default -apple-system,BlinkMacSystemFont... families.

kissu avatar May 09 '21 16:05 kissu