fix(snippets): improve Smooth Progress/Volume Bar code

[theRealPadster]

It was using the default ease timing function, so while it was smoother, it still had definite start/stop points. This makes it a fully smooth linear transition with no discernable steps.

[SunsetTechuila]

i think this will be better:

@property --progress-bar-transform {
  inherits: true;
  initial-value: 0%;
  syntax: '<percentage>';
}
.progress-bar {
    transition: --progress-bar-transform 1s linear !important;
}
.progress-bar:hover, .progress-bar:active {
    transition-duration: 150ms !important;
}

[theRealPadster]

Hmm, okay, but that makes it do the jittery thing when you hover over it.

[theRealPadster]

Seems like if you take out the :hover bit and leave the :active, it still jumps fine when you click the bar, but stays smooth on hover.

[SunsetTechuila]

Hmm, okay, but that makes it do the jittery thing when you hover over it.

You can wait for this to be merged then
spicetify/cli#2782

[theRealPadster]

You can wait for this to be merged then spicetify/spicetify-cli#2782

I think it works well enough if you remove the :hover part. Don't really wanna be reliant on the css map being up to date if not needed.

[SunsetTechuila]

as you wish