Can i use classes to change css variables?-CodePudding

Can I use classes to change CSS variables in scss file? it works but I want to know if it's the right way to do it

.header {
  --transform: translate(-50%, 0);
  transform: var(--transform);
  &--hide {
     --transform: translate(-50%, -84px);
  }
  &--show {
     --transform: translate(-50%, 0);
  }
}

// instead of this:

.header {
  transform: translate(-50%, 0);
  &--hide {
     transform: translate(-50%, -84px);
  }
  &--show {
     transform: translate(-50%, 0);
  }
}

CodePudding user response：

Yes you override in your class the css variable like that:

:root {
  --test: red;
}    
.header {    
  --test: green;
  color: var(--test);       
}

<div >abc</div>

Note:: But I can't imagine a use case right now!?