aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorAndreas Cederstròˆm <[email protected]>2012-10-26 09:47:55 +0200
committerAndreas Cederstròˆm <[email protected]>2012-10-26 09:47:55 +0200
commit233e050adfc171685fd2c2f6ad760a8556aa0eb2 (patch)
tree2f1fba9a814dd8ad3f505e5fa8baf90e2e1585f5
parentc33169a6bae8675bd65767690d9098a4f9c071a9 (diff)
downloadbootstrap-233e050adfc171685fd2c2f6ad760a8556aa0eb2.tar.xz
bootstrap-233e050adfc171685fd2c2f6ad760a8556aa0eb2.zip
Adding .inline for ul and ol
-rw-r--r--docs/assets/css/bootstrap.css87
-rw-r--r--docs/base-css.html15
-rw-r--r--docs/templates/pages/base-css.mustache15
-rw-r--r--less/type.less15
4 files changed, 104 insertions, 28 deletions
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 2b8dfb944..725d0f680 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -747,6 +747,37 @@ ol.unstyled {
list-style: none;
}
+ul.inline,
+ol.inline {
+ *zoom: 1;
+}
+
+ul.inline:before,
+ol.inline:before,
+ul.inline:after,
+ol.inline:after {
+ display: table;
+ line-height: 0;
+ content: "";
+}
+
+ul.inline:after,
+ol.inline:after {
+ clear: both;
+}
+
+ul.inline > li,
+ol.inline > li {
+ float: left;
+ margin-right: 14px;
+ margin-left: 12px;
+}
+
+ul.unstyled.inline > li,
+ol.unstyled.inline > li {
+ padding-left: 0;
+}
+
dl {
margin-bottom: 20px;
}
@@ -2830,7 +2861,7 @@ table th[class*="span"],
background-image: -o-linear-gradient(top, #0088cc, #0077b3);
background-image: linear-gradient(to bottom, #0088cc, #0077b3);
background-repeat: repeat-x;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
}
.dropdown-menu .active > a,
@@ -2845,7 +2876,7 @@ table th[class*="span"],
background-image: linear-gradient(to bottom, #0088cc, #0077b3);
background-repeat: repeat-x;
outline: 0;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0);
}
.dropdown-menu .disabled > a,
@@ -3073,8 +3104,8 @@ button.close {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
*zoom: 1;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
@@ -3224,8 +3255,8 @@ input[type="button"].btn-block {
background-repeat: repeat-x;
border-color: #0044cc #0044cc #002a80;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-primary:hover,
@@ -3256,8 +3287,8 @@ input[type="button"].btn-block {
background-repeat: repeat-x;
border-color: #f89406 #f89406 #ad6704;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-warning:hover,
@@ -3288,8 +3319,8 @@ input[type="button"].btn-block {
background-repeat: repeat-x;
border-color: #bd362f #bd362f #802420;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-danger:hover,
@@ -3320,8 +3351,8 @@ input[type="button"].btn-block {
background-repeat: repeat-x;
border-color: #51a351 #51a351 #387038;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff51a351', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-success:hover,
@@ -3352,8 +3383,8 @@ input[type="button"].btn-block {
background-repeat: repeat-x;
border-color: #2f96b4 #2f96b4 #1f6377;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f96b4', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-info:hover,
@@ -3384,8 +3415,8 @@ input[type="button"].btn-block {
background-repeat: repeat-x;
border-color: #222222 #222222 #000000;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-inverse:hover,
@@ -4188,7 +4219,7 @@ input[type="submit"].btn.btn-mini {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
*zoom: 1;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
@@ -4457,8 +4488,8 @@ input[type="submit"].btn.btn-mini {
background-repeat: repeat-x;
border-color: #e5e5e5 #e5e5e5 #bfbfbf;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
@@ -4595,7 +4626,7 @@ input[type="submit"].btn.btn-mini {
background-image: linear-gradient(to bottom, #222222, #111111);
background-repeat: repeat-x;
border-color: #252525;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
}
.navbar-inverse .brand,
@@ -4705,8 +4736,8 @@ input[type="submit"].btn.btn-mini {
background-repeat: repeat-x;
border-color: #040404 #040404 #000000;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff151515', endColorstr='#ff040404', GradientType=0);
- filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff151515', endColorstr='#ff040404', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.navbar-inverse .btn-navbar:hover,
@@ -5544,7 +5575,7 @@ a.badge:hover {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0);
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
@@ -5565,7 +5596,7 @@ a.badge:hover {
background-image: -o-linear-gradient(top, #149bdf, #0480be);
background-image: linear-gradient(to bottom, #149bdf, #0480be);
background-repeat: repeat-x;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff149bdf', endColorstr='#ff0480be', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff149bdf', endColorstr='#ff0480be', GradientType=0);
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
@@ -5614,7 +5645,7 @@ a.badge:hover {
background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
background-image: linear-gradient(to bottom, #ee5f5b, #c43c35);
background-repeat: repeat-x;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffc43c35', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffc43c35', GradientType=0);
}
.progress-danger.progress-striped .bar,
@@ -5636,7 +5667,7 @@ a.badge:hover {
background-image: -o-linear-gradient(top, #62c462, #57a957);
background-image: linear-gradient(to bottom, #62c462, #57a957);
background-repeat: repeat-x;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff57a957', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff62c462', endColorstr='#ff57a957', GradientType=0);
}
.progress-success.progress-striped .bar,
@@ -5658,7 +5689,7 @@ a.badge:hover {
background-image: -o-linear-gradient(top, #5bc0de, #339bb9);
background-image: linear-gradient(to bottom, #5bc0de, #339bb9);
background-repeat: repeat-x;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff339bb9', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff339bb9', GradientType=0);
}
.progress-info.progress-striped .bar,
@@ -5680,7 +5711,7 @@ a.badge:hover {
background-image: -o-linear-gradient(top, #fbb450, #f89406);
background-image: linear-gradient(to bottom, #fbb450, #f89406);
background-repeat: repeat-x;
- filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffbb450', endColorstr='#fff89406', GradientType=0);
}
.progress-warning.progress-striped .bar,
diff --git a/docs/base-css.html b/docs/base-css.html
index 10a7dc62e..a045ec87e 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -376,6 +376,21 @@
&lt;/ul&gt;
</pre>
+ <h3>Inline</h3>
+ <p>A list of floated left items. Can be combined with with <code>.unstyled</code></p>
+ <div class="bs-docs-example">
+ <ul class="unstyled inline">
+ <li><span class="label label-important">&nbsp;&nbsp;</span> Stop signal</li>
+ <li><span class="label label-warning">&nbsp;&nbsp;</span> Prepare for signal</li>
+ <li><span class="label label-success">&nbsp;&nbsp;</span> Go!</li>
+ </ul>
+ </div>
+<pre class="prettyprint linenums">
+&lt;ul class="unstyled inline"&gt;
+ &lt;li&gt;...&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
<h3>Description</h3>
<p>A list of terms with their associated descriptions.</p>
<div class="bs-docs-example">
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index e0a028068..b80ce3966 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -313,6 +313,21 @@
&lt;/ul&gt;
</pre>
+ <h3>{{_i}}Inline{{/i}}</h3>
+ <p>{{_i}}A list of floated left items. Can be combined with with <code>.unstyled</code>{{/i}}</p>
+ <div class="bs-docs-example">
+ <ul class="unstyled inline">
+ <li><span class="label label-important">&nbsp;&nbsp;</span> Stop signal</li>
+ <li><span class="label label-warning">&nbsp;&nbsp;</span> Prepare for signal</li>
+ <li><span class="label label-success">&nbsp;&nbsp;</span> Go!</li>
+ </ul>
+ </div>
+<pre class="prettyprint linenums">
+&lt;ul class="unstyled inline"&gt;
+ &lt;li&gt;...&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
<h3>{{_i}}Description{{/i}}</h3>
<p>{{_i}}A list of terms with their associated descriptions.{{/i}}</p>
<div class="bs-docs-example">
diff --git a/less/type.less b/less/type.less
index 3b428e79d..883c476a8 100644
--- a/less/type.less
+++ b/less/type.less
@@ -117,6 +117,21 @@ ol.unstyled {
margin-left: 0;
list-style: none;
}
+ul.inline,
+ol.inline {
+ .clearfix();
+}
+ul.inline > li,
+ol.inline > li {
+ float: left;
+ margin-right: 14px;
+ margin-left: 12px;
+}
+// Reset left padding for unstyled
+ul.unstyled.inline > li,
+ol.unstyled.inline > li {
+ padding-left: 0;
+}
// Description Lists
dl {