From 5fdd917918b9470ae3b0ec30ee89c8e20a14c157 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 7 Dec 2013 16:28:29 -0800 Subject: [PATCH] improve icon display on narrow devices --- components.html | 1606 +++++++++++++++++++------------------- docs-assets/css/docs.css | 16 +- 2 files changed, 815 insertions(+), 807 deletions(-) diff --git a/components.html b/components.html index b686a67d1..8377b8123 100644 --- a/components.html +++ b/components.html @@ -16,808 +16,810 @@ base_url: "../"

Available glyphs

Includes 200 glyphs in font format from the Glyphicon Halflings set. Glyphicons Halflings are normally not available for free, but their creator has made them available for Bootstrap free of cost. As a thank you, we only ask that you to include a link back to Glyphicons whenever possible.

- +
+ +

How to use

diff --git a/docs-assets/css/docs.css b/docs-assets/css/docs.css index 642b2ba7a..15b533dd9 100644 --- a/docs-assets/css/docs.css +++ b/docs-assets/css/docs.css @@ -1029,19 +1029,20 @@ h1[id] { */ .bs-glyphicons { - padding-left: 0; - padding-bottom: 1px; - margin-bottom: 20px; - list-style: none; + margin: 0 -19px 20px -16px; overflow: hidden; } +.bs-glyphicons-list { + padding-left: 0; + list-style: none; +} .bs-glyphicons li { float: left; width: 25%; height: 115px; padding: 10px; margin: 0 -1px -1px 0; - font-size: 12px; + font-size: 10px; line-height: 1.4; text-align: center; border: 1px solid #ddd; @@ -1061,8 +1062,13 @@ h1[id] { } @media (min-width: 768px) { + .bs-glyphicons { + margin-left: 0; + margin-right: 0; + } .bs-glyphicons li { width: 12.5%; + font-size: 12px; } }