Safari 10/11 support by using rgb with alpha values

crswll / tailwindcss-theme-swapper

A helper for getting tailwind values into css custom properties and switching them between media queries and classes. You can try it out here: https://play.tailwindcss.com/Gt21fePNvv

320 stars 15 forks source link

Safari 10/11 support by using rgb with alpha values #18

Closed TomDeSmet closed 2 years ago

TomDeSmet commented 3 years ago

This plugin breaks on Safari 10/11 because those browsers don't support alpha channels inside rgb(). I've taken a look at your code and you choose to use rgb() but also add the alpha value to it in this notation: /[alpha] which older browsers don't understand.

Why not use rgba()? That's supported by all browsers.

Those browsers also don't support the notation with spaces you use, they only support comma's in the rgb value.

crswll commented 3 years ago

Ah, that stinks. I can probably push up a fix for that later today. I saw your PR. I'll update the tests and stuff and merge it sometime this week.

TomDeSmet commented 2 years ago

Any news on this?

crswll commented 2 years ago

Hey! Sorry. Started a new job pretty much right after you opened this issue and spaced on it.

Thinking about it again I'm not sure it makes sense since tailwind uses rgb(r g b / o) itself and the docs say In general, Tailwind CSS v3.0 is designed for and tested on the latest stable versions of Chrome, Firefox, Edge, and Safari. It does not support any version of IE, including IE 11 so I think it makes sense to stick to what it supports.