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