Icon Buttons

[lightglitch]

It would be nice to have a set of buttons with icons like this:

http://nicolasgallagher.com/lab/css3-github-buttons/

The problem is that they use the :before and :after pseudo classes that IE7 doesn't support but they look really nice.

The icons they use are also free:

http://somerandomdude.com/projects/iconic/

[goshacmd]

👍

[olvlvl]

I like that bootstrap comes without images and looks awesome thanks to CSS gradients and shadows. Maybe the CSS of the "CSS3 GitHub Buttons" project could be updated to be compatible with bootstrap ?

PS: F*ck IE7 ! ;)

[lightglitch]

I'm converting some of the "CSS3 GitHub Buttons" to bootstrap to see how they look.

[lightglitch]

Here is the first example:

About having images it already includes javascripts so I don't see a problem including an image.

[goshacmd]

@lightglitch Great job, looks cool. However I think these buttons must also have .btn.(primary | danger | success | info).(large | small).

[analytically]

The .add and .remove icons don't seem quite right.

[lightglitch]

@goshakkk: You can have it, it works like this:

<button class="btn icon arrowup">Default</button>
<button class="btn primary icon secondary arrowup">Default</button>
<button class="btn danger icon secondary arrowup">Default</button>

@analytically: You are right, copy/paste issue.

[goshacmd]

@lightglitch hmmm it's really cool then.

Are you gonna open a pull-request with these buttons?

[lightglitch]

Pull request.

#317

[fat]

Mark and I don't want to add icons because we'd like to keep bootstrap a single resource. I think it makes more sense to develop this as plugin or something of that nature. Thanks!

[lightglitch]

Just to inform anyone interested in this feature to get it from

http://lightglitch.github.com/bootstrap-xtra/

[drewda]

Looks good, @lightglitch!

@fat and @markdotto, what do you think of adding a docs/plugins.html to list side projects? More structured than a Github wiki page, because others would have to do pull requests to have additions made.

[drewda]

Sorry guys, I should have noticed this before posting: https://github.com/twitter/bootstrap/wiki/Forks%2C-Plugins%2C-and-Packages But let me still suggest that it would be nicer to have a plugins page that's an actual part of the docs.

[burningTyger]

Just a side note the icons used are under a share alike license. If you use them you will have to use the very same licese for your project. That's all nice but be sure you know what sources you're using.

[lightglitch]

thx, I will check the licenses because I don't want to violate anything.

[burningTyger]

Should include the info...
Quote from http://somerandomdude.com/work/iconic/:

This set is currently licensed under the Creative Commons Attribution-Share Alike 3.0 license.

which is here: http://creativecommons.org/licenses/by-sa/3.0/us/

BTW: Because of the licensing I used Unicode character from Dingbats. I'm no expert if that will work in all cases but that is a simple solution for now and will also work with bootstrap buttons (in the end I used the dingbats characters without button because they have a smaller foot print).

[AlexHamilton]

@burningTyger To clarify the licensing situation, if you adapt the icons, then the adapted icons need to be licensed on the same terms, but this does not mean that your whole project needs to use that licence. I.e., it doesn't act like the GPL.

[burningTyger]

@AlexHamilton cool, thanks for researching this. Licenses can be confusing to say the least.