• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Replace RSS icons with CSS

Andy.N

Well-known member
#1
On the forum home, there are RSS icons for each forum as well as on the footer. How can we use CSS trick to replicate that icons.
The benefit would be to have an image that scale much better on retina screen. And probably may cut down on http requests

http://rathersplendid.net/cssicons/
 

Shelley

Well-known member
#2
I could be wrong but I doubt you'll be saving on any http requests since the spritesheet is being pulled anyway but i could be mistaken. Yeah retina display, you gotta love it. .svg :)
 

Andy.N

Well-known member
#3
Yes. U suspect that much. What option we have now until xf fully support hidef screens?
Svg sprites sheet?
 

Shelley

Well-known member
#4
Yes. U suspect that much. What option we have now until xf fully support hidef screens?
Svg sprites sheet?
Svg sprites (i've read about it) haven't looked too much into it but I suppose you would need "source files" for those images so you would need to contact the devs (goodluck with that) you don't want to be working with pre-formatted images, you want to be directly dealing with the vectored icons (.psd/source file) that reside on the xf spritesheet.
 

Luxus

Well-known member
#5
If you want to get rid of http requests completly you can try to recreate those RSS icons with pure CSS.
Look at what this amazing guy created only with CSS: http://www.legendofdrew.com/css-shape-creations/
If you can make Kirby with CSS then you sure as hell can make RSS icons with CSS as well.

Edit: oops, sorry. I see you weren't talking about using spritesheets, but creating these icons with pure CSS in the first place.

You have the site with RSS icons created with CSS. You just need to rip the html off those icons and copy the CSS.