angular-rateit icon indicating copy to clipboard operation
angular-rateit copied to clipboard

Stars are kinda blurred

Open Pehesi97 opened this issue 7 years ago • 9 comments

The stars look like this in some devices. I couldn't find why. Is it plugin-related or device-related?

Pehesi97 avatar Oct 26 '17 10:10 Pehesi97

Hi, I've never seen it before. On which device did this occur? Than I may be able to reproduce it...

akempes avatar Oct 26 '17 10:10 akempes

At first I thought it was related to Ubuntu or Linux, but this is happening on Windows too. Is it possible that minification is causing this?

My tested devices were using latest Chrome, 1080p screens, Elementary OS 0.4 and Windows 10.

Pehesi97 avatar Oct 26 '17 11:10 Pehesi97

Same here. Strangely enough, I see the stars blurred on Chrome and Opera, and a clearer picture is showed in IE/Edge/FireFox....

Using the latest version of each browser - Windows 10 - with Angular 1.4. I'm also embedding the component inside a bootstrap col.

Also, the weird thing is that the stars show correctly (even in Chrome and Opera) in the test site: http://akempes.github.io/angular-rateit/

Still trying to figure it out, but wanted to add more info.

fcarreno avatar Nov 02 '17 17:11 fcarreno

Just found out that increasing the star height, width and background to 20px, as in the example namd Star height/width - makes it look better. Not sure the root cause, though, but that worked for me.

fcarreno avatar Nov 02 '17 18:11 fcarreno

I'll try that later. Thanks!

Em 02/11/2017 16:08, "fcarreno" [email protected] escreveu:

Just found out that increasing the star height, width and background to 20px, as in the example namd Star height/width - makes it look better. Not sure the root cause, though, but that worked for me.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/akempes/angular-rateit/issues/17#issuecomment-341510668, or mute the thread https://github.com/notifications/unsubscribe-auth/AH43heFShk7sax_sitN-FtyNQLPtIN9mks5sygUzgaJpZM4QHVHy .

Pehesi97 avatar Nov 02 '17 18:11 Pehesi97

capturar

This is what I got when I set star-height and star-width..

Pehesi97 avatar Nov 03 '17 14:11 Pehesi97

This is what worked for me:

<ng-rate-it data-ng-model="modelVar" ...... star-width="20" star-height="20">

fcarreno avatar Nov 03 '17 15:11 fcarreno

Unfortunately I can't have 20px stars on my page, but it works with 18px too. Anything below that crashes.

Pehesi97 avatar Nov 03 '17 19:11 Pehesi97

The recommended fix didn't help much for me, but I had changed the step to "0.1" to the default step of "0.5" they looked less blurry.

rmeritz avatar Jan 30 '18 20:01 rmeritz