timpietrusky / weloveiconfonts Goto Github PK

The icons are not sorted alphabetically. It could be an option to toggle. Or something else.

The top right box showing the class of the clicked icon, the number of fonts in collection and a few other things could be slightly improved to be a little bit more readable.

Since it's highly transparent, it's somewhat a bit difficult to read its content. Maybe reducing transparency would be alright.

Currently running Chrome Canary on Windows XP.

The user must see which license each font has. Otherwise it's not possible to use it in commercial environments.

It would be awesome to see the CSS value besides the icon-class.

Remove the body and add something like this:

[class^="<iconname>-"]:before, [<iconname>*=" <iconname>-"]:before {
  font-family: <font-name>;
}

Reference: Font Awesome

There are a lot of projects where I only need say 5 - 10 icons. I'd love the option to setup a custom build to keep the file size down. I know this is a huge undertaking, just throwing it out there though.

As we said during our private talk, you should add a header :

Because I think a header is more "attractive" and give structure to your document

actually, on WLIF , when you arrive on the website, you have 2 blocks of informations and you can be lost, and don't know where to start.

http://css-tricks.com/flat-icons-icon-fonts

Add a search field to search for icon fonts because Luky Vj tweeted me this:

Hi dude, you know what ? You really should think about adding "search-bar" in http://weloveiconfonts.com :)

https://twitter.com/LukyVJ/status/300210968498159616

The box showing the number of fonts in collection, clicked icon class and such is overlapping part of the content. Hopefully, it's transparent enough to make the content readable but it would be better of screen or something.

Icon collections have a weird and huge left padding, stretching them to the right. And scrollbars could be lighter to take less space.

Underline on links are overlapping text on the next line.

Currently running Chrome on Samasung Galaxy S2.

Would be nice to have some kind of navigation to jump to my favorite icon font!

When you hover an icon, the only thing you want to see is the name of the icon, not the fontname-icon. So please remove it from the icon:hover!

I tried this in my local installation of wordpress and its working without any problem. But when I try the same in my live site it is not working. My blog digitaladvices.com.
Can you please help me to solve this issue?

Font Awesome uses a lot of default styles WeLoveIconFonts removed. Please have a look here, line 32 to 75: https://github.com/FortAwesome/Font-Awesome/blob/master/css/font-awesome.css

Currently, it is impossible to port a project from Font Awesome to WeLoveIconFonts because of these styles missing.

Any chance you'd put them back or give an option to have them?

Thanks a lot.

Just some simple syntax highlight for the examples '& output!

Hi,

I'm author of http://iconmart.in/ . If you like feel free to add these font icon set in current website.

Thanks,
Yash

It looks like we can't remove a selected icon font from the collection. It would be pretty cool if we could do that.

Remove any max-width shit breakpoints because they make no sense.

Any chance you'd include a way to get the IE7' stylesheet for Font Awesome?

You should add project site next to the repository description, so nobody needs to scroll down. If you don't know how I can help. 😉

When a hover's an icon, the icon is "highlighted" with a black background. It would be good if the highlight remains when the user clicks an icon.

If you change the list view and reload the page, it's back to the default. Would be nice to save those stuff in localStorage.

Examples based on the fonts in the colletion would be nice too 👯

Someone needs to create the CSS for Modern Pictograms like this:

.modernpictograms-camera:before { content: "A"; }

All icon codes are in this picture:

Love your tool, thank you very much for creating this.

Do you plan to implement requests over https protocol at some point in the future?
Currently, when our users access our website through https and it starts downloading resources over http, the browser throws a warning, indicating that some items are downloaded over an unsecured connection. I know it's a matter of perception but it can be a bit confusing to the user and lowers their trust level in using the web page they are on.
The workaround is currently to download the css and the font files to the local server to access them through a secure connection.

I understand that this might be very low on the priority list, as it requires monetary expenses in addition to time. Have you thought about setting up a 'Donate' link? It could help cover the cost of security certificates. People who value your work and want to support your project will help out. I know I would.

I have a another idea, have a look http://netdna.webdesignerdepot.com/uploads7/how-to-create-a-simple-css3-tooltip/tooltip_demo.html

http://www.w3.org/TR/css3-syntax/ , point 3th.
You don't specify any charset in css files.
And this throw an error when you test your page with the mobile validator (http://validator.w3.org/mobile/).

"One of the resources required to render the page (most likely a CSS style sheet) does not declare its encoding as UTF-8 in an HTTP Content-Type header. Check that its content is properly encoded, and consider declaring its encoding at the HTTP level"

If this were the unique effect, i won't care about it, but, because of that, there are errors in certain mobile browsers (at least), that affects to certains font icons, delivering that very well known and pretty rhombus with a question mark inside.
A image example from Dolphin Browser, where the entypo-link icon fails:
http://dl.dropbox.com/u/11008160/screens/SC20130210-132126.png

I think that this should be easy solved by following the css3-syntax and adding a
@charset "UTF-8";
(or the proper encoding) in the first line of the css that weloveiconfonts serves.

Like curiosity: google web fonts fails on the same point (I will try to send to it the same message, hoping to be listened :p).

And that's all. Thanks for your GREAT work. I really love weloveiconfonts (yeah: pun intended :D).

Trying to be as objective as possible, I do feel the design of the site can be toned down quite a bit. The huge icons in the upper right hand corner consume a lot of screen real estate on my laptop, and the grey background with the heart and opaque elements at the top of the page is seemingly random/distracting.

Don't want you to change anything unless you agree at all. Thoughts?

Just minify the json files to reduce overhead.

We can't use a instead of an @import for now. Since it's probably a better solution -performance speaking- it may be a good idea to add this feature.

http://genericons.com/

Font Awesome 3.0 was released http://fortawesome.github.com/Font-Awesome and it should be updated here.

The created collection should be downloadable.

Based on this reddit.

when you click button (+) the list of fonts resizes.

I can't see the title of font in some cases

have a look

for scrolling you can use this: http://manos.malihu.gr/jquery-custom-content-scroller/
demo: http://manos.malihu.gr/tuts/custom-scrollbar-plugin/multiple_scrollbars_example.html

I hope it is useful.

The main problem with the Can I Use Widget is you have to host everything everytime. It may be an issue, especially when it comes to hosting fonts.

Any chance WeLoveIconFonts.com could become a CDN for the fonts used by the CIUW?

The entypo icons for phone & rss are the same (both rss). This needs to be fixed.

Currently, it is hard to figure out what to call the class of each icon, since the names are hidden except on hover on the site, and have their own naming convention. It would be great to bundle a file with the download which has a reference for class names for all of the icons in a font.

Don't load all the fonts at once. Load them when they are needed.

Resources:

• http://filamentgroup.com/lab/ajax_includes_modular_content/
• https://gist.github.com/1873752
• http://fontcustom.com/

Hey, you should add a piece of javascript code to make the anchor scroll smoother

$('a').click(function() { $('html,body').animate({ scrollTop: $( $.attr(this, 'href') ).offset().top }, 1000); });

Add the icon font stately.

From a comment on reddit:

Those huge ass buttons scare the crap out of me

http://www.tenbytwenty.com/sosa.php

The CSS has to be created by hand.

Show the page load time when you add a font to your collection. Something like a bar or so :D

Someone needs to create the CSS for Metecons like this:

.metecons-sunny:before { content: "B"; }

All icon codes are in this picture:

Some entypo icons are displayed as questions marks in boxes.

@todo: Find the problem.

Icons are not showing up!

e.g
"] Feedback"
", To Collecton"

Stuff to do:

• Show all icons by default
• Button to toggle the view of the icons (full / overview)

Based on the comments on [reddit].(http://www.reddit.com/r/web_design/comments/147hqa/we_love_icon_fonts_a_free_icon_fonts_hosting/c7ak3gn)

The green color you use for the a backgrounds/text-colors is a bit to aggressive in my own opinion, I propose you this one : #67f390 which is smoother and lighter.

Steps to reproduce this:

1. Add a font to your collection
2. Remove all fonts from your collection (count == 0)
3. Go to "Use selected fonts"

You will see this

@import url(http://weloveiconfonts.com/api/?family=);

but you should see this

Pro tip: Select some icon fonts to the see real output here!

The title says it all.