thomaspark / glyphsearch Goto Github PK
View Code? Open in Web Editor NEWSearch for icons from Font Awesome, Glyphicons, IcoMoon, Ionicons, and Octicons
Home Page: https://glyphsearch.com
License: MIT License
Search for icons from Font Awesome, Glyphicons, IcoMoon, Ionicons, and Octicons
Home Page: https://glyphsearch.com
License: MIT License
It always copies the class names
Hello
I would like to request search in https://paymentfont.com/ 's Payment font
41 new icons: http://fontawesome.io/icons/
Users should be able to set the format that gets copied on click. Right now it's the class names, but options could include HTML, HAML, Emmet, Unicode, etc.
Hi,
It's great tool! But in Firefox (i test in firefox 33/35 and i have flash installed) don't work the copy function, it will have to upgrade ZeroClipBoard?
Thanks
Would be neat to be able to copy an icon as SVG.
Is there any?
Hi Thomas,
how would you like to implement Octicons (http://octicons.github.com/)? If you don't have the time, I might have a look and send you a pull request..
I was about to code search engine for FontAwesome in Angular this holidays for myself, but found this. :)
Anyway, I immediately noticed, that there are some issues with aliases. I expect to get the same icon from FontAwesome and IcoMoon when I type "help", but FontAwesome icon is missing this alias (although it's the same exact icon). This was the first thing I typed, so there could be more.. or not. :)
Anyway, good work.
BTW: This could by somewhat self-maintained if user labeling is implemented as suggested in #20
Hey Thomas,
I have been using the project for a while now and I think one major problem that the users are facing is finding the right icon. I think we should work on a functionality just that an user an suggest a tag on the website and then you can approve them before they go live. What are your thoughts on this?
Best,
Jenil
Was finding myself a few times trying to enter Unicode (Hex) value into the search field, but don't get any results. Would be great if this was possible to reverse-lookup icons like that, especially when debugging.
I am not sure how Algolia Search works with regards to field indexing, but could not see anything in the code that made me believe I could create a pull request - probably Algolia Dashboard thing?
Related: This cross-browser client full text search engine is pretty impressive performance wise, in case that would be a case: http://reyesr.github.io/fullproof/
23 new icons, including the new accessibility category.
Hey @thomaspark,
I have been using glyphsearch frequently for most of my projects and have realised that there are few icons with missing tags or tags that could be added to existing ones, can you tell me how to add tags? Do I straightaway edit the batch.json file?
Hi,
I found an error in the icons-foundation.json.
these two lines
{"name": "upload-cloud", "unicode": ""},
{"name": "usb","unicode": "f20b"},
should be
{"name": "upload-cloud", "unicode": "f20b"},
{"name": "usb","unicode": "f20d"},
It would be of great value if this project had a fallback on offline search/filtering. Not possible with 100% Algolia dependency, but I could look into client-side approach as fallback using Lunr.js or similar.
Thoughts?
The data-clipboard-text
attributes from all providers are built with the "fa fa-" prefix. It breaks all copy/paste except the FontAwesome ones. For example, in the GlyphIcon part:
<div class="entry col-lg-1 col-md-2 col-sm-3 col-xs-4" data-clipboard-text="fa fa-random"> <!-- should be "glyphicon glyphicon-" not "fa fa-" -->
<div class="description">glyphicon glyphicon-random</div>
<div class="thumb"><i class="glyphicon glyphicon-random"></i></div>
<div class="name"><em>rand</em>om</div>
<div class="tags hidden-xs">video player</div><div class="clearfix"></div>
</div>
Hi,
I am a regular user of glyphsearch.com and working on one of project in maintenance mode so not able to update icon libraries.
It is great that you have published latest libraries content on your site, but it is incompatible with older version libraries, so add some version selection drop down some where or any preferable, so users like me can use your site too.
66 new icons: http://fortawesome.github.io/Font-Awesome/icons/
Font Awesome fa-share-alt icon is missed
I know it does the javascript prompt now with the class pre-selected. But would it be possible to make it automatically copy to the clipboard?
And possibly going one step further, giving users the option of which format they would like the snippet in (for example, either fa fa-check
or <i class="fa fa-check"></i>
). Kind of like flatuicolors.com.
Hi Thomas,
I'm author of http://iconmart.in/ . If you like feel free to add these font icon set in current website.
Thanks,
Yash
This is related to a topic described here:
#40
On some browsers the page is unusable for several reasons: the ZC fails to initialize (browser cache as in #40, no flash, flash is blocked)
It would be nice to still offer the main feature of the page: search + copy of icon name simply by assuming 'noflash' option is default and only changed when Flash movie is loaded.
Here is example how to reuse existing code to implement this:
and quick code example:
diff --git a/js/index.js b/js/index.js
index a932b01..bb6e9ca 100755
--- a/js/index.js
+++ b/js/index.js
@@ -137,14 +137,22 @@ function handlers() {
var library = $(this).attr("data-library");
setLibrary(library);
});
-
+
+ function showFeedback(text) {
+ $("#big-icon").removeClass().addClass(args.text);
+ $(".copied").show().find("div").addClass("animateIn");
+ if(flashEnabled === false) {
+ window.prompt("Copy to clipboard:", name);
+ }
+ setTimeout('$(".copied div").removeClass("animateIn").addClass("animateOut");$(".copied").fadeOut(function(){$(".copied div").removeClass("animateOut")})', 700);
+ };
+
clip.on("load", function() {
flashEnabled = true;
-
+ $(".icons").off("click", ".entry");
+
clip.on("complete", function(client, args) {
- $("#big-icon").removeClass().addClass(args.text);
- $(".copied").show().find("div").addClass("animateIn");
- setTimeout('$(".copied div").removeClass("animateIn").addClass("animateOut");$(".copied").fadeOut(function(){$(".copied div").removeClass("animateOut")})', 700);
+ showFeedback(args.text);
});
clip.on("mouseout", function() {
@@ -153,12 +161,10 @@ function handlers() {
clip.glue($(".entry"));
});
-
- clip.on("noflash", function() {
- $(".icons").on("click", ".entry", function(){
- var name = $(this).find(".description").text();
- window.prompt("Copy to clipboard:", name);
- });
+
+ $(".icons").on("click", ".entry", function(){
+ var name = $(this).find(".description").text();
+ showFeedback(name);
});
}
I could do PR.
Thanks!
I've started using Line Awesome for some of my projects, and most of them look great. The icon catalog on their website is very slow, and I would love to have it available on glyphsearch as well
Can you add https://feathericons.com/? or I can possibly send a PR for it.
Hi Thomas,
First of all...thank you very much for the glyphSearch. It's amazing tool!
Problem I found is that material icons are not working. I am not developer, so can't help you much. But I believe you know how to fix this ;).
Thanks
Jana
Can you add Foundation Icon Fonts 3 http://zurb.com/playground/foundation-icon-fonts-3 into your collection?
Hi, is there a way to update Material icons font version? Current version is 4: https://github.com/google/material-design-icons
Add IcoMoon's free icon pack: http://icomoon.io/#preview-free
Right now the search box and section headers are statically positioned. Using sticky/affix position would make it easier to enter new searches and identify the library you're currently viewing.
The tradeoff is less vertical space, but that could be minimized with new styling, especially for the section headers.
After a search, the first click on an icon doesn't register. Trying to track down the cause...
20 more icons (including the new Google icon)
Git tree is ~30 MB large even though the project is very simple, this is because bower_components
is still in the Git tree which makes no sense - cloning forever. I removed it from versioning in my fork, but didn't do the actual version histoy cleanup using git filter-branch --tree-filter 'rm -rf bower_components' --prune-empty HEAD
because that require the project maintainer to be aware. Read more here: https://help.github.com/articles/remove-sensitive-data/
GlyphSearch was originally intended to support only the most popular libraries, which cover the majority of use.
But as we receive requests or contributions for new libraries (#30, #32, #33), we should discuss whether GlyphSearch should strive to be a comprehensive meta-resource or not. Sometimes less is more. Then again, sometimes more is more. ๐
If we decide to continue adding libraries, this requires a rethinking of the interface, especially with filtering libraries. Perhaps users can be selective about which libraries to include, and this setting can be saved across sessions.
The benefits of being inclusive are obvious. But are there any downsides or objections?
URLs should update based on libraries and queries used. For instance:
glyphsearch.com/?f=glyphicons
shows only Glyphicons.glyphsearch.com/?q=medical
queries "medical" in all libraries.glyphsearch.com/?f=glyphicons&q=medical
queries "medical" in Glyphicons.This project only have gh-pages
branch, which is confusing for potential contributors.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.