From 942d1b459568acb9f66525f8f6316a252a199e02 Mon Sep 17 00:00:00 2001 From: Burak Tuyan Date: Fri, 27 Jan 2012 16:33:18 +0200 Subject: Updating to latest version of Glyphicons Halflings set (v.1.5) along with some icon enhancements like: - Updated the Gylphicons Halflings set to version 1.5 (30 new icons) - Optimized the sprite PNG files for minimum filesize without any quality loss - Made some fixes for horizontal alignment at the LESS/CSS level (tags, bold, arrow-up, minus, chevron-down) - Made some fixes for vertical alignment at the LESS/CSS level (chevron-down, resize-vertical, resize-horizontal) - Renamed the old "calendar" class as "list-alt" class (because now we've a real calendar icon) - Changed the "background-position" of the icon class to "14px 14px", so that a wrong class name will not be showing the glass icon and instead will show a blank icon (which is useful for just positioning the text after the icons in some cases) - Added new icons (classes) to the base-css Docs (to both HTML file and Mustache template) - Changed one of the button examples to danger style and used a white icon - Renamed the sprite image files to save a few bytes here and there (from glyphicons-halflings-sprite.png to lyphicons-halflings.png and from glyphicons-halflings-sprite-white.png to glyphicons-halflings-white.png) --- docs/assets/css/bootstrap.css | 108 +++++++++++++++++++-- .../img/glyphicons-halflings-sprite-white.png | Bin 13566 -> 0 bytes docs/assets/img/glyphicons-halflings-sprite.png | Bin 14152 -> 0 bytes docs/assets/img/glyphicons-halflings-white.png | Bin 0 -> 4352 bytes docs/assets/img/glyphicons-halflings.png | Bin 0 -> 4364 bytes docs/base-css.html | 62 +++++++++--- docs/templates/pages/base-css.mustache | 62 +++++++++--- 7 files changed, 191 insertions(+), 41 deletions(-) delete mode 100644 docs/assets/img/glyphicons-halflings-sprite-white.png delete mode 100644 docs/assets/img/glyphicons-halflings-sprite.png create mode 100644 docs/assets/img/glyphicons-halflings-white.png create mode 100644 docs/assets/img/glyphicons-halflings.png (limited to 'docs') diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 68e161051..c878d70ff 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 a92b1913a..000000000 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 b4e0acfbc..000000000 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 000000000..a20760bfd 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 000000000..151407a29 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 9cad9de01..da5268069 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1338,10 +1338,6 @@ - - -
-
@@ -1349,8 +1345,12 @@ +
+
+
+
- + @@ -1366,10 +1366,6 @@ -
-
-
-
@@ -1384,7 +1380,10 @@ - +
+
+
+
@@ -1394,10 +1393,6 @@ -
-
-
-
@@ -1410,6 +1405,20 @@ + + + + + + + + + + +
+
+
+
@@ -1420,6 +1429,27 @@ + + + + + + + + + + + + + + + + + + + + +
@@ -1441,7 +1471,7 @@ 
 <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 @@

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 c3d10eb08..6476669e6 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}}

-- cgit v1.2.3 From acaa3b59775d6e4c3f4776027bb325b418dca6b5 Mon Sep 17 00:00:00 2001 From: Burak Tuyan Date: Fri, 27 Jan 2012 18:02:57 +0200 Subject: Changing the color of the default icons from black (#000) to grayDark (#333) --- docs/assets/img/glyphicons-halflings.png | Bin 4364 -> 4352 bytes 1 file changed, 0 insertions(+), 0 deletions(-) (limited to 'docs') diff --git a/docs/assets/img/glyphicons-halflings.png b/docs/assets/img/glyphicons-halflings.png index 151407a29..92d4445df 100644 Binary files a/docs/assets/img/glyphicons-halflings.png and b/docs/assets/img/glyphicons-halflings.png differ -- cgit v1.2.3 From b1f38bbea85c313f1a9512c821de1255e2a0d537 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 27 Jan 2012 13:39:19 -0800 Subject: update icon examples to show icons in differently sized buttons --- docs/assets/css/bootstrap.css | 2 +- docs/base-css.html | 4 ++++ docs/templates/pages/base-css.mustache | 4 ++++ 3 files changed, 9 insertions(+), 1 deletion(-) (limited to 'docs') diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 9c8aaee5a..0783aa7ee 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -6,7 +6,7 @@ * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Date: Fri Jan 27 13:35:54 PST 2012 + * Date: Fri Jan 27 13:38:50 PST 2012 */ article, aside, diff --git a/docs/base-css.html b/docs/base-css.html index 2cab601df..7968c70b3 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1477,6 +1477,10 @@
+

+ Refresh + Settings +

Or, use them in navigation.

diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index c3d10eb08..cf3e88c98 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -1412,6 +1412,10 @@
+

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

{{_i}}Or, use them in navigation.{{/i}}

-- cgit v1.2.3 From 3807a88ee9ba33f27bc8762efd789f7ff710ed1a Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 27 Jan 2012 13:56:50 -0800 Subject: update the docs for icons --- docs/assets/css/bootstrap.css | 28 ++++++++++++++-------------- docs/base-css.html | 9 +++++++-- docs/templates/pages/base-css.mustache | 9 +++++++-- 3 files changed, 28 insertions(+), 18 deletions(-) (limited to 'docs') diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index cf2f1b59f..10faa36c0 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -6,7 +6,7 @@ * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Date: Fri Jan 27 13:43:19 PST 2012 + * Date: Fri Jan 27 13:54:49 PST 2012 */ article, aside, @@ -1088,7 +1088,7 @@ table .span12 { background-image: url(../img/glyphicons-halflings-white.png); } .icon.glass { - background-position: 0 0; + background-position: 0 0; } .icon.music { background-position: -24px 0; @@ -1327,23 +1327,20 @@ table .span12 { .icon.chevron-right { background-position: -456px -72px; } -.icon.arrow-left { - background-position: -240px -96px; -} .icon.plus-sign { background-position: 0 -96px; } .icon.minus-sign { - background-position: -24px -96px; + background-position: -24px -96px; } .icon.remove-sign { - background-position: -48px -96px; + background-position: -48px -96px; } .icon.ok-sign { - background-position: -72px -96px; + background-position: -72px -96px; } .icon.question-sign { - background-position: -96px -96px; + background-position: -96px -96px; } .icon.info-sign { background-position: -120px -96px; @@ -1360,6 +1357,9 @@ table .span12 { .icon.ban-circle { background-position: -216px -96px; } +.icon.arrow-left { + background-position: -240px -96px; +} .icon.arrow-right { background-position: -264px -96px; } @@ -1391,16 +1391,16 @@ table .span12 { background-position: 0 -120px; } .icon.gift { - background-position: -24px -120px; + background-position: -24px -120px; } .icon.leaf { - background-position: -48px -120px; + background-position: -48px -120px; } .icon.fire { - background-position: -72px -120px; + background-position: -72px -120px; } .icon.eye-open { - background-position: -96px -120px; + background-position: -96px -120px; } .icon.eye-close { background-position: -120px -120px; @@ -1439,7 +1439,7 @@ table .span12 { background-position: -384px -120px; } .icon.folder-open { - background-position: -409px -120px; + background-position: -408px -120px; } .icon.resize-vertical { background-position: -432px -119px; diff --git a/docs/base-css.html b/docs/base-css.html index fa22216ef..698b68ea1 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -1454,7 +1454,7 @@
- Heads up! On hover we show a light red background color to highlight the size of the icon. This won't appear in normal usage of icons. + Heads up! Icon classes are echoed via CSS :after and on hover in the docs we show a light red background color show the icon's size.

@@ -1470,6 +1470,10 @@

With v2.0.0, we have opted to use an <i> tag for all our icons with a base class of .icon. To use, place the following code just about anywhere:

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

There are also styles available for inverted (white) icons, made ready with one extra class:

+
+<i class="icon white search"></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.

@@ -1488,10 +1492,11 @@

Examples

-
+

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

Refresh + Checkout Delete

diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index 45d359784..f6504a249 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -1389,7 +1389,7 @@
- {{_i}}Heads up! On hover we show a light red background color to highlight the size of the icon. This won't appear in normal usage of icons.{{/i}} + {{_i}}Heads up! Icon classes are echoed via CSS :after and on hover in the docs we show a light red background color show the icon's size.{{/i}}

@@ -1405,6 +1405,10 @@

{{_i}}With v2.0.0, we have opted to use an <i> tag for all our icons with a base class of .icon. To use, place the following code just about anywhere:{{/i}}

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

There are also styles available for inverted (white) icons, made ready with one extra class:

+
+<i class="icon white search"></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}}

@@ -1423,10 +1427,11 @@

{{_i}}Examples{{/i}}

-
+

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

{{_i}}Refresh{{/i}} + {{_i}}Checkout{{/i}} {{_i}}Delete{{/i}}

-- cgit v1.2.3 From 6353e5070ae429297bdfb215f17093e4ccbc08f2 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 27 Jan 2012 14:03:36 -0800 Subject: remove unused images from docs assets --- docs/assets/img/glyphicons-halflings-white.png | Bin 4352 -> 0 bytes docs/assets/img/glyphicons-halflings.png | Bin 4352 -> 0 bytes docs/assets/img/grid-18px.png | Bin 166 -> 0 bytes 3 files changed, 0 insertions(+), 0 deletions(-) delete mode 100644 docs/assets/img/glyphicons-halflings-white.png delete mode 100644 docs/assets/img/glyphicons-halflings.png delete mode 100644 docs/assets/img/grid-18px.png (limited to 'docs') diff --git a/docs/assets/img/glyphicons-halflings-white.png b/docs/assets/img/glyphicons-halflings-white.png deleted file mode 100644 index a20760bfd..000000000 Binary files a/docs/assets/img/glyphicons-halflings-white.png and /dev/null differ diff --git a/docs/assets/img/glyphicons-halflings.png b/docs/assets/img/glyphicons-halflings.png deleted file mode 100644 index 92d4445df..000000000 Binary files a/docs/assets/img/glyphicons-halflings.png and /dev/null differ diff --git a/docs/assets/img/grid-18px.png b/docs/assets/img/grid-18px.png deleted file mode 100644 index b2f88799b..000000000 Binary files a/docs/assets/img/grid-18px.png and /dev/null differ -- cgit v1.2.3 From 003da1e089edf06c528667009fb59189b5f0e4cc Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 27 Jan 2012 14:21:17 -0800 Subject: fix inputs in navbar --- docs/assets/css/bootstrap.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'docs') diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index 10faa36c0..5ebfba675 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -6,7 +6,7 @@ * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Date: Fri Jan 27 13:54:49 PST 2012 + * Date: Fri Jan 27 14:21:03 PST 2012 */ article, aside, @@ -1901,6 +1901,7 @@ table .span12 { } .navbar-form input, .navbar-form select { display: inline-block; + margin-top: 5px; margin-bottom: 0; } .navbar-search { -- cgit v1.2.3