Option to start or stop at different locations

larsenwork / postcss-easing-gradients

PostCSS plugin to create smooth linear-gradients that approximate easing functions.

https://www.npmjs.com/package/postcss-easing-gradients

MIT License

923 stars 22 forks source link

Option to start or stop at different locations #10

Open JacobDB opened 5 years ago

JacobDB commented 5 years ago

Sometimes I need to start a gradient at a point past 0% or stop it before 100%. Would it be possible to add support for this?

For example, a gradient such as:

linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 25%, rgba(0, 0, 0, 0) 100%)

JacobDB commented 3 years ago

I just ran in to this issue on another project; I'd still love to see this in a future update – @larsenwork have you had a chance to consider this feature?

JacobDB commented 3 years ago

To adjust the starting point, the formula seems to be $location * (1 - ($start_point / 100)) + $start_point for each stop between 0% and 100% (excluding 0% and 100%)