search

lemoynelibrary / lemoyne

Files used in setting up new web design in LibGuides v2 and elsewhere
5 stars 1 forks source link

askus: redo SVG icons #13

Closed tomkeays closed 7 years ago

tomkeays commented 7 years ago

Want to redo icons so they are less flat.

Also, explore building in a hover state.

tomkeays commented 7 years ago

Note: SpringShare does not currently allow SVG images to be hosted on their site. I've asked them to review this decision. In the meantime, I'm hosting them on lemoynelibrary.org.

tomkeays commented 7 years ago

Nice demo of SVG hover effects that includes change of background color and border effects. Probably don't want the latter.

https://codepen.io/marcinlukasik/pen/iKbdB

tomkeays commented 7 years ago

Springshare got back to me (8/30/17): "[The product manager] filed a note to track requests for support of SVG files, but this is such an uncommonly used format that you're the first to ask since LibGuides was first launched. If we get a growing amount of requests for this we will track them and consider this for future development."

My response (9/1/17): "SVG is an established graphic format, the standard for which has been maintained by the W3C since 1999. It has excellent browser support -- in fact, it has been supported by browsers longer than PNG. For images, such as icons and logos, especially in conjunction with responsive web sites, it is arguably the optimal format."

tomkeays commented 7 years ago

Gonna have to do this anyway with the icons: Embedding: https://codepen.io/tomkeays/pen/QMYrMz Sprites: https://codepen.io/tomkeays/pen/Jyxvvb/ (in-progress)

See: https://www.webdesignerdepot.com/2017/05/how-to-create-and-manage-svg-sprites/

tomkeays commented 7 years ago

Here are my examples with hover effect: