Created by: natansh
Ideally, a custom icon should be as easy to add as
.icon-[custom name] {
background-image: ...;
background-position: ...;
}
Apparently, this used to work in 2.0.4, but no longer works in 2.1.0 - someone reported this in the mailing group. The issue is that the bootstrap styles in many elements have more specificity now, such as
.navbar-inverse .nav > .active > a > [class^="icon-"]
which makes the browser pick that particular background image (mentioned in the property).
I have been thinking of some solutions and the best I could think of was to have a separate class prefix, like
.custom-icon-[custom name]
I have added support for using this approach in the commit.
Would love to hear/know about any alternate approaches possible.