Commit ce219267 authored by Mark Otto's avatar Mark Otto

All Glyphicons now require a base class, e.g. .glyphicon.glyphicon-star

parent d8e2668c
......@@ -1968,7 +1968,7 @@ fieldset[disabled] .btn-link:focus {
src: url('../fonts/glyphiconshalflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphiconshalflings-regular.woff') format('woff'), url('../fonts/glyphiconshalflings-regular.ttf') format('truetype'), url('../fonts/glyphiconshalflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
[class^="glyphicon-"]:before {
.glyphicon:before {
font-family: 'Glyphicons Halflings';
font-style: normal;
line-height: 1;
......
......@@ -331,7 +331,7 @@ section > ul li {
-webkit-box-sizing: border-box;
margin: 0 -1px -1px 0;
}
.the-icons [class^="glyphicon-"] {
.the-icons .glyphicon {
display: block;
margin: 5px auto;
vertical-align: middle;
......
......@@ -21,20 +21,20 @@ title: Components
<div class="row">
<div class="span3 bs-docs-sidebar">
<ul class="nav nav-list bs-docs-sidenav">
<li><a href="#dropdowns"><i class="glyphicon-chevron-right"></i> Dropdowns</a></li>
<li><a href="#buttonGroups"><i class="glyphicon-chevron-right"></i> Button groups</a></li>
<li><a href="#buttonDropdowns"><i class="glyphicon-chevron-right"></i> Button dropdowns</a></li>
<li><a href="#navs"><i class="glyphicon-chevron-right"></i> Navs</a></li>
<li><a href="#navbar"><i class="glyphicon-chevron-right"></i> Navbar</a></li>
<li><a href="#breadcrumbs"><i class="glyphicon-chevron-right"></i> Breadcrumbs</a></li>
<li><a href="#pagination"><i class="glyphicon-chevron-right"></i> Pagination</a></li>
<li><a href="#counters"><i class="glyphicon-chevron-right"></i> Counters</a></li>
<li><a href="#typography"><i class="glyphicon-chevron-right"></i> Typography</a></li>
<li><a href="#thumbnails"><i class="glyphicon-chevron-right"></i> Thumbnails</a></li>
<li><a href="#alerts"><i class="glyphicon-chevron-right"></i> Alerts</a></li>
<li><a href="#progress"><i class="glyphicon-chevron-right"></i> Progress bars</a></li>
<li><a href="#media"><i class="glyphicon-chevron-right"></i> Media object</a></li>
<li><a href="#misc"><i class="glyphicon-chevron-right"></i> Misc</a></li>
<li><a href="#dropdowns"><i class="glyphicon glyphicon-chevron-right"></i> Dropdowns</a></li>
<li><a href="#buttonGroups"><i class="glyphicon glyphicon-chevron-right"></i> Button groups</a></li>
<li><a href="#buttonDropdowns"><i class="glyphicon glyphicon-chevron-right"></i> Button dropdowns</a></li>
<li><a href="#navs"><i class="glyphicon glyphicon-chevron-right"></i> Navs</a></li>
<li><a href="#navbar"><i class="glyphicon glyphicon-chevron-right"></i> Navbar</a></li>
<li><a href="#breadcrumbs"><i class="glyphicon glyphicon-chevron-right"></i> Breadcrumbs</a></li>
<li><a href="#pagination"><i class="glyphicon glyphicon-chevron-right"></i> Pagination</a></li>
<li><a href="#counters"><i class="glyphicon glyphicon-chevron-right"></i> Counters</a></li>
<li><a href="#typography"><i class="glyphicon glyphicon-chevron-right"></i> Typography</a></li>
<li><a href="#thumbnails"><i class="glyphicon glyphicon-chevron-right"></i> Thumbnails</a></li>
<li><a href="#alerts"><i class="glyphicon glyphicon-chevron-right"></i> Alerts</a></li>
<li><a href="#progress"><i class="glyphicon glyphicon-chevron-right"></i> Progress bars</a></li>
<li><a href="#media"><i class="glyphicon glyphicon-chevron-right"></i> Media object</a></li>
<li><a href="#misc"><i class="glyphicon glyphicon-chevron-right"></i> Misc</a></li>
</ul>
</div>
<div class="span9">
......@@ -163,10 +163,10 @@ title: Components
<p>Make a set of buttons appear vertically stacked rather than horizontally.</p>
<div class="bs-docs-example">
<div class="btn-group btn-group-vertical">
<button type="button" class="btn"><i class="glyphicon-align-left"></i></button>
<button type="button" class="btn"><i class="glyphicon-align-center"></i></button>
<button type="button" class="btn"><i class="glyphicon-align-right"></i></button>
<button type="button" class="btn"><i class="glyphicon-align-justify"></i></button>
<button type="button" class="btn"><i class="glyphicon glyphicon-align-left"></i></button>
<button type="button" class="btn"><i class="glyphicon glyphicon-align-center"></i></button>
<button type="button" class="btn"><i class="glyphicon glyphicon-align-right"></i></button>
<button type="button" class="btn"><i class="glyphicon glyphicon-align-justify"></i></button>
</div>
</div>
{% highlight html linenos %}
......
This diff is collapsed.
......@@ -21,10 +21,10 @@ title: Customize and download
<div class="row">
<div class="span3 bs-docs-sidebar">
<ul class="nav nav-list bs-docs-sidenav">
<li><a href="#components"><i class="glyphicon-chevron-right"></i> 1. Choose components</a></li>
<li><a href="#plugins"><i class="glyphicon-chevron-right"></i> 2. Select jQuery plugins</a></li>
<li><a href="#variables"><i class="glyphicon-chevron-right"></i> 3. Customize variables</a></li>
<li><a href="#download"><i class="glyphicon-chevron-right"></i> 4. Download</a></li>
<li><a href="#components"><i class="glyphicon glyphicon-chevron-right"></i> 1. Choose components</a></li>
<li><a href="#plugins"><i class="glyphicon glyphicon-chevron-right"></i> 2. Select jQuery plugins</a></li>
<li><a href="#variables"><i class="glyphicon glyphicon-chevron-right"></i> 3. Customize variables</a></li>
<li><a href="#download"><i class="glyphicon glyphicon-chevron-right"></i> 4. Download</a></li>
</ul>
</div>
<div class="span9">
......
......@@ -21,12 +21,12 @@ description: Overview of the project, its contents, and how to get started with
<div class="row">
<div class="span3 bs-docs-sidebar">
<ul class="nav nav-list bs-docs-sidenav">
<li><a href="#download-bootstrap"><i class="glyphicon-chevron-right"></i> Download</a></li>
<li><a href="#file-structure"><i class="glyphicon-chevron-right"></i> File structure</a></li>
<li><a href="#contents"><i class="glyphicon-chevron-right"></i> What's included</a></li>
<li><a href="#html-template"><i class="glyphicon-chevron-right"></i> HTML template</a></li>
<li><a href="#examples"><i class="glyphicon-chevron-right"></i> Examples</a></li>
<li><a href="#what-next"><i class="glyphicon-chevron-right"></i> What next?</a></li>
<li><a href="#download-bootstrap"><i class="glyphicon glyphicon-chevron-right"></i> Download</a></li>
<li><a href="#file-structure"><i class="glyphicon glyphicon-chevron-right"></i> File structure</a></li>
<li><a href="#contents"><i class="glyphicon glyphicon-chevron-right"></i> What's included</a></li>
<li><a href="#html-template"><i class="glyphicon glyphicon-chevron-right"></i> HTML template</a></li>
<li><a href="#examples"><i class="glyphicon glyphicon-chevron-right"></i> Examples</a></li>
<li><a href="#what-next"><i class="glyphicon glyphicon-chevron-right"></i> What next?</a></li>
</ul>
</div>
<div class="span9">
......
......@@ -19,20 +19,20 @@ title: JavaScript plugins
<div class="row">
<div class="span3 bs-docs-sidebar">
<ul class="nav nav-list bs-docs-sidenav">
<li><a href="#overview"><i class="glyphicon-chevron-right"></i> Overview</a></li>
<li><a href="#transitions"><i class="glyphicon-chevron-right"></i> Transitions</a></li>
<li><a href="#modals"><i class="glyphicon-chevron-right"></i> Modal</a></li>
<li><a href="#dropdowns"><i class="glyphicon-chevron-right"></i> Dropdown</a></li>
<li><a href="#scrollspy"><i class="glyphicon-chevron-right"></i> Scrollspy</a></li>
<li><a href="#tabs"><i class="glyphicon-chevron-right"></i> Tab</a></li>
<li><a href="#tooltips"><i class="glyphicon-chevron-right"></i> Tooltip</a></li>
<li><a href="#popovers"><i class="glyphicon-chevron-right"></i> Popover</a></li>
<li><a href="#alerts"><i class="glyphicon-chevron-right"></i> Alert</a></li>
<li><a href="#buttons"><i class="glyphicon-chevron-right"></i> Button</a></li>
<li><a href="#collapse"><i class="glyphicon-chevron-right"></i> Collapse</a></li>
<li><a href="#carousel"><i class="glyphicon-chevron-right"></i> Carousel</a></li>
<li><a href="#typeahead"><i class="glyphicon-chevron-right"></i> Typeahead</a></li>
<li><a href="#affix"><i class="glyphicon-chevron-right"></i> Affix</a></li>
<li><a href="#overview"><i class="glyphicon glyphicon-chevron-right"></i> Overview</a></li>
<li><a href="#transitions"><i class="glyphicon glyphicon-chevron-right"></i> Transitions</a></li>
<li><a href="#modals"><i class="glyphicon glyphicon-chevron-right"></i> Modal</a></li>
<li><a href="#dropdowns"><i class="glyphicon glyphicon-chevron-right"></i> Dropdown</a></li>
<li><a href="#scrollspy"><i class="glyphicon glyphicon-chevron-right"></i> Scrollspy</a></li>
<li><a href="#tabs"><i class="glyphicon glyphicon-chevron-right"></i> Tab</a></li>
<li><a href="#tooltips"><i class="glyphicon glyphicon-chevron-right"></i> Tooltip</a></li>
<li><a href="#popovers"><i class="glyphicon glyphicon-chevron-right"></i> Popover</a></li>
<li><a href="#alerts"><i class="glyphicon glyphicon-chevron-right"></i> Alert</a></li>
<li><a href="#buttons"><i class="glyphicon glyphicon-chevron-right"></i> Button</a></li>
<li><a href="#collapse"><i class="glyphicon glyphicon-chevron-right"></i> Collapse</a></li>
<li><a href="#carousel"><i class="glyphicon glyphicon-chevron-right"></i> Carousel</a></li>
<li><a href="#typeahead"><i class="glyphicon glyphicon-chevron-right"></i> Typeahead</a></li>
<li><a href="#affix"><i class="glyphicon glyphicon-chevron-right"></i> Affix</a></li>
</ul>
</div>
<div class="span9">
......@@ -1491,10 +1491,10 @@ $('#myCollapsible').on('hidden', function () {
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon-chevron-left"></span>
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon-chevron-right"></span>
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div><!-- /example -->
......
......@@ -11,9 +11,9 @@
// Basic usage
//
// Since icons are fonts, they can be placed anywhere text is placed. To use,
// create an inline element with the appropriate class, like so:
// create an inline element with the appropriate classes, like so:
//
// <a href="#"><span class="glyphicon-star"></span> Star</a>
// <a href="#"><span class="glyphicon glyphicon-star"></span> Star</a>
//
// Use them in links, buttons, headings, and more.
......@@ -31,7 +31,7 @@
}
// Catchall baseclass
[class^="glyphicon-"]:before {
.glyphicon:before {
font-family: 'Glyphicons Halflings';
font-style: normal;
line-height: 1;
......
......@@ -40,13 +40,13 @@
Profile
</button>
<button class="btn btn-large" type="button">
<span class="glyphicon-user"></span> Profile
<span class="glyphicon glyphicon-user"></span> Profile
</button>
<button class="btn btn-large" type="button">
<span class="glyphicon-home"></span> Home
<span class="glyphicon glyphicon-home"></span> Home
</button>
<button class="btn btn-large" type="button">
<span class="glyphicon-link"></span> Link
<span class="glyphicon glyphicon-link"></span> Link
</button>
</p>
<p>
......@@ -54,13 +54,13 @@
Profile
</button>
<button class="btn" type="button">
<span class="glyphicon-user"></span> Profile
<span class="glyphicon glyphicon-user"></span> Profile
</button>
<button class="btn" type="button">
<span class="glyphicon-home"></span> Home
<span class="glyphicon glyphicon-home"></span> Home
</button>
<button class="btn" type="button">
<span class="glyphicon-link"></span> Link
<span class="glyphicon glyphicon-link"></span> Link
</button>
</p>
<p>
......@@ -68,13 +68,13 @@
Profile
</button>
<button class="btn btn-small" type="button">
<span class="glyphicon-user"></span> Profile
<span class="glyphicon glyphicon-user"></span> Profile
</button>
<button class="btn btn-small" type="button">
<span class="glyphicon-home"></span> Home
<span class="glyphicon glyphicon-home"></span> Home
</button>
<button class="btn btn-small" type="button">
<span class="glyphicon-link"></span> Link
<span class="glyphicon glyphicon-link"></span> Link
</button>
</p>
<p>
......@@ -82,22 +82,22 @@
Profile
</button>
<button class="btn btn-mini" type="button">
<span class="glyphicon-user"></span> Profile
<span class="glyphicon glyphicon-user"></span> Profile
</button>
<button class="btn btn-mini" type="button">
<span class="glyphicon-home"></span> Home
<span class="glyphicon glyphicon-home"></span> Home
</button>
<button class="btn btn-mini" type="button">
<span class="glyphicon-link"></span> Link
<span class="glyphicon glyphicon-link"></span> Link
</button>
</p>
<div class="btn-toolbar">
<div class="btn-group">
<a class="btn" href="#"><i class="glyphicon-align-left"></i></a>
<a class="btn" href="#"><i class="glyphicon-align-center"></i></a>
<a class="btn" href="#"><i class="glyphicon-align-right"></i></a>
<a class="btn" href="#"><i class="glyphicon-align-justify"></i></a>
<a class="btn" href="#"><i class="glyphicon glyphicon-align-left"></i></a>
<a class="btn" href="#"><i class="glyphicon glyphicon-align-center"></i></a>
<a class="btn" href="#"><i class="glyphicon glyphicon-align-right"></i></a>
<a class="btn" href="#"><i class="glyphicon glyphicon-align-justify"></i></a>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment