react-spinners icon indicating copy to clipboard operation
react-spinners copied to clipboard

Published 20 hours ago • verified publisher icon davidhu2000

Is It Possible To add a variable CSS Color as Color?

Open ljs19923 opened this issue 2 years ago • 3 comments

Hi, I would like to know if it's possible to do this? and if not, how

<BarLoader width={"70%"} height={2} color={"var(--textColor)"} />

I would like to be able to change the color of my loaders from a Css var. If for example I have a dark/white theme, controlled by a css variable, I would like to be able to edit my bar loader directly when the css variable change.

This code works a little bit but the background behind the bar loader disappear :/ the color bar change well

Result:

Screen Shot 2023-09-09 at 14 21 34

What I would like to have:

Screen Shot 2023-09-09 at 14 21 23

Thanks a lot

ljs19923 avatar Sep 09 '23 06:09 ljs19923

https://github.com/davidhu2000/react-spinners/blob/fd4a93c6d8ef999871f46e927edd3dc54cae0ce1/src/BarLoader.tsx#L45

i'm not sure, I will need to see if this is possible. Currently it is just passed as a string

davidhu2000 avatar Sep 15 '23 02:09 davidhu2000

Any news on this? I also need to have ability to apply color as CSS Custom Property

standbyoneself avatar May 29 '24 10:05 standbyoneself

I can confirm that works. Just pass your css variable color like this

<SyncLoader color="var(--theme-primary-color)" />

Mukhammadali avatar Jun 03 '24 08:06 Mukhammadali