Using CSS vars to theme color

[AlonsoK28]

Is possible do this?

<ngx-scrolltop [size]="55" color="var(--dark)"></ngx-scrolltop>

Because Ive tried but doesnt work

😉

[bartholomej]

@AlonsoK28 Great idea to use css variables directly 👍
I beleive it is possible, but what kind of color are you trying to set?

There are some options for colors: theme (docs), backgroundColor, symbolColor

As you can see here: https://github.com/bartholomej/ngx-scrolltop#component

For your example it could be like this:

<ngx-scrolltop
  [size]="55"
  backgroundColor="var(--dark)"
  symbolColor="#fff">
</ngx-scrolltop>

Let me know how was it ;)

[AlonsoK28]

Iam using auxilary class for Boostrap 4 colors but doesnt works 😭

<ngx-scrolltop [size]="55" theme="var(--primary)" backgroundColor="var(--primary)" symbolColor="var(--primary)"></ngx-scrolltop>

[bartholomej]

@AlonsoK28 OK, so I realized there was a "bug" in Angular 8, but it works in Angular 9.

As you can see here:
https://stackblitz.com/edit/ngxscrolltop-cssvariables?file=src/app/app.component.html

[AlonsoK28]

Thanks a lot. I'm going to try. 😁

[AlonsoK28]

working on ng 9 perfectly