Revival of a small project - a.clue a CSS colorful icon decorator
I would like to revive the small project a.clue, because over one and a half years it has not been worked on. Detailed description below. New icons have to be added as well as colors but also a LESS like SASS file. What do you think, would you use this library in a project, how is your view on it?
a.clue
A CSS library that links and anchors supplemented with icons
Fancy icons and symbols for your great web project.
Easy to use and uses the popular web font FontAwesome.
How to use
Include the CSS in the <head> section in your HTML document.
(html comment removed: Import the FontAwesome CSS important for the icons and symbols )
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/x.x.x/css/font-awesome.min.css" />
(html comment removed: Import the a.clue CSS )
<link rel="stylesheet" href="assets/css/aclue.min.css" />
<link rel="stylesheet" href="assets/css/yourown.css" />
Add the aclue class at the parent block element you want.
(html comment removed: for the whole document )
<body class="aclue">
Content with a <a href="https://www.linkedin.com/">Linkedin</a> link
...
(html comment removed: or partial )
<h1 class="aclue">
Title with a <a href="https://www.instagram.com/rrmelcer/">Instagram</a> link
</h1>
(html comment removed: or )
<div class="aclue">
Div with a <a href="https://twitter.co/kubikpixel">Twitter</a> link
</div>
(html comment removed: or )
<p class="aclue">
Paragraph with a <a href="https://www.facebook.com/kubikpixel/">Facebook</a> link
</p>
(html comment removed: or )
...
</body>
You can overwrite the colors and style of all the icons in your own CSS file.
/* Paint it black in yourown.css*/
ul.aclue > li > a[href]::before,
.aclue a[href]::after {
color: #000;
}
Lists with icons you make it so easy
(html comment removed: add only the class "aclue" and finish is your iconic list )
<ul class="aclue">
<li><a href="https://twitter.com/kubikpixel/">Twitter</a>
<li><a href="https://github.com/rrmelcer/">GitHub</a>
<li><a href="http://codepen.io/rrmelcer/">CodePen</a>
<li><a href="#">...</a>
<ul>
Work also fine with Twitter Bootstrap. The full list of icons and a real application see you in the demo on CodePen.
License
"THE BEER-WARE LICENSE" (Revision 42):
[email protected] wrote this file. As long as you retain this
notice you can do whatever you want with this stuff. If we meet some day,
and you think this stuff is worth it, you can buy me a beer in return.
Raoul René Melcer
Posted on Utopian.io - Rewarding Open Source Contributors
Your contribution cannot be approved yet because it does not have proof of work. See the Utopian Rules. Please edit your contribution and add proof (links, screenshots, commits, etc) of your work, to reapply for approval. For this instance we just need to make sure that you are that same person in Github - aside from the profile photo and the same First name (based on the email mentioned and your introduce yourself post) we have no one source of information that you are one and the same person. It is clearly stated in the rules that you prove your identity.
You can do a commit on the github repository adding your steemit/utopian username or your steemit/utopian page to the readme file. Add the commit link to your post. Reply to this comment once done.
You may edit your post here, as shown below:
You can contact us on Discord.
[utopian-moderator]
Proof of work exist with a link to CodePen on the end of the description.
I'm good with the codes and everything, it's just with the identity part.
That's from the rules: https://utopian.io/rules.
Do that, or add your name in github. It is very easy to add commits.
[utopian-moderator]
Thank you for the contribution. It has been approved.
I have verified your identity thanks for complying.
You can contact us on Discord.
[utopian-moderator]
Hey @spite77 I am @utopian-io. I have just upvoted you at 10% Power!
Achievements
Community-Driven Witness!
I am the first and only Steem Community-Driven Witness. Participate on Discord. Lets GROW TOGETHER!
Up-vote this comment to grow my power and help Open Source contributions like this one. Want to chat? Join me on Discord https://discord.gg/Pc8HG9x
This is a @OriginalWorks 🖋️
The @OriginalWorks BETA V2 bot has upvoted(0.5%) and checked this post!
Some similarity seems to be present here:
http://www.instructables.com/id/Attendance-system-using-Raspberry-Pi-and-NFC-Tag-r/
This is an early BETA version. If you cited this source, then ignore this message! Reply if you feel this is an error.