Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Style variables do not work #606

Closed
iMogs370 opened this issue Jun 12, 2024 · 1 comment · Fixed by #619
Closed

Style variables do not work #606

iMogs370 opened this issue Jun 12, 2024 · 1 comment · Fixed by #619

Comments

@iMogs370
Copy link

iMogs370 commented Jun 12, 2024

Here are my styles provided in styles.scss:
:root {
--scrollbar-thumb-color: rgba(255, 0, 0, 0.2) !important;
--scrollbar-track-color: red;
}

Element:
<ng-scrollbar [orientation]="'vertical'" [visibility]="'native'">
global

Expected Behavior

What behavior were you expecting to see?
Track color to go red, thumb to go redish as set in the variables

Actual Behavior

What behavior did you actually see?
When inspecting the css in the chrome inspector, the global variables are stricken out and the vars on the element are being used. The scrollbar is in it's default settings/colors.

Environment

  • Angular: 18
  • ngx-scrollbar: latest
  • Browser(s): chrome
  • Operating System (e.g. Windows, macOS, Ubuntu): windows
@MurhafSousli
Copy link
Owner

For the time being, you should use the element selector to override the CSS variables, we still need to improve it #591

@MurhafSousli MurhafSousli linked a pull request Jul 7, 2024 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants