walkxcode / dashboard-icons

🚀 The best source for dashboard icons.
Other
4.57k stars 503 forks source link

Making a Dashboard Icons website #375

Open walkxcode opened 1 year ago

walkxcode commented 1 year ago

I am looking into building a nice looking website for the Dashboard Icons project.

Here are some feature's I am wanting to add:

If anyone would want to help me with this, please comment on this issue and I will assign you. If you have any suggestions, please also make a comment!

itsprakashp commented 1 year ago

I think website can be made similar to the aegis-icons. https://aegis-icons.github.io/, https://github.com/aegis-icons/aegis-icons

walkxcode commented 1 year ago

I think website can be made similar to the aegis-icons. aegis-icons.github.io, aegis-icons/aegis-icons

Thanks for the links! I'll see if I can find some inspiration.

pradt commented 1 year ago

Hi, I've generated an example if this is what you are looking for (it'll need better styling) :

https://jsfiddle.net/prad/jk3tc2fs/3/

I've used the following to convert the html to have a text label and be within a list tag : https://jsfiddle.net/prad/cne0dk6z/9/

walkxcode commented 1 year ago

I think this is a really great start, but the fuzzy search will have to be improved loads more. For example, currently when searching "pihole", "pi-hole" will not show up. I am going on vacation in a couple of days but I will take a better look at your example when I'm back :)

Mega-Volti commented 1 year ago

Why prefer the png version, if both svg and png are available? As vector format, the svg version offers better scalability so it should be the default / preferred one, right?

pradt commented 1 year ago

I think this is a really great start, but the fuzzy search will have to be improved loads more. For example, currently when searching "pihole", "pi-hole" will not show up. I am going on vacation in a couple of days but I will take a better look at your example when I'm back :)

Ok no worries, enjoy your holidays.

Based on your feedback, writing a custom fuzzy logic function is probably going to take some time. Instead I've looked at two libraries (fuse.js and fuzzysort) and I was able to get better success from using the fuzzysort library : https://github.com/farzher/fuzzysort

I've created a working example, but I've had to convert the content to an array. But for testing purposes the update at https://jsfiddle.net/prad/jk3tc2fs/52/ (the initial display of all the icons is not shown at this stage, only after it passes the array of the icons to the fuzzy search it displays the result.

walkxcode commented 1 year ago

This is an absolutely great start! I think it still needs some optimizations, but this is superb.

raythunder commented 11 months ago

I have created a simple search page. It can be temporarily used by those who need it. https://raythunder.github.io/dashboard-icons-search/

walkxcode commented 11 months ago

This is really nice! I'm going to take a further look at it once I find some time, I think after some improvements we could really use this.

andrzej-zuralovic commented 6 months ago

The icon searcher should always be up to date as it requests PNG and SVG content from GitHub. https://andrzej-zuralovic.github.io/dashboard-icons-searcher/