score:1

Accepted answer

you can't change a sass variable during runtime because sass is compiled to css during your build step. but if i was in your situation i would try to replace the sass variable with a css custom variable and see if it works, should be doable i think. (won't work in ie11 though)

:root {
  --one-year: 5s;
}

.planets__earth-orbit {
  width: 20rem;
  height: 20rem;
  animation: rotation var(--one-year) linear infinite;
}

and update the variable value on the root element via javascript

rootelement.style.setproperty('--one-year', `${newvalue}s`);

Related Query

More Query from same tag