you are viewing a single comment's thread.

view the rest of the comments →

[–]enefi 5 insightful - 4 fun5 insightful - 3 fun6 insightful - 4 fun -  (4 children)

They [svgs] look about equally blurry compared to the png versions

If you have a system (scaling in OS/DE) and a browser set in a way, that it renders 1:1 (pixel size of the rendered image is same as virtual pixel size of a page in browser), then they should look pretty much same. But I think QHD, 4k and other higher resolutions on desktop are becoming more common; on mobile icons and graphical elements are usually bigger naturally. Maybe I could increase stroke width slightly (rays of a bulb look a bit thin/dark)?

  • Alter the existing CSS background colors of div.arrow. unfortunately this covers both the button and the score that displays beneath it for post/link voting buttons
  • svgs with colored backgrounds depending on vote state, the old saidit approach*
  • voted and unvoted svgs

I think combining those approaches would work fairly well - a voting "box" (including score) changing background color and different on/off svg pictures.

adding another div or span to hold just the vote icon, to more cleanly style it with CSS. I opt out of this, it's at least an 8 hour project requiring javascript changes. but I can guide anyone interested in going this far

It's cleaner (personally I would use just img tag), but in itself it doesn't bring much value. Unless those svg files are inline (svg tag with all its data inside), I believe insides cannot be styled, meaning it cannot be animated (only inline svgs can be; either inserted directly to HTML by backend, or later by frontend).

I am willing to donate more free time. I think making those static (non-animated) svgs shouldn't take too long, I'd guess 1-2 hours?

I could try setting up local instance of saidit and try to integrate the animated icons, but a result is not guaranteed (I am not proficient in back-end stuff and never done anything in that templating thing which is used). That would most likely take much longer (because of the setup, I don't think the modification of styles and templates would take longer than 2-4h, I should be able to reuse a lot from the browser extension). But as I wrote earlier, I am not sure if admins/devs/users actually want those animations.

I can't say when I could get to it, at soonest Thursday afternoon (CET), but more likely on the weekend.

I would like to avoid an awkward situation of making something which in the end wouldn't get used. Can I get an official word on how should I proceed? (To be honest, I am not entirely sure who calls the shots, m7?)

[–][deleted] 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (0 children)

Good call enefi, the svgs look great on my phone with the higher ppi or whatever.

The animated icons sound like they might be more trouble than they're worth. Getting an img tag added or any html change is a huge burden.

Thanks for getting us this far. Yep, magnora7 is the shot caller.

[–][deleted] 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (1 child)

Also if you want to go an extra mile, the yellow of the lit bulb doesn't seem to match the yellow of the smiley face very well. A little more orangey for the bulb maybe. Maybe I'm wrong or drunk.

[–]JasonCarswell 3 insightful - 3 fun3 insightful - 2 fun4 insightful - 3 fun -  (0 children)

Fantastic work everyone! I knew you'd get there. Yesterday was dim, but today's looking bright.

I've been hesitant to chime in too much, but now seeing that not only have the icons been improved and actually applied and whatever bugs were there have been figured out, I'm willing and keen to pitch my own improvements on the improvements for people to consider supporting, or not. I'd like to work from the current 4 or 8 SVGs if possible, and thanks!

cc /u/enefi

[–][deleted] 3 insightful - 2 fun3 insightful - 1 fun4 insightful - 2 fun -  (0 children)

Would you mind making a greyscale version of lol.svg if it's easy? I tried using an online convertor, but it changed the source code for the svg dramatically. Right now when you vote funny with fresh browser cache, you can see the icon jumping around.