Replace icon with descriptions

[rubenvarela]

The icons on the page may seem nice, but filtering or searching based on them is impossible unless you go directly to the markdown.

![Open-Source Software][OSS Icon] means **open source**, click to enter **open source** repo;  
![Freeware][Freeware Icon] means **free** to use, or **free** personal license;  
![hot][hot Icon] means **hot** app;  
![tuijian][tuijian Icon] means **recommended** app;  
![must-have][bibei Icon] means **must have** app;  
![App Store][app-store Icon] means **App store** hyperlink;  
![1 star][red Icon] means highly recommended must have app, the number of stars represents how strong I recommend;

I propose we either change these, or add the actual text of what they mean into the line. This would allow to search based on a keyword as if it where a label.

[jaywcjlove]

@rubenvarela This proposal is good, but there is workload. You can RP.

thx!

[rubenvarela]

I can work on a PR for this. Thinking of a script to be able to update it before it's merged.

The only thing I would like to brainstorm here is format. Not sure if something in the form of:

• Atom - A hackable text editor for the 21st Century by GitHub. Atom Plugins. — * * * * — Open-Source Software — Freeware — hot — recommended — must-have —

Or,

• Atom - A hackable text editor for the 21st Century by GitHub. Atom Plugins.
  — * * * * — Open-Source Software — Freeware — hot — recommended — must-have —

Ideas or recommendation?

[jaywcjlove]

@radarhere English list can do so, but the Chinese list I do not want to do that.
Chinese list I have tried, Not beautiful.
I would like to vote.

[radarhere]

@jaywcjlove I'm guessing you meant @rubenvarela

[rafcontreras]

What about adding a TITLE attribute to the icons? Hover over the icon to get a tooltip of what it means.

Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum
Lorem ipsum

You don't have to edit every list item, just edit this to where you have defined the icons.

[OSS Icon]: https://jaywcjlove.github.io/sb/ico/min-oss.svg "Open Source Software"
[Freeware Icon]: https://jaywcjlove.github.io/sb/ico/min-free.svg "Freeware"
[hot Icon]: https://jaywcjlove.github.io/sb/ico/min-hot.svg "Hot App"
[tuijian Icon]: https://jaywcjlove.github.io/sb/ico/min-tuijian.svg "Recommended App"
[bibei Icon]: https://jaywcjlove.github.io/sb/ico/min-bibei.svg "Must Have"
[red Icon]: https://jaywcjlove.github.io/sb/star/red.svg "Star"
[app-store Icon]: https://jaywcjlove.github.io/sb/ico/min-app-store.svg "App Store Link"
[star0 Icon]: https://jaywcjlove.github.io/sb/star/red0.svg "0 stars"
[star1 Icon]: https://jaywcjlove.github.io/sb/star/red1.svg "1 star"
[star2 Icon]: https://jaywcjlove.github.io/sb/star/red2.svg "2 stars"
[star3 Icon]: https://jaywcjlove.github.io/sb/star/red3.svg "3 stars"
[star4 Icon]: https://jaywcjlove.github.io/sb/star/red4.svg "4 stars"
[star5 Icon]: https://jaywcjlove.github.io/sb/star/red5.svg "5 stars"

[rubenvarela]

Could be done. Not too hard at all. It's just adding the title to the bottom images in the README.md

But, at least my issue, was more in regards to the actual finding them via Ctrl/Cmd+F. They're small icons, I can't easily read them, I'm not visually familiar with them.

So I was looking to search/highlight them to visually identify them.

[jaywcjlove]

@rubenvarela I am ready to develop an APP to solve, how?

[rubenvarela]

@jaywcjlove I can script the process for the English version.

For your app, would you have a preference on one of the formats above? First one is on the same line. The second one is just the next line down.

[jaywcjlove]

@rubenvarela I would like to use the Chinese and English form of the switch.

[rubenvarela]

My plan was match based on the markdown images.

I don't see why it wouldn't work on the Chinese version as well, but previously there was a concern. I can go ahead and work on a preliminary version and upload it.

[jaywcjlove]

You can create a branch, push to the repository. Work together to solve the problem.
@rubenvarela

[jaywcjlove]

@rubenvarela #237