diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 68e161051b3c..c878d70ff454 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -1066,8 +1066,8 @@ table .span12 { margin-left: 0; } .icon { - background-image: url(../img/glyphicons-halflings-sprite.png); - background-position: 0 0; + background-image: url(../img/glyphicons-halflings.png); + background-position: 14px 14px; background-repeat: no-repeat; display: inline-block; vertical-align: text-top; @@ -1075,10 +1075,10 @@ table .span12 { height: 14px; } .icon.white { - background-image: url(../img/glyphicons-halflings-sprite-white.png); + background-image: url(../img/glyphicons-halflings-white.png); } .icon.glass { - background-position: 0 0; + background-position: 0 0; } .icon.music { background-position: -24px 0; @@ -1170,7 +1170,7 @@ table .span12 { .icon.refresh { background-position: -240px -24px; } -.icon.calendar { +.icon.list-alt { background-position: -264px -24px; } .icon.lock { @@ -1201,7 +1201,7 @@ table .span12 { background-position: 0 -48px; } .icon.tags { - background-position: -24px -48px; + background-position: -25px -48px; } .icon.book { background-position: -48px -48px; @@ -1219,7 +1219,7 @@ table .span12 { background-position: -144px -48px; } .icon.bold { - background-position: -168px -48px; + background-position: -167px -48px; } .icon.italic { background-position: -192px -48px; @@ -1320,11 +1320,41 @@ table .span12 { .icon.arrow-left { background-position: -240px -96px; } +.icon.plus-sign { + background-position: 0 -96px; +} +.icon.minus-sign { + background-position: -24px -96px; +} +.icon.remove-sign { + background-position: -48px -96px; +} +.icon.ok-sign { + background-position: -72px -96px; +} +.icon.question-sign { + background-position: -96px -96px; +} +.icon.info-sign { + background-position: -120px -96px; +} +.icon.screenshot { + background-position: -144px -96px; +} +.icon.remove-circle { + background-position: -168px -96px; +} +.icon.ok-circle { + background-position: -192px -96px; +} +.icon.ban-circle { + background-position: -216px -96px; +} .icon.arrow-right { background-position: -264px -96px; } .icon.arrow-up { - background-position: -288px -96px; + background-position: -289px -96px; } .icon.arrow-down { background-position: -312px -96px; @@ -1342,11 +1372,71 @@ table .span12 { background-position: -408px -96px; } .icon.minus { - background-position: -432px -96px; + background-position: -433px -96px; } .icon.asterisk { background-position: -456px -96px; } +.icon.exclamation-sign { + background-position: 0 -120px; +} +.icon.gift { + background-position: -24px -120px; +} +.icon.leaf { + background-position: -48px -120px; +} +.icon.fire { + background-position: -72px -120px; +} +.icon.eye-open { + background-position: -96px -120px; +} +.icon.eye-close { + background-position: -120px -120px; +} +.icon.warning-sign { + background-position: -144px -120px; +} +.icon.plane { + background-position: -168px -120px; +} +.icon.calendar { + background-position: -192px -120px; +} +.icon.random { + background-position: -216px -120px; +} +.icon.comment { + background-position: -240px -120px; +} +.icon.magnet { + background-position: -264px -120px; +} +.icon.chevron-up { + background-position: -288px -120px; +} +.icon.chevron-down { + background-position: -313px -119px; +} +.icon.retweet { + background-position: -336px -120px; +} +.icon.shopping-cart { + background-position: -360px -120px; +} +.icon.folder-close { + background-position: -384px -120px; +} +.icon.folder-open { + background-position: -409px -120px; +} +.icon.resize-vertical { + background-position: -432px -119px; +} +.icon.resize-horizontal { + background-position: -456px -118px; +} .dropdown { position: relative; } diff --git a/docs/assets/img/glyphicons-halflings-sprite-white.png b/docs/assets/img/glyphicons-halflings-sprite-white.png deleted file mode 100644 index a92b1913a2ba..000000000000 Binary files a/docs/assets/img/glyphicons-halflings-sprite-white.png and /dev/null differ diff --git a/docs/assets/img/glyphicons-halflings-sprite.png b/docs/assets/img/glyphicons-halflings-sprite.png deleted file mode 100644 index b4e0acfbc112..000000000000 Binary files a/docs/assets/img/glyphicons-halflings-sprite.png and /dev/null differ diff --git a/docs/assets/img/glyphicons-halflings-white.png b/docs/assets/img/glyphicons-halflings-white.png new file mode 100644 index 000000000000..a20760bfde58 Binary files /dev/null and b/docs/assets/img/glyphicons-halflings-white.png differ diff --git a/docs/assets/img/glyphicons-halflings.png b/docs/assets/img/glyphicons-halflings.png new file mode 100644 index 000000000000..151407a29a44 Binary files /dev/null and b/docs/assets/img/glyphicons-halflings.png differ diff --git a/docs/base-css.html b/docs/base-css.html index 9cad9de01730..da52680690ce 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1338,10 +1338,6 @@

Icons Graciously provided by - - - + - + - + @@ -1441,7 +1471,7 @@

How to use

 <i class="icon search"></i>
 
-

There are over 100 classes to choose from for your icons. Just add an <i> tag with the right classes and you're set. You can find the full list in sprites.less or right here in this document.

+

There are 120 classes to choose from for your icons. Just add an <i> tag with the right classes and you're set. You can find the full list in sprites.less or right here in this document.

Use cases

@@ -1462,7 +1492,7 @@

Examples

Use them in buttons, or in button groups for a toolbar style presentation.

Refresh - Settings + Delete

diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index c3d10eb08142..6476669e6161 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -1273,10 +1273,6 @@ -
-
-
-
@@ -1284,8 +1280,12 @@ +
+
+
+
- + @@ -1301,10 +1301,6 @@ -
-
-
-
@@ -1319,7 +1315,10 @@ - +
+
+
+
@@ -1329,10 +1328,6 @@ -
-
-
-
@@ -1345,6 +1340,20 @@ + + + + + + + + + + +
+
+
+
@@ -1355,6 +1364,27 @@ + + + + + + + + + + + + + + + + + + + + +
@@ -1376,7 +1406,7 @@
 <i class="icon search"></i>
 
-

{{_i}}There are over 100 classes to choose from for your icons. Just add an <i> tag with the right classes and you're set. You can find the full list in sprites.less or right here in this document.{{/i}}

+

{{_i}}There are 120 classes to choose from for your icons. Just add an <i> tag with the right classes and you're set. You can find the full list in sprites.less or right here in this document.{{/i}}

{{_i}}Use cases{{/i}}

@@ -1397,7 +1427,7 @@

{{_i}}Use them in buttons, or in button groups for a toolbar style presentation.{{/i}}

{{_i}}Refresh{{/i}} - {{_i}}Settings{{/i}} + {{_i}}Delete{{/i}}

diff --git a/img/glyphicons-halflings-sprite-white.png b/img/glyphicons-halflings-sprite-white.png deleted file mode 100644 index a92b1913a2ba..000000000000 Binary files a/img/glyphicons-halflings-sprite-white.png and /dev/null differ diff --git a/img/glyphicons-halflings-sprite.png b/img/glyphicons-halflings-sprite.png deleted file mode 100644 index b4e0acfbc112..000000000000 Binary files a/img/glyphicons-halflings-sprite.png and /dev/null differ diff --git a/img/glyphicons-halflings-white.png b/img/glyphicons-halflings-white.png new file mode 100644 index 000000000000..a20760bfde58 Binary files /dev/null and b/img/glyphicons-halflings-white.png differ diff --git a/img/glyphicons-halflings.png b/img/glyphicons-halflings.png new file mode 100644 index 000000000000..151407a29a44 Binary files /dev/null and b/img/glyphicons-halflings.png differ diff --git a/less/sprites.less b/less/sprites.less index 599434b2bc38..c7cdc1710896 100644 --- a/less/sprites.less +++ b/less/sprites.less @@ -7,13 +7,15 @@ // ----- // As of v2.0.0, the tag is reserved for icons from the Glyphicons set. -// All icons receive the styles of the tag and are then given a unique -// class to add width, height, and background-position. Your resulting HTML -// will look like . +// All icons receive the styles of the tag with a base class of .icon +// and are then given a unique class to add width, height, and +// background-position. Your resulting HTML will look like this: +// . And for the white version of the icons, just +// add the .white class like this: .icon { - background-image: url(../img/glyphicons-halflings-sprite.png); - background-position: 0 0; + background-image: url(../img/glyphicons-halflings.png); + background-position: 14px 14px; background-repeat: no-repeat; display: inline-block; vertical-align: text-top; @@ -21,7 +23,7 @@ height: 14px; } .icon.white { - background-image: url(../img/glyphicons-halflings-sprite-white.png); + background-image: url(../img/glyphicons-halflings-white.png); } .icon.glass { background-position: 0 0; } @@ -56,7 +58,7 @@ .icon.play-circle { background-position: -192px -24px; } .icon.repeat { background-position: -216px -24px; } .icon.refresh { background-position: -240px -24px; } -.icon.calendar { background-position: -264px -24px; } +.icon.list-alt { background-position: -264px -24px; } .icon.lock { background-position: -288px -24px; } .icon.flag { background-position: -312px -24px; } .icon.headphones { background-position: -336px -24px; } @@ -67,13 +69,13 @@ .icon.barcode { background-position: -456px -24px; } .icon.tag { background-position: 0 -48px; } -.icon.tags { background-position: -24px -48px; } +.icon.tags { background-position: -25px -48px; } .icon.book { background-position: -48px -48px; } .icon.bookmark { background-position: -72px -48px; } .icon.print { background-position: -96px -48px; } .icon.camera { background-position: -120px -48px; } .icon.font { background-position: -144px -48px; } -.icon.bold { background-position: -168px -48px; } +.icon.bold { background-position: -167px -48px; } .icon.italic { background-position: -192px -48px; } .icon.text-height { background-position: -216px -48px; } .icon.text-width { background-position: -240px -48px; } @@ -108,14 +110,44 @@ .icon.chevron-left { background-position: -432px -72px; } .icon.chevron-right { background-position: -456px -72px; } +.icon.plus-sign { background-position: 0 -96px; } +.icon.minus-sign { background-position: -24px -96px; } +.icon.remove-sign { background-position: -48px -96px; } +.icon.ok-sign { background-position: -72px -96px; } +.icon.question-sign { background-position: -96px -96px; } +.icon.info-sign { background-position: -120px -96px; } +.icon.screenshot { background-position: -144px -96px; } +.icon.remove-circle { background-position: -168px -96px; } +.icon.ok-circle { background-position: -192px -96px; } +.icon.ban-circle { background-position: -216px -96px; } .icon.arrow-left { background-position: -240px -96px; } .icon.arrow-right { background-position: -264px -96px; } -.icon.arrow-up { background-position: -288px -96px; } +.icon.arrow-up { background-position: -289px -96px; } .icon.arrow-down { background-position: -312px -96px; } .icon.share-alt { background-position: -336px -96px; } .icon.resize-full { background-position: -360px -96px; } .icon.resize-small { background-position: -384px -96px; } .icon.plus { background-position: -408px -96px; } -.icon.minus { background-position: -432px -96px; } +.icon.minus { background-position: -433px -96px; } .icon.asterisk { background-position: -456px -96px; } +.icon.exclamation-sign { background-position: 0 -120px; } +.icon.gift { background-position: -24px -120px; } +.icon.leaf { background-position: -48px -120px; } +.icon.fire { background-position: -72px -120px; } +.icon.eye-open { background-position: -96px -120px; } +.icon.eye-close { background-position: -120px -120px; } +.icon.warning-sign { background-position: -144px -120px; } +.icon.plane { background-position: -168px -120px; } +.icon.calendar { background-position: -192px -120px; } +.icon.random { background-position: -216px -120px; } +.icon.comment { background-position: -240px -120px; } +.icon.magnet { background-position: -264px -120px; } +.icon.chevron-up { background-position: -288px -120px; } +.icon.chevron-down { background-position: -313px -119px; } +.icon.retweet { background-position: -336px -120px; } +.icon.shopping-cart { background-position: -360px -120px; } +.icon.folder-close { background-position: -384px -120px; } +.icon.folder-open { background-position: -408px -120px; } +.icon.resize-vertical { background-position: -432px -119px; } +.icon.resize-horizontal { background-position: -456px -118px; }