Giters

fredolss / rater-js

Star rating widget for the browser. Unlimited number of stars. No dependencies. No Jquery required.

Home Page:https://fredolss.github.io/rater-js/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Is it possible to have some margin between stars?

alinoudev opened this issue · comments

commented

Is it possible to have some margin between stars?

commented

Think the best solution for now is to use your own svg image and add the spacing on the actual svg image. The background image repeats and there is no way to add spacing to a repeated background image.

commented

svg

I had my own svg image with a bit of white space on the left and right of my star icon but the decimal is off because of the extra margin. So for example when the rating is 3.9, rater-js only paints the 3.7/3.8 and I can clearly see it is not 3.9.
Since like you said it's a repeated background I don't know if there is a good solution for this. Maybe with some recalculation of the %-tage of the background that fills the rater taking into account the extra margin in the svg image.

It would be nice though if in your initialization of rater-js in your javascript could specify something like:

"spaceBetweenStars": "5px"

commented

I think "spaceBetweenStars" is a good idéa. But maybe just adding the extra margin to starSize will work? Did you try this?