how to change simplebar color in angular

Question

I implemented a simplebar in my angular application like the one in this demo.

I tried to change the color following the documentation:

.simplebar-scrollbar::before {
  background-color: red;
}

But it did not work, is there any other way to change to color ?

Answer 1

You're trying to change a component style from another component. Or you change the global style or you change the component style like this:

::ng-deep .simplebar-scrollbar::before {
  background-color: red !important;
}

A working example (changing from global style): https://stackblitz.com/edit/simplebar-angular-demo-2hcxnj?file=src/styles.css