mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-26 18:52:18 +01:00
Merge branch '3.0.0-wip' into gh-pages
This commit is contained in:
Mark Otto
commit
5abdcb3e71
@ -85,7 +85,6 @@
|
||||
<a href="#alerts">Alerts</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#alerts-default">Default alert</a></li>
|
||||
<li><a href="#alerts-block">Block alerts</a></li>
|
||||
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
|
||||
<li><a href="#alerts-links">Links in alerts</a></li>
|
||||
</ul>
|
||||
|
||||
@ -27,6 +27,20 @@ body {
|
||||
border-color: #563d7c;
|
||||
}
|
||||
|
||||
/* Homepage button */
|
||||
.btn-outline {
|
||||
color: #fff;
|
||||
background-color: transparent;
|
||||
border-color: #cdbfe3;
|
||||
}
|
||||
.btn-outline:hover,
|
||||
.btn-outline:focus,
|
||||
.btn-outline:active {
|
||||
color: #563d7c;
|
||||
background-color: #fff;
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
/* Temp CSS until RC2 */
|
||||
.bs-customize-placeholder {
|
||||
margin-bottom: -100px;
|
||||
@ -75,8 +89,21 @@ body {
|
||||
color: #555;
|
||||
}
|
||||
.bs-docs-home .bs-old-docs {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
text-align: center;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
color: inherit;
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
.bs-docs-home .bs-old-docs a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Homepage */
|
||||
.bs-docs-home {
|
||||
color: #cdbfe3;
|
||||
background-color: #563d7c;
|
||||
}
|
||||
|
||||
|
||||
@ -91,10 +118,11 @@ body {
|
||||
.bs-masthead h1 {
|
||||
font-size: 50px;
|
||||
line-height: 1;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Download button */
|
||||
.bs-masthead .btn-bs {
|
||||
.bs-masthead .btn-outline {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
padding: 18px 24px;
|
||||
@ -120,6 +148,9 @@ body {
|
||||
.bs-masthead-links li + li {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.bs-masthead-links a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -796,8 +827,8 @@ input.focused {
|
||||
|
||||
/* Tweak display of docs jumbotrons */
|
||||
.bs-masthead {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 100px;
|
||||
padding-top: 140px;
|
||||
padding-bottom: 140px;
|
||||
}
|
||||
.bs-masthead h1 {
|
||||
font-size: 100px;
|
||||
|
||||
@ -203,8 +203,8 @@ base_url: "../"
|
||||
<div class="bs-example">
|
||||
<div class="btn-group btn-group-justified">
|
||||
<a href="#" class="btn btn-default">Left</a>
|
||||
<a href="#" class="btn btn-default">Right</a>
|
||||
<a href="#" class="btn btn-default">Middle</a>
|
||||
<a href="#" class="btn btn-default">Right</a>
|
||||
</div>
|
||||
</div>
|
||||
{% highlight html %}
|
||||
@ -782,6 +782,7 @@ base_url: "../"
|
||||
</div>
|
||||
{% endhighlight %}
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@ -1812,23 +1813,6 @@ body { padding-bottom: 70px; }
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<strong>Warning!</strong> Best check yo self, you're not looking too good.
|
||||
</div>
|
||||
{% endhighlight %}
|
||||
|
||||
<h3 id="alerts-block">Block alerts</h3>
|
||||
<p>For longer messages, increase the padding on the top and bottom of the alert wrapper by adding <code>.alert-block</code>.</p>
|
||||
<div class="bs-example">
|
||||
<div class="alert alert-block">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<h4>Warning!</h4>
|
||||
<p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
|
||||
</div>
|
||||
</div>
|
||||
{% highlight html %}
|
||||
<div class="alert alert-block">
|
||||
<button type="button" class="close" data-dismiss="alert">×</button>
|
||||
<h4>Warning!</h4>
|
||||
<p>...</p>
|
||||
</div>
|
||||
{% endhighlight %}
|
||||
|
||||
<h3 id="alerts-alternatives">Contextual alternatives</h3>
|
||||
@ -2366,7 +2350,7 @@ body { padding-bottom: 70px; }
|
||||
<p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
|
||||
|
||||
<!-- List group -->
|
||||
<ul class="list-group list-group-flush">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">Cras justo odio</li>
|
||||
<li class="list-group-item">Dapibus ac facilisis in</li>
|
||||
<li class="list-group-item">Morbi leo risus</li>
|
||||
@ -2382,7 +2366,7 @@ body { padding-bottom: 70px; }
|
||||
<p>...</p>
|
||||
|
||||
<!-- List group -->
|
||||
<ul class="list-group list-group-flush">
|
||||
<ul class="list-group">
|
||||
<li class="list-group-item">Cras justo odio</li>
|
||||
<li class="list-group-item">Dapibus ac facilisis in</li>
|
||||
<li class="list-group-item">Morbi leo risus</li>
|
||||
|
||||
76
css.html
76
css.html
@ -263,32 +263,32 @@ base_url: "../"
|
||||
<p>Build on the previous example by creating even more dynamic and powerful layouts with tablet <code>.col-sm-*</code> classes.</p>
|
||||
<div class="bs-docs-grid">
|
||||
<div class="row show-grid">
|
||||
<div class="col-12 col-sm-8 col-lg-8">.col-12 .col-lg-8</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-12 col-sm-8 col-lg-8">.col-12 .col-sm-8 .col-lg-8</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
</div>
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
</div>
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-sm-6 .col-lg-6</div>
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-sm-6 .col-lg-6</div>
|
||||
</div>
|
||||
</div>
|
||||
{% highlight html %}
|
||||
<div class="row">
|
||||
<div class="col-12 col-sm-8 col-lg-8">.col-12 .col-lg-8</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-12 col-sm-8 col-lg-8">.col-12 .col-sm-8 .col-lg-8</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
<div class="col-6 col-sm-4 col-lg-4">.col-6 .col-sm-4 .col-lg-4</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-sm-6 .col-lg-6</div>
|
||||
<div class="col-6 col-sm-6 col-lg-6">.col-6 .col-sm-6 .col-lg-6</div>
|
||||
</div>
|
||||
{% endhighlight %}
|
||||
|
||||
@ -299,31 +299,31 @@ base_url: "../"
|
||||
</div>
|
||||
|
||||
<h3 id="grid-offsetting">Offsetting columns</h3>
|
||||
<p>Move columns to the right using <code>.col-offset-*</code> classes. These classes increase the left margin of a column by <code>*</code> columns. For example, <code>.col-offset-4</code> moves <code>.col-lg-4</code> over four columns.</p>
|
||||
<p>Move columns to the right using <code>.col-lg-offset-*</code> classes. These classes increase the left margin of a column by <code>*</code> columns. For example, <code>.col-lg-offset-4</code> moves <code>.col-lg-4</code> over four columns.</p>
|
||||
<div class="bs-docs-grid">
|
||||
<div class="row show-grid">
|
||||
<div class="col-lg-4">4</div>
|
||||
<div class="col-lg-4 col-offset-4">4 offset 4</div>
|
||||
<div class="col-lg-4 col-lg-offset-4">4 offset 4</div>
|
||||
</div><!-- /row -->
|
||||
<div class="row show-grid">
|
||||
<div class="col-lg-3 col-offset-3">3 offset 3</div>
|
||||
<div class="col-lg-3 col-offset-3">3 offset 3</div>
|
||||
<div class="col-lg-3 col-lg-offset-3">3 offset 3</div>
|
||||
<div class="col-lg-3 col-lg-offset-3">3 offset 3</div>
|
||||
</div><!-- /row -->
|
||||
<div class="row show-grid">
|
||||
<div class="col-lg-6 col-offset-3">6 offset 3</div>
|
||||
<div class="col-lg-6 col-lg-offset-3">6 offset 3</div>
|
||||
</div><!-- /row -->
|
||||
</div>
|
||||
{% highlight html %}
|
||||
<div class="row">
|
||||
<div class="col-lg-4">...</div>
|
||||
<div class="col-lg-4 col-offset-4">...</div>
|
||||
<div class="col-lg-4 col-lg-offset-4">...</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-offset-3">3 offset 3</div>
|
||||
<div class="col-lg-3 col-offset-3">3 offset 3</div>
|
||||
<div class="col-lg-3 col-lg-offset-3">3 offset 3</div>
|
||||
<div class="col-lg-3 col-lg-offset-3">3 offset 3</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-offset-3">...</div>
|
||||
<div class="col-lg-6 col-lg-offset-3">...</div>
|
||||
</div>
|
||||
{% endhighlight %}
|
||||
|
||||
@ -360,16 +360,16 @@ base_url: "../"
|
||||
{% endhighlight %}
|
||||
|
||||
<h3 id="grid-column-ordering">Column ordering</h3>
|
||||
<p>Easily change the order of our built-in grid columns with <code>.col-push-*</code> and <code>.col-pull-*</code> modifier classes.</p>
|
||||
<p>Easily change the order of our built-in grid columns with <code>.col-lg-push-*</code> and <code>.col-lg-pull-*</code> modifier classes.</p>
|
||||
<div class="row show-grid">
|
||||
<div class="col-lg-9 col-push-3">9</div>
|
||||
<div class="col-lg-3 col-pull-9">3</div>
|
||||
<div class="col-lg-9 col-lg-push-3">9</div>
|
||||
<div class="col-lg-3 col-lg-pull-9">3</div>
|
||||
</div>
|
||||
|
||||
{% highlight html %}
|
||||
<div class="row">
|
||||
<div class="col-lg-9 col-push-3">9</div>
|
||||
<div class="col-lg-3 col-pull-9">3</div>
|
||||
<div class="col-lg-9 col-lg-push-3">9</div>
|
||||
<div class="col-lg-3 col-lg-pull-9">3</div>
|
||||
</div>
|
||||
{% endhighlight %}
|
||||
|
||||
@ -1302,11 +1302,19 @@ For example, <code><section></code> should be wrapped as inline.
|
||||
<label for="inputPassword" class="col-lg-2 control-label">Password</label>
|
||||
<div class="col-lg-10">
|
||||
<input type="password" class="form-control" id="inputPassword" placeholder="Password">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-offset-2 col-lg-10">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"> Remember me
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-offset-2 col-lg-10">
|
||||
<button type="submit" class="btn btn-default">Sign in</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -1323,11 +1331,19 @@ For example, <code><section></code> should be wrapped as inline.
|
||||
<label for="inputPassword" class="col-lg-2 control-label">Password</label>
|
||||
<div class="col-lg-10">
|
||||
<input type="password" class="form-control" id="inputPassword" placeholder="Password">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-offset-2 col-lg-10">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"> Remember me
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-offset-2 col-lg-10">
|
||||
<button type="submit" class="btn btn-default">Sign in</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -1536,7 +1552,7 @@ For example, <code><section></code> should be wrapped as inline.
|
||||
{% endhighlight %}
|
||||
|
||||
<h3 id="forms-validation">Validation states</h3>
|
||||
<p>Bootstrap includes validation styles for error, warning, and success states on from controls. To use, add <code>.has-warning</code>, <code>.has-error</code>, or <code>.has-success</code> to the parent element. Any <code>.control-label</code>, <code>.form-control</code>, and <code>.help-block</code> within that element will receive the validation styles.</li>
|
||||
<p>Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add <code>.has-warning</code>, <code>.has-error</code>, or <code>.has-success</code> to the parent element. Any <code>.control-label</code>, <code>.form-control</code>, and <code>.help-block</code> within that element will receive the validation styles.</li>
|
||||
|
||||
<form class="bs-example">
|
||||
<div class="form-group has-warning">
|
||||
@ -1592,7 +1608,7 @@ For example, <code><section></code> should be wrapped as inline.
|
||||
</form>
|
||||
{% highlight html %}
|
||||
<input class="form-control input-large" type="text" placeholder=".input-large">
|
||||
<input class="form-control"type="text" placeholder="Default input">
|
||||
<input class="form-control" type="text" placeholder="Default input">
|
||||
<input class="form-control input-small" type="text" placeholder=".input-small">
|
||||
|
||||
<select class="form-control input-large">...</select>
|
||||
|
||||
378
dist/css/bootstrap.css
vendored
378
dist/css/bootstrap.css
vendored
@ -931,72 +931,105 @@ pre code {
|
||||
.col-sm-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-push-1 {
|
||||
.col-sm-push-1 {
|
||||
left: 8.333333333333332%;
|
||||
}
|
||||
.col-push-2 {
|
||||
.col-sm-push-2 {
|
||||
left: 16.666666666666664%;
|
||||
}
|
||||
.col-push-3 {
|
||||
.col-sm-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-push-4 {
|
||||
.col-sm-push-4 {
|
||||
left: 33.33333333333333%;
|
||||
}
|
||||
.col-push-5 {
|
||||
.col-sm-push-5 {
|
||||
left: 41.66666666666667%;
|
||||
}
|
||||
.col-push-6 {
|
||||
.col-sm-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-push-7 {
|
||||
.col-sm-push-7 {
|
||||
left: 58.333333333333336%;
|
||||
}
|
||||
.col-push-8 {
|
||||
.col-sm-push-8 {
|
||||
left: 66.66666666666666%;
|
||||
}
|
||||
.col-push-9 {
|
||||
.col-sm-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-push-10 {
|
||||
.col-sm-push-10 {
|
||||
left: 83.33333333333334%;
|
||||
}
|
||||
.col-push-11 {
|
||||
.col-sm-push-11 {
|
||||
left: 91.66666666666666%;
|
||||
}
|
||||
.col-pull-1 {
|
||||
.col-sm-pull-1 {
|
||||
right: 8.333333333333332%;
|
||||
}
|
||||
.col-pull-2 {
|
||||
.col-sm-pull-2 {
|
||||
right: 16.666666666666664%;
|
||||
}
|
||||
.col-pull-3 {
|
||||
.col-sm-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-pull-4 {
|
||||
.col-sm-pull-4 {
|
||||
right: 33.33333333333333%;
|
||||
}
|
||||
.col-pull-5 {
|
||||
.col-sm-pull-5 {
|
||||
right: 41.66666666666667%;
|
||||
}
|
||||
.col-pull-6 {
|
||||
.col-sm-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-pull-7 {
|
||||
.col-sm-pull-7 {
|
||||
right: 58.333333333333336%;
|
||||
}
|
||||
.col-pull-8 {
|
||||
.col-sm-pull-8 {
|
||||
right: 66.66666666666666%;
|
||||
}
|
||||
.col-pull-9 {
|
||||
.col-sm-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-pull-10 {
|
||||
.col-sm-pull-10 {
|
||||
right: 83.33333333333334%;
|
||||
}
|
||||
.col-pull-11 {
|
||||
.col-sm-pull-11 {
|
||||
right: 91.66666666666666%;
|
||||
}
|
||||
.col-sm-offset-1 {
|
||||
margin-left: 8.333333333333332%;
|
||||
}
|
||||
.col-sm-offset-2 {
|
||||
margin-left: 16.666666666666664%;
|
||||
}
|
||||
.col-sm-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-sm-offset-4 {
|
||||
margin-left: 33.33333333333333%;
|
||||
}
|
||||
.col-sm-offset-5 {
|
||||
margin-left: 41.66666666666667%;
|
||||
}
|
||||
.col-sm-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-sm-offset-7 {
|
||||
margin-left: 58.333333333333336%;
|
||||
}
|
||||
.col-sm-offset-8 {
|
||||
margin-left: 66.66666666666666%;
|
||||
}
|
||||
.col-sm-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-sm-offset-10 {
|
||||
margin-left: 83.33333333333334%;
|
||||
}
|
||||
.col-sm-offset-11 {
|
||||
margin-left: 91.66666666666666%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
@ -1053,37 +1086,103 @@ pre code {
|
||||
.col-lg-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-offset-1 {
|
||||
.col-lg-push-1 {
|
||||
left: 8.333333333333332%;
|
||||
}
|
||||
.col-lg-push-2 {
|
||||
left: 16.666666666666664%;
|
||||
}
|
||||
.col-lg-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-lg-push-4 {
|
||||
left: 33.33333333333333%;
|
||||
}
|
||||
.col-lg-push-5 {
|
||||
left: 41.66666666666667%;
|
||||
}
|
||||
.col-lg-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-lg-push-7 {
|
||||
left: 58.333333333333336%;
|
||||
}
|
||||
.col-lg-push-8 {
|
||||
left: 66.66666666666666%;
|
||||
}
|
||||
.col-lg-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-lg-push-10 {
|
||||
left: 83.33333333333334%;
|
||||
}
|
||||
.col-lg-push-11 {
|
||||
left: 91.66666666666666%;
|
||||
}
|
||||
.col-lg-pull-1 {
|
||||
right: 8.333333333333332%;
|
||||
}
|
||||
.col-lg-pull-2 {
|
||||
right: 16.666666666666664%;
|
||||
}
|
||||
.col-lg-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-lg-pull-4 {
|
||||
right: 33.33333333333333%;
|
||||
}
|
||||
.col-lg-pull-5 {
|
||||
right: 41.66666666666667%;
|
||||
}
|
||||
.col-lg-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-lg-pull-7 {
|
||||
right: 58.333333333333336%;
|
||||
}
|
||||
.col-lg-pull-8 {
|
||||
right: 66.66666666666666%;
|
||||
}
|
||||
.col-lg-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-lg-pull-10 {
|
||||
right: 83.33333333333334%;
|
||||
}
|
||||
.col-lg-pull-11 {
|
||||
right: 91.66666666666666%;
|
||||
}
|
||||
.col-lg-offset-1 {
|
||||
margin-left: 8.333333333333332%;
|
||||
}
|
||||
.col-offset-2 {
|
||||
.col-lg-offset-2 {
|
||||
margin-left: 16.666666666666664%;
|
||||
}
|
||||
.col-offset-3 {
|
||||
.col-lg-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-offset-4 {
|
||||
.col-lg-offset-4 {
|
||||
margin-left: 33.33333333333333%;
|
||||
}
|
||||
.col-offset-5 {
|
||||
.col-lg-offset-5 {
|
||||
margin-left: 41.66666666666667%;
|
||||
}
|
||||
.col-offset-6 {
|
||||
.col-lg-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-offset-7 {
|
||||
.col-lg-offset-7 {
|
||||
margin-left: 58.333333333333336%;
|
||||
}
|
||||
.col-offset-8 {
|
||||
.col-lg-offset-8 {
|
||||
margin-left: 66.66666666666666%;
|
||||
}
|
||||
.col-offset-9 {
|
||||
.col-lg-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-offset-10 {
|
||||
.col-lg-offset-10 {
|
||||
margin-left: 83.33333333333334%;
|
||||
}
|
||||
.col-offset-11 {
|
||||
.col-lg-offset-11 {
|
||||
margin-left: 91.66666666666666%;
|
||||
}
|
||||
}
|
||||
@ -1354,8 +1453,8 @@ input[type="number"]::-webkit-inner-spin-button {
|
||||
.form-control {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 38px;
|
||||
padding: 8px 12px;
|
||||
height: 34px;
|
||||
padding: 6px 12px;
|
||||
font-size: 14px;
|
||||
line-height: 1.428571429;
|
||||
color: #555555;
|
||||
@ -1439,9 +1538,10 @@ textarea.form-control {
|
||||
}
|
||||
|
||||
.input-large {
|
||||
height: 56px;
|
||||
padding: 14px 16px;
|
||||
height: 45px;
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
line-height: 1.33;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
@ -1449,12 +1549,13 @@ textarea.form-control {
|
||||
height: 30px;
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
select.input-large {
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
}
|
||||
|
||||
select.input-small {
|
||||
@ -1546,9 +1647,65 @@ textarea.input-small {
|
||||
color: #737373;
|
||||
}
|
||||
|
||||
.form-inline .form-control,
|
||||
.form-inline .radio,
|
||||
.form-inline .checkbox {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.form-inline .radio,
|
||||
.form-inline .checkbox {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.form-horizontal .control-label,
|
||||
.form-horizontal .radio-inline,
|
||||
.form-horizontal .checkbox-inline {
|
||||
padding-top: 9px;
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:before,
|
||||
.form-horizontal .form-group:after {
|
||||
display: table;
|
||||
content: " ";
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:before,
|
||||
.form-horizontal .form-group:after {
|
||||
display: table;
|
||||
content: " ";
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.form-horizontal .form-group {
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-horizontal .form-group .row {
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.form-horizontal .control-label {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
padding: 8px 12px;
|
||||
padding: 6px 12px;
|
||||
margin-bottom: 0;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
@ -1833,8 +1990,9 @@ fieldset[disabled] .btn-link:focus {
|
||||
}
|
||||
|
||||
.btn-large {
|
||||
padding: 14px 16px;
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
line-height: 1.33;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
@ -1894,6 +2052,7 @@ input[type="button"].btn-block {
|
||||
}
|
||||
|
||||
.input-group {
|
||||
position: relative;
|
||||
display: table;
|
||||
border-collapse: separate;
|
||||
}
|
||||
@ -1929,7 +2088,7 @@ input[type="button"].btn-block {
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
padding: 8px 12px;
|
||||
padding: 6px 12px;
|
||||
font-size: 14px;
|
||||
font-weight: normal;
|
||||
line-height: 1.428571429;
|
||||
@ -1949,7 +2108,7 @@ input[type="button"].btn-block {
|
||||
}
|
||||
|
||||
.input-group-addon.input-large {
|
||||
padding: 14px 16px;
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
@ -2003,60 +2162,6 @@ input[type="button"].btn-block {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.form-inline .form-control,
|
||||
.form-inline .radio,
|
||||
.form-inline .checkbox {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.form-inline .radio,
|
||||
.form-inline .checkbox {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.form-horizontal .control-label {
|
||||
padding-top: 9px;
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:before,
|
||||
.form-horizontal .form-group:after {
|
||||
display: table;
|
||||
content: " ";
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:before,
|
||||
.form-horizontal .form-group:after {
|
||||
display: table;
|
||||
content: " ";
|
||||
}
|
||||
|
||||
.form-horizontal .form-group:after {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.form-horizontal .form-group {
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-horizontal .form-group .row {
|
||||
margin-right: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.form-horizontal .control-label {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.caret {
|
||||
display: inline-block;
|
||||
width: 0;
|
||||
@ -2069,6 +2174,10 @@ input[type="button"].btn-block {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
@ -2277,6 +2386,23 @@ a.list-group-item.active .list-group-item-text {
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.panel .list-group {
|
||||
margin: 15px -15px -15px;
|
||||
}
|
||||
|
||||
.panel .list-group .list-group-item {
|
||||
border-width: 1px 0;
|
||||
}
|
||||
|
||||
.panel .list-group .list-group-item:first-child {
|
||||
border-top-right-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
|
||||
.panel .list-group .list-group-item:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.panel-heading {
|
||||
padding: 10px 15px;
|
||||
margin: -15px -15px 15px;
|
||||
@ -2352,23 +2478,6 @@ a.list-group-item.active .list-group-item-text {
|
||||
border-color: #bce8f1;
|
||||
}
|
||||
|
||||
.list-group-flush {
|
||||
margin: 15px -15px -15px;
|
||||
}
|
||||
|
||||
.list-group-flush .list-group-item {
|
||||
border-width: 1px 0;
|
||||
}
|
||||
|
||||
.list-group-flush .list-group-item:first-child {
|
||||
border-top-right-radius: 0;
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
|
||||
.list-group-flush .list-group-item:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.well {
|
||||
min-height: 20px;
|
||||
padding: 19px;
|
||||
@ -2798,8 +2907,8 @@ button.close {
|
||||
}
|
||||
|
||||
.navbar-form {
|
||||
margin-top: 6px;
|
||||
margin-bottom: 6px;
|
||||
margin-top: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.navbar-form .form-control,
|
||||
@ -2970,10 +3079,12 @@ button.close {
|
||||
}
|
||||
|
||||
.navbar-btn {
|
||||
margin-top: 6px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.navbar-text {
|
||||
float: left;
|
||||
padding: 0 15px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
@ -3251,7 +3362,7 @@ button.close {
|
||||
|
||||
.pagination-large > li > a,
|
||||
.pagination-large > li > span {
|
||||
padding: 14px 16px;
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
@ -3750,7 +3861,7 @@ button.close {
|
||||
}
|
||||
|
||||
.alert {
|
||||
padding: 10px 35px 10px 15px;
|
||||
padding: 15px 35px 15px 15px;
|
||||
margin-bottom: 20px;
|
||||
color: #c09853;
|
||||
background-color: #fcf8e3;
|
||||
@ -3768,7 +3879,7 @@ button.close {
|
||||
}
|
||||
|
||||
.alert .alert-link {
|
||||
font-weight: 500;
|
||||
font-weight: bold;
|
||||
color: #a47e3c;
|
||||
}
|
||||
|
||||
@ -3779,6 +3890,15 @@ button.close {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.alert > p,
|
||||
.alert > ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.alert > p + p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.alert-success {
|
||||
color: #468847;
|
||||
background-color: #dff0d8;
|
||||
@ -3821,20 +3941,6 @@ button.close {
|
||||
color: #2d6987;
|
||||
}
|
||||
|
||||
.alert-block {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.alert-block > p,
|
||||
.alert-block > ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.alert-block p + p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.thumbnail,
|
||||
.img-thumbnail {
|
||||
padding: 4px;
|
||||
@ -3917,7 +4023,7 @@ a.thumbnail:focus {
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
vertical-align: baseline;
|
||||
background-color: #999999;
|
||||
border-radius: .25em;
|
||||
}
|
||||
@ -3976,7 +4082,7 @@ a.thumbnail:focus {
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
vertical-align: baseline;
|
||||
background-color: #999999;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
2
dist/css/bootstrap.min.css
vendored
2
dist/css/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
18
dist/js/bootstrap.js
vendored
18
dist/js/bootstrap.js
vendored
@ -219,7 +219,9 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
|
||||
var $parent = this.$element.closest('[data-toggle="buttons"]')
|
||||
|
||||
if ($parent.length) {
|
||||
var $input = this.$element.find('input').prop('checked', !this.$element.hasClass('active'))
|
||||
var $input = this.$element.find('input')
|
||||
.prop('checked', !this.$element.hasClass('active'))
|
||||
.trigger('change')
|
||||
if ($input.prop('type') === 'radio') $parent.find('.active').removeClass('active')
|
||||
}
|
||||
|
||||
@ -235,7 +237,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
|
||||
$.fn.button = function (option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data('button')
|
||||
var data = $this.data('bs.button')
|
||||
var options = typeof option == 'object' && option
|
||||
|
||||
if (!data) $this.data('bs.button', (data = new Button(this, options)))
|
||||
@ -533,7 +535,7 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
|
||||
this.$element.trigger(startEvent)
|
||||
if (startEvent.isDefaultPrevented()) return
|
||||
|
||||
var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
|
||||
var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
|
||||
|
||||
if (actives && actives.length) {
|
||||
var hasData = actives.data('bs.collapse')
|
||||
@ -1313,6 +1315,8 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
|
||||
var $tip = this.tip()
|
||||
var e = $.Event('hide.bs.' + this.type)
|
||||
|
||||
function complete() { $tip.detach() }
|
||||
|
||||
this.$element.trigger(e)
|
||||
|
||||
if (e.isDefaultPrevented()) return
|
||||
@ -1321,9 +1325,9 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
|
||||
|
||||
$.support.transition && this.$tip.hasClass('fade') ?
|
||||
$tip
|
||||
.one($.support.transition.end, $tip.detach)
|
||||
.one($.support.transition.end, complete)
|
||||
.emulateTransitionEnd(150) :
|
||||
$tip.detach()
|
||||
complete()
|
||||
|
||||
this.$element.trigger('hidden.bs.' + this.type)
|
||||
|
||||
@ -1509,10 +1513,6 @@ if (!jQuery) { throw new Error("Bootstrap requires jQuery") }
|
||||
return this.$tip
|
||||
}
|
||||
|
||||
Popover.prototype.destroy = function () {
|
||||
this.hide().$element.off('.' + this.type).removeData(this.type)
|
||||
}
|
||||
|
||||
|
||||
// POPOVER PLUGIN DEFINITION
|
||||
// =========================
|
||||
|
||||
2
dist/js/bootstrap.min.js
vendored
2
dist/js/bootstrap.min.js
vendored
File diff suppressed because one or more lines are too long
@ -112,7 +112,7 @@ bootstrap/
|
||||
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
|
||||
<!-- Optionally enable responsive features in IE8 -->
|
||||
<!-- Optionally enable responsive features in IE8. Respond.js can be obtained from https://github.com/scottjehl/Respond -->
|
||||
<script src="js/respond.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -9,7 +9,7 @@ base_url: "./"
|
||||
<h1>Bootstrap 3</h1>
|
||||
<p class="lead">Sleek, intuitive, and powerful mobile-first front-end framework for faster and easier web development.</p>
|
||||
<p>
|
||||
<a href="{{ site.download_dist }}" class="btn btn-bs btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0 RC1']);">Download Bootstrap</a>
|
||||
<a href="{{ site.download_dist }}" class="btn btn-outline btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0 RC1']);">Download Bootstrap</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -24,7 +24,7 @@ base_url: "../"
|
||||
|
||||
<div class="bs-callout bs-callout-danger">
|
||||
<h4>Plugin dependencies</h4>
|
||||
<p>Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs.</p>
|
||||
<p>Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that all plugins depend on jQuery (this means jQuery must be included <strong>before</strong> the plugin files).</p>
|
||||
</div>
|
||||
|
||||
<h3 id="js-data-attrs">Data attributes</h3>
|
||||
@ -168,7 +168,7 @@ $('#myModal').on('show.bs.modal', function (e) {
|
||||
|
||||
<hr>
|
||||
|
||||
<h4>Overflowing text to show optional scrollbar</h4>
|
||||
<h4>Overflowing text to show scroll behavior</h4>
|
||||
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
|
||||
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
|
||||
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
|
||||
@ -262,7 +262,7 @@ $('#myModal').on('show.bs.modal', function (e) {
|
||||
<td>remote</td>
|
||||
<td>path</td>
|
||||
<td>false</td>
|
||||
<td><p>If a remote URL is provided, content will be loaded via jQuery's <code>load</code> method and injected into the <code>.modal-body</code>. If you're using the data api, you may alternatively use the <code>href</code> tag to specify the remote source. An example of this is shown below:</p>
|
||||
<td><p>If a remote URL is provided, content will be loaded via jQuery's <code>load</code> method and injected into the <code>.modal-body</code>. If you're using the data api, you may alternatively use the <code>href</code> attribute to specify the remote source. An example of this is shown below:</p>
|
||||
{% highlight html %}
|
||||
<a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a>
|
||||
{% endhighlight %}
|
||||
@ -397,7 +397,7 @@ $('#myModal').on('hidden.bs.modal', function () {
|
||||
<ul class="nav nav-pills">
|
||||
<li class="active"><a href="#">Regular link</a></li>
|
||||
<li class="dropdown">
|
||||
<a class="dropdown-toggle" id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
|
||||
<a id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
|
||||
<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@ -407,7 +407,7 @@ $('#myModal').on('hidden.bs.modal', function () {
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a class="dropdown-toggle" id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
|
||||
<a id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
|
||||
<ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@ -417,7 +417,7 @@ $('#myModal').on('hidden.bs.modal', function () {
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a class="dropdown-toggle" id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3 <b class="caret"></b></a>
|
||||
<a id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3 <b class="caret"></b></a>
|
||||
<ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop6">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@ -436,7 +436,7 @@ $('#myModal').on('hidden.bs.modal', function () {
|
||||
<p>Add <code>data-toggle="dropdown"</code> to a link or button to toggle a dropdown.</p>
|
||||
{% highlight html %}
|
||||
<div class="dropdown">
|
||||
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a>
|
||||
<a data-toggle="dropdown" href="#">Dropdown trigger</a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
|
||||
...
|
||||
</ul>
|
||||
@ -445,7 +445,7 @@ $('#myModal').on('hidden.bs.modal', function () {
|
||||
<p>To keep URLs intact, use the <code>data-target</code> attribute instead of <code>href="#"</code>.</p>
|
||||
{% highlight html %}
|
||||
<div class="dropdown">
|
||||
<a class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
|
||||
<a id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
|
||||
Dropdown <span class="caret"></span>
|
||||
</a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
|
||||
@ -531,7 +531,7 @@ $('.dropdown-toggle').dropdown()
|
||||
<h3>Via JavaScript</h3>
|
||||
<p>Call the scrollspy via JavaScript:</p>
|
||||
{% highlight js %}
|
||||
$('#navbar-example').scrollspy()
|
||||
$('#navbar-example').scrollspy(options)
|
||||
{% endhighlight %}
|
||||
|
||||
<div class="bs-callout bs-callout-danger">
|
||||
@ -802,7 +802,7 @@ $('#example').tooltip(options)
|
||||
<td>title</td>
|
||||
<td>string | function</td>
|
||||
<td>''</td>
|
||||
<td>default title value if <code>title</code> tag isn't present</td>
|
||||
<td>default title value if <code>title</code> attribute isn't present</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>trigger</td>
|
||||
@ -1480,7 +1480,7 @@ $(".collapse").collapse()
|
||||
<td>parent</td>
|
||||
<td>selector</td>
|
||||
<td>false</td>
|
||||
<td>If selector then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior)</td>
|
||||
<td>If selector then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior - this dependent on the <code>accordion-group</code> class)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>toggle</td>
|
||||
|
||||
@ -56,7 +56,9 @@
|
||||
var $parent = this.$element.closest('[data-toggle="buttons"]')
|
||||
|
||||
if ($parent.length) {
|
||||
var $input = this.$element.find('input').prop('checked', !this.$element.hasClass('active'))
|
||||
var $input = this.$element.find('input')
|
||||
.prop('checked', !this.$element.hasClass('active'))
|
||||
.trigger('change')
|
||||
if ($input.prop('type') === 'radio') $parent.find('.active').removeClass('active')
|
||||
}
|
||||
|
||||
@ -72,7 +74,7 @@
|
||||
$.fn.button = function (option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data('button')
|
||||
var data = $this.data('bs.button')
|
||||
var options = typeof option == 'object' && option
|
||||
|
||||
if (!data) $this.data('bs.button', (data = new Button(this, options)))
|
||||
|
||||
@ -48,7 +48,7 @@
|
||||
this.$element.trigger(startEvent)
|
||||
if (startEvent.isDefaultPrevented()) return
|
||||
|
||||
var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
|
||||
var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
|
||||
|
||||
if (actives && actives.length) {
|
||||
var hasData = actives.data('bs.collapse')
|
||||
|
||||
@ -80,10 +80,6 @@
|
||||
return this.$tip
|
||||
}
|
||||
|
||||
Popover.prototype.destroy = function () {
|
||||
this.hide().$element.off('.' + this.type).removeData(this.type)
|
||||
}
|
||||
|
||||
|
||||
// POPOVER PLUGIN DEFINITION
|
||||
// =========================
|
||||
|
||||
@ -165,9 +165,9 @@ $(function () {
|
||||
.appendTo('#qunit-fixture')
|
||||
.find('[data-toggle="dropdown"]')
|
||||
.dropdown()
|
||||
|
||||
|
||||
stop()
|
||||
|
||||
|
||||
dropdown
|
||||
.parent('.dropdown')
|
||||
.bind('show.bs.dropdown', function () {
|
||||
@ -177,7 +177,7 @@ $(function () {
|
||||
ok(true, 'hide was called')
|
||||
start()
|
||||
})
|
||||
|
||||
|
||||
dropdown.click()
|
||||
$(document.body).click()
|
||||
})
|
||||
@ -199,9 +199,9 @@ $(function () {
|
||||
.appendTo('#qunit-fixture')
|
||||
.find('[data-toggle="dropdown"]')
|
||||
.dropdown()
|
||||
|
||||
|
||||
stop()
|
||||
|
||||
|
||||
dropdown
|
||||
.parent('.dropdown')
|
||||
.bind('shown.bs.dropdown', function () {
|
||||
@ -211,7 +211,7 @@ $(function () {
|
||||
ok(true, 'hide was called')
|
||||
start()
|
||||
})
|
||||
|
||||
|
||||
dropdown.click()
|
||||
$(document.body).click()
|
||||
})
|
||||
|
||||
@ -249,6 +249,8 @@
|
||||
var $tip = this.tip()
|
||||
var e = $.Event('hide.bs.' + this.type)
|
||||
|
||||
function complete() { $tip.detach() }
|
||||
|
||||
this.$element.trigger(e)
|
||||
|
||||
if (e.isDefaultPrevented()) return
|
||||
@ -257,9 +259,9 @@
|
||||
|
||||
$.support.transition && this.$tip.hasClass('fade') ?
|
||||
$tip
|
||||
.one($.support.transition.end, $tip.detach)
|
||||
.one($.support.transition.end, complete)
|
||||
.emulateTransitionEnd(150) :
|
||||
$tip.detach()
|
||||
complete()
|
||||
|
||||
this.$element.trigger('hidden.bs.' + this.type)
|
||||
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
// -------------------------
|
||||
|
||||
.alert {
|
||||
padding: 10px 35px 10px 15px;
|
||||
padding: 15px 35px 15px 15px;
|
||||
margin-bottom: @line-height-computed;
|
||||
color: @alert-text;
|
||||
background-color: @alert-bg;
|
||||
@ -26,7 +26,7 @@
|
||||
}
|
||||
// Provide class for links that match alerts
|
||||
.alert-link {
|
||||
font-weight: 500;
|
||||
font-weight: bold;
|
||||
color: darken(@alert-text, 10%);
|
||||
}
|
||||
|
||||
@ -37,33 +37,26 @@
|
||||
right: -21px;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
// Improve alignment and spacing of inner content
|
||||
> p,
|
||||
> ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
> p + p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
// Alternate styles
|
||||
// -------------------------
|
||||
|
||||
.alert-success {
|
||||
.alert-variant(@alert-success-bg, @alert-success-border, @alert-success-text);
|
||||
.alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
|
||||
}
|
||||
.alert-danger {
|
||||
.alert-variant(@alert-danger-bg, @alert-danger-border, @alert-danger-text);
|
||||
.alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
|
||||
}
|
||||
.alert-info {
|
||||
.alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text);
|
||||
}
|
||||
|
||||
// Block alerts
|
||||
// -------------------------
|
||||
|
||||
.alert-block {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
|
||||
> p,
|
||||
> ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
p + p {
|
||||
margin-top: 5px;
|
||||
}
|
||||
.alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
|
||||
}
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
font-weight: bold;
|
||||
color: @badge-color;
|
||||
line-height: 1;
|
||||
vertical-align: middle;
|
||||
vertical-align: baseline;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
background-color: @badge-bg;
|
||||
|
||||
@ -54,26 +54,26 @@
|
||||
// --------------------------------------------------
|
||||
|
||||
.btn-default {
|
||||
.btn-pseudo-states(@btn-default-color, @btn-default-bg, @btn-default-border);
|
||||
.btn-pseudo-states(@btn-default-color; @btn-default-bg; @btn-default-border);
|
||||
}
|
||||
.btn-primary {
|
||||
.btn-pseudo-states(@btn-primary-color, @btn-primary-bg, @btn-primary-border);
|
||||
.btn-pseudo-states(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
|
||||
}
|
||||
// Warning appears as orange
|
||||
.btn-warning {
|
||||
.btn-pseudo-states(@btn-warning-color, @btn-warning-bg, @btn-warning-border);
|
||||
.btn-pseudo-states(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
|
||||
}
|
||||
// Danger and error appear as red
|
||||
.btn-danger {
|
||||
.btn-pseudo-states(@btn-danger-color, @btn-danger-bg, @btn-danger-border);
|
||||
.btn-pseudo-states(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
|
||||
}
|
||||
// Success appears as green
|
||||
.btn-success {
|
||||
.btn-pseudo-states(@btn-success-color, @btn-success-bg, @btn-success-border);
|
||||
.btn-pseudo-states(@btn-success-color; @btn-success-bg; @btn-success-border);
|
||||
}
|
||||
// Info appears as blue-green
|
||||
.btn-info {
|
||||
.btn-pseudo-states(@btn-info-color, @btn-info-bg, @btn-info-border);
|
||||
.btn-pseudo-states(@btn-info-color; @btn-info-bg; @btn-info-border);
|
||||
}
|
||||
|
||||
|
||||
@ -123,6 +123,7 @@
|
||||
.btn-large {
|
||||
padding: @padding-large-vertical @padding-large-horizontal;
|
||||
font-size: @font-size-large;
|
||||
line-height: 1.33; // ensure even-numbered height of button next to large input
|
||||
border-radius: @border-radius-large;
|
||||
}
|
||||
.btn-small,
|
||||
|
||||
@ -17,6 +17,12 @@
|
||||
content: "";
|
||||
}
|
||||
|
||||
// The dropdown wrapper (div)
|
||||
// --------------------------
|
||||
.dropdown {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// The dropdown menu (ul)
|
||||
// ----------------------
|
||||
.dropdown-menu {
|
||||
|
||||
@ -77,7 +77,7 @@ input[type="checkbox"]:focus {
|
||||
// See https://github.com/twbs/bootstrap/issues/8350 for more.
|
||||
input[type="number"] {
|
||||
&::-webkit-outer-spin-button,
|
||||
&::-webkit-inner-spin-button {
|
||||
&::-webkit-inner-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
@ -222,12 +222,14 @@ input[type="number"] {
|
||||
height: @input-height-large;
|
||||
padding: @padding-large-vertical @padding-large-horizontal;
|
||||
font-size: @font-size-large;
|
||||
line-height: @line-height-large;
|
||||
border-radius: @border-radius-large;
|
||||
}
|
||||
.input-small {
|
||||
height: @input-height-small;
|
||||
padding: @padding-small-vertical @padding-small-horizontal;
|
||||
font-size: @font-size-small;
|
||||
line-height: @line-height-small;
|
||||
border-radius: @border-radius-small;
|
||||
}
|
||||
|
||||
@ -255,15 +257,15 @@ textarea {
|
||||
|
||||
// Warning
|
||||
.has-warning {
|
||||
.form-control-validation(@state-warning-text, @state-warning-text, @state-warning-bg);
|
||||
.form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg);
|
||||
}
|
||||
// Error
|
||||
.has-error {
|
||||
.form-control-validation(@state-danger-text, @state-danger-text, @state-danger-bg);
|
||||
.form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg);
|
||||
}
|
||||
// Success
|
||||
.has-success {
|
||||
.form-control-validation(@state-success-text, @state-success-text, @state-success-bg);
|
||||
.form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
|
||||
}
|
||||
|
||||
|
||||
@ -278,3 +280,47 @@ textarea {
|
||||
margin-bottom: 10px;
|
||||
color: lighten(@text-color, 25%); // lighten the text some for contrast
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Inline forms
|
||||
//
|
||||
// Make forms appear inline(-block).
|
||||
|
||||
.form-inline {
|
||||
.form-control,
|
||||
.radio,
|
||||
.checkbox {
|
||||
display: inline-block;
|
||||
}
|
||||
.radio,
|
||||
.checkbox {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Horizontal forms
|
||||
//
|
||||
// Horizontal forms are built on grid classes and allow you to create forms with
|
||||
// labels on the left and inputs on the right.
|
||||
|
||||
.form-horizontal .control-label,
|
||||
.form-horizontal .radio-inline,
|
||||
.form-horizontal .checkbox-inline {
|
||||
padding-top: 9px;
|
||||
}
|
||||
|
||||
.form-horizontal {
|
||||
.form-group {
|
||||
.make-row();
|
||||
}
|
||||
}
|
||||
|
||||
// Only right align form labels here when the columns stop stacking
|
||||
@media (min-width: @screen-tablet) {
|
||||
.form-horizontal .control-label {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
104
less/grid.less
104
less/grid.less
@ -125,29 +125,42 @@
|
||||
.col-sm-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-push-1 { left: percentage((1 / @grid-columns)); }
|
||||
.col-push-2 { left: percentage((2 / @grid-columns)); }
|
||||
.col-push-3 { left: percentage((3 / @grid-columns)); }
|
||||
.col-push-4 { left: percentage((4 / @grid-columns)); }
|
||||
.col-push-5 { left: percentage((5 / @grid-columns)); }
|
||||
.col-push-6 { left: percentage((6 / @grid-columns)); }
|
||||
.col-push-7 { left: percentage((7 / @grid-columns)); }
|
||||
.col-push-8 { left: percentage((8 / @grid-columns)); }
|
||||
.col-push-9 { left: percentage((9 / @grid-columns)); }
|
||||
.col-push-10 { left: percentage((10/ @grid-columns)); }
|
||||
.col-push-11 { left: percentage((11/ @grid-columns)); }
|
||||
.col-sm-push-1 { left: percentage((1 / @grid-columns)); }
|
||||
.col-sm-push-2 { left: percentage((2 / @grid-columns)); }
|
||||
.col-sm-push-3 { left: percentage((3 / @grid-columns)); }
|
||||
.col-sm-push-4 { left: percentage((4 / @grid-columns)); }
|
||||
.col-sm-push-5 { left: percentage((5 / @grid-columns)); }
|
||||
.col-sm-push-6 { left: percentage((6 / @grid-columns)); }
|
||||
.col-sm-push-7 { left: percentage((7 / @grid-columns)); }
|
||||
.col-sm-push-8 { left: percentage((8 / @grid-columns)); }
|
||||
.col-sm-push-9 { left: percentage((9 / @grid-columns)); }
|
||||
.col-sm-push-10 { left: percentage((10/ @grid-columns)); }
|
||||
.col-sm-push-11 { left: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-pull-1 { right: percentage((1 / @grid-columns)); }
|
||||
.col-pull-2 { right: percentage((2 / @grid-columns)); }
|
||||
.col-pull-3 { right: percentage((3 / @grid-columns)); }
|
||||
.col-pull-4 { right: percentage((4 / @grid-columns)); }
|
||||
.col-pull-5 { right: percentage((5 / @grid-columns)); }
|
||||
.col-pull-6 { right: percentage((6 / @grid-columns)); }
|
||||
.col-pull-7 { right: percentage((7 / @grid-columns)); }
|
||||
.col-pull-8 { right: percentage((8 / @grid-columns)); }
|
||||
.col-pull-9 { right: percentage((9 / @grid-columns)); }
|
||||
.col-pull-10 { right: percentage((10/ @grid-columns)); }
|
||||
.col-pull-11 { right: percentage((11/ @grid-columns)); }
|
||||
.col-sm-pull-1 { right: percentage((1 / @grid-columns)); }
|
||||
.col-sm-pull-2 { right: percentage((2 / @grid-columns)); }
|
||||
.col-sm-pull-3 { right: percentage((3 / @grid-columns)); }
|
||||
.col-sm-pull-4 { right: percentage((4 / @grid-columns)); }
|
||||
.col-sm-pull-5 { right: percentage((5 / @grid-columns)); }
|
||||
.col-sm-pull-6 { right: percentage((6 / @grid-columns)); }
|
||||
.col-sm-pull-7 { right: percentage((7 / @grid-columns)); }
|
||||
.col-sm-pull-8 { right: percentage((8 / @grid-columns)); }
|
||||
.col-sm-pull-9 { right: percentage((9 / @grid-columns)); }
|
||||
.col-sm-pull-10 { right: percentage((10/ @grid-columns)); }
|
||||
.col-sm-pull-11 { right: percentage((11/ @grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-sm-offset-1 { margin-left: percentage((1 / @grid-columns)); }
|
||||
.col-sm-offset-2 { margin-left: percentage((2 / @grid-columns)); }
|
||||
.col-sm-offset-3 { margin-left: percentage((3 / @grid-columns)); }
|
||||
.col-sm-offset-4 { margin-left: percentage((4 / @grid-columns)); }
|
||||
.col-sm-offset-5 { margin-left: percentage((5 / @grid-columns)); }
|
||||
.col-sm-offset-6 { margin-left: percentage((6 / @grid-columns)); }
|
||||
.col-sm-offset-7 { margin-left: percentage((7 / @grid-columns)); }
|
||||
.col-sm-offset-8 { margin-left: percentage((8 / @grid-columns)); }
|
||||
.col-sm-offset-9 { margin-left: percentage((9 / @grid-columns)); }
|
||||
.col-sm-offset-10 { margin-left: percentage((10/ @grid-columns)); }
|
||||
.col-sm-offset-11 { margin-left: percentage((11/ @grid-columns)); }
|
||||
}
|
||||
|
||||
// Medium and large device columns (desktop and up)
|
||||
@ -182,18 +195,43 @@
|
||||
.col-lg-11 { width: percentage((11/ @grid-columns)); }
|
||||
.col-lg-12 { width: 100%; }
|
||||
|
||||
// Push and pull columns for source order changes
|
||||
.col-lg-push-1 { left: percentage((1 / @grid-columns)); }
|
||||
.col-lg-push-2 { left: percentage((2 / @grid-columns)); }
|
||||
.col-lg-push-3 { left: percentage((3 / @grid-columns)); }
|
||||
.col-lg-push-4 { left: percentage((4 / @grid-columns)); }
|
||||
.col-lg-push-5 { left: percentage((5 / @grid-columns)); }
|
||||
.col-lg-push-6 { left: percentage((6 / @grid-columns)); }
|
||||
.col-lg-push-7 { left: percentage((7 / @grid-columns)); }
|
||||
.col-lg-push-8 { left: percentage((8 / @grid-columns)); }
|
||||
.col-lg-push-9 { left: percentage((9 / @grid-columns)); }
|
||||
.col-lg-push-10 { left: percentage((10/ @grid-columns)); }
|
||||
.col-lg-push-11 { left: percentage((11/ @grid-columns)); }
|
||||
|
||||
.col-lg-pull-1 { right: percentage((1 / @grid-columns)); }
|
||||
.col-lg-pull-2 { right: percentage((2 / @grid-columns)); }
|
||||
.col-lg-pull-3 { right: percentage((3 / @grid-columns)); }
|
||||
.col-lg-pull-4 { right: percentage((4 / @grid-columns)); }
|
||||
.col-lg-pull-5 { right: percentage((5 / @grid-columns)); }
|
||||
.col-lg-pull-6 { right: percentage((6 / @grid-columns)); }
|
||||
.col-lg-pull-7 { right: percentage((7 / @grid-columns)); }
|
||||
.col-lg-pull-8 { right: percentage((8 / @grid-columns)); }
|
||||
.col-lg-pull-9 { right: percentage((9 / @grid-columns)); }
|
||||
.col-lg-pull-10 { right: percentage((10/ @grid-columns)); }
|
||||
.col-lg-pull-11 { right: percentage((11/ @grid-columns)); }
|
||||
|
||||
// Offsets
|
||||
.col-offset-1 { margin-left: percentage((1 / @grid-columns)); }
|
||||
.col-offset-2 { margin-left: percentage((2 / @grid-columns)); }
|
||||
.col-offset-3 { margin-left: percentage((3 / @grid-columns)); }
|
||||
.col-offset-4 { margin-left: percentage((4 / @grid-columns)); }
|
||||
.col-offset-5 { margin-left: percentage((5 / @grid-columns)); }
|
||||
.col-offset-6 { margin-left: percentage((6 / @grid-columns)); }
|
||||
.col-offset-7 { margin-left: percentage((7 / @grid-columns)); }
|
||||
.col-offset-8 { margin-left: percentage((8 / @grid-columns)); }
|
||||
.col-offset-9 { margin-left: percentage((9 / @grid-columns)); }
|
||||
.col-offset-10 { margin-left: percentage((10/ @grid-columns)); }
|
||||
.col-offset-11 { margin-left: percentage((11/ @grid-columns)); }
|
||||
.col-lg-offset-1 { margin-left: percentage((1 / @grid-columns)); }
|
||||
.col-lg-offset-2 { margin-left: percentage((2 / @grid-columns)); }
|
||||
.col-lg-offset-3 { margin-left: percentage((3 / @grid-columns)); }
|
||||
.col-lg-offset-4 { margin-left: percentage((4 / @grid-columns)); }
|
||||
.col-lg-offset-5 { margin-left: percentage((5 / @grid-columns)); }
|
||||
.col-lg-offset-6 { margin-left: percentage((6 / @grid-columns)); }
|
||||
.col-lg-offset-7 { margin-left: percentage((7 / @grid-columns)); }
|
||||
.col-lg-offset-8 { margin-left: percentage((8 / @grid-columns)); }
|
||||
.col-lg-offset-9 { margin-left: percentage((9 / @grid-columns)); }
|
||||
.col-lg-offset-10 { margin-left: percentage((10/ @grid-columns)); }
|
||||
.col-lg-offset-11 { margin-left: percentage((11/ @grid-columns)); }
|
||||
}
|
||||
|
||||
// Large desktops and up
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
// Base styles
|
||||
// -------------------------
|
||||
.input-group {
|
||||
position: relative; // For dropdowns
|
||||
display: table;
|
||||
border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table
|
||||
|
||||
@ -112,42 +113,3 @@
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Inline forms
|
||||
// --------------------------------------------------
|
||||
|
||||
.form-inline {
|
||||
.form-control,
|
||||
.radio,
|
||||
.checkbox {
|
||||
display: inline-block;
|
||||
}
|
||||
.radio,
|
||||
.checkbox {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Horizontal forms
|
||||
// --------------------------------------------------
|
||||
// Horizontal forms are built on grid classes.
|
||||
|
||||
.form-horizontal .control-label {
|
||||
padding-top: 9px;
|
||||
}
|
||||
|
||||
.form-horizontal {
|
||||
.form-group {
|
||||
.make-row();
|
||||
}
|
||||
}
|
||||
|
||||
// Only right align form labels here when the columns stop stacking
|
||||
@media (min-width: @screen-tablet) {
|
||||
.form-horizontal .control-label {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
color: @label-color;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
vertical-align: baseline;
|
||||
background-color: @gray-light;
|
||||
border-radius: .25em;
|
||||
|
||||
|
||||
@ -44,12 +44,12 @@
|
||||
}
|
||||
|
||||
// Sizing shortcuts
|
||||
.size(@width, @height) {
|
||||
.size(@width; @height) {
|
||||
width: @width;
|
||||
height: @height;
|
||||
}
|
||||
.square(@size) {
|
||||
.size(@size, @size);
|
||||
.size(@size; @size);
|
||||
}
|
||||
|
||||
// Placeholder text
|
||||
@ -138,17 +138,17 @@
|
||||
-ms-transform: scale(@ratio);
|
||||
transform: scale(@ratio);
|
||||
}
|
||||
.translate(@x, @y) {
|
||||
.translate(@x; @y) {
|
||||
-webkit-transform: translate(@x, @y);
|
||||
-ms-transform: translate(@x, @y);
|
||||
transform: translate(@x, @y);
|
||||
}
|
||||
.skew(@x, @y) {
|
||||
.skew(@x; @y) {
|
||||
-webkit-transform: skew(@x, @y);
|
||||
-ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885
|
||||
transform: skew(@x, @y);
|
||||
}
|
||||
.translate3d(@x, @y, @z) {
|
||||
.translate3d(@x; @y; @z) {
|
||||
-webkit-transform: translate3d(@x, @y, @z);
|
||||
transform: translate3d(@x, @y, @z);
|
||||
}
|
||||
@ -158,9 +158,9 @@
|
||||
// Default value is `visible`, but can be changed to `hidden`
|
||||
// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
|
||||
.backface-visibility(@visibility){
|
||||
-webkit-backface-visibility: @visibility;
|
||||
-moz-backface-visibility: @visibility;
|
||||
backface-visibility: @visibility;
|
||||
-webkit-backface-visibility: @visibility;
|
||||
-moz-backface-visibility: @visibility;
|
||||
backface-visibility: @visibility;
|
||||
}
|
||||
|
||||
// Background clipping
|
||||
@ -197,7 +197,7 @@
|
||||
}
|
||||
|
||||
// CSS3 Content Columns
|
||||
.content-columns(@column-count, @column-gap: @grid-gutter-width) {
|
||||
.content-columns(@column-count; @column-gap: @grid-gutter-width) {
|
||||
-webkit-column-count: @column-count;
|
||||
-moz-column-count: @column-count;
|
||||
column-count: @column-count;
|
||||
@ -259,14 +259,14 @@
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down
|
||||
}
|
||||
|
||||
.directional(@start-color: #555, @end-color: #333, @deg: 45deg) {
|
||||
.directional(@start-color: #555; @end-color: #333; @deg: 45deg) {
|
||||
background-color: @end-color;
|
||||
background-repeat: repeat-x;
|
||||
background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1+, Chrome 10+
|
||||
background-image: -moz-linear-gradient(@deg, @start-color, @end-color); // FF 3.6+
|
||||
background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10
|
||||
}
|
||||
.horizontal-three-colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) {
|
||||
.horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
|
||||
background-color: mix(@mid-color, @end-color, 80%);
|
||||
background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
|
||||
background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
|
||||
@ -276,7 +276,7 @@
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
|
||||
}
|
||||
|
||||
.vertical-three-colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) {
|
||||
.vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
|
||||
background-color: mix(@mid-color, @end-color, 80%);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
|
||||
background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
|
||||
@ -285,7 +285,7 @@
|
||||
background-repeat: no-repeat;
|
||||
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
|
||||
}
|
||||
.radial(@inner-color: #555, @outer-color: #333) {
|
||||
.radial(@inner-color: #555; @outer-color: #333) {
|
||||
background-color: @outer-color;
|
||||
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color));
|
||||
background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
|
||||
@ -293,7 +293,7 @@
|
||||
background-image: radial-gradient(circle, @inner-color, @outer-color);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.striped(@color: #555, @angle: 45deg) {
|
||||
.striped(@color: #555; @angle: 45deg) {
|
||||
background-color: @color;
|
||||
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
|
||||
background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
|
||||
@ -316,7 +316,7 @@
|
||||
// --------------------------------------------------
|
||||
|
||||
// Short retina mixin for setting background-image and -size
|
||||
.img-retina(@file-1x, @file-2x, @width-1x, @height-1x) {
|
||||
.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
|
||||
background-image: url("@{file-1x}");
|
||||
|
||||
@media
|
||||
@ -347,7 +347,7 @@
|
||||
|
||||
// Alerts
|
||||
// -------------------------
|
||||
.alert-variant(@background, @border, @text-color) {
|
||||
.alert-variant(@background; @border; @text-color) {
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
color: @text-color;
|
||||
@ -363,7 +363,7 @@
|
||||
// -------------------------
|
||||
// Easily pump out default styles, as well as :hover, :focus, :active,
|
||||
// and disabled options for all buttons
|
||||
.btn-pseudo-states(@color, @background, @border) {
|
||||
.btn-pseudo-states(@color; @background; @border) {
|
||||
color: @color;
|
||||
background-color: @background;
|
||||
border-color: @border;
|
||||
@ -405,7 +405,7 @@
|
||||
// Navbar vertical align
|
||||
// -------------------------
|
||||
// Vertically center elements in the navbar.
|
||||
// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
|
||||
// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
|
||||
.navbar-vertical-align(@element-height) {
|
||||
margin-top: ((@navbar-height - @element-height) / 2);
|
||||
margin-bottom: ((@navbar-height - @element-height) / 2);
|
||||
@ -520,7 +520,7 @@
|
||||
// Used in forms.less to generate the form validation CSS for warnings, errors,
|
||||
// and successes.
|
||||
|
||||
.form-control-validation(@text-color: #555, @border-color: #ccc, @background-color: #f5f5f5) {
|
||||
.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {
|
||||
// Color the label and help text
|
||||
.help-block,
|
||||
.control-label {
|
||||
|
||||
@ -354,6 +354,8 @@
|
||||
// Add a class to make any element properly align itself vertically within the navbars.
|
||||
|
||||
.navbar-text {
|
||||
float: left;
|
||||
padding: 0 @navbar-padding-horizontal;
|
||||
.navbar-vertical-align(@line-height-computed);
|
||||
}
|
||||
|
||||
|
||||
@ -69,10 +69,6 @@
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Nav variations
|
||||
// --------------------------------------------------
|
||||
|
||||
// Tabs
|
||||
// -------------------------
|
||||
|
||||
@ -154,6 +150,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Nav variations
|
||||
// --------------------------------------------------
|
||||
|
||||
// Justified nav links
|
||||
// -------------------------
|
||||
|
||||
@ -181,11 +181,9 @@
|
||||
> .active > a {
|
||||
border-bottom-color: @nav-tabs-justified-active-link-border-color;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Tabbable tabs
|
||||
// -------------------------
|
||||
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
padding-left: 0;
|
||||
margin: @line-height-computed 0;
|
||||
border-radius: @border-radius-base;
|
||||
|
||||
|
||||
> li {
|
||||
display: inline; // Remove list-style and block-level defaults
|
||||
> a,
|
||||
@ -33,7 +33,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
> li > a:hover,
|
||||
> li > a:focus,
|
||||
> .active > a,
|
||||
@ -45,7 +45,7 @@
|
||||
color: @pagination-active-color;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
|
||||
> .disabled {
|
||||
> span,
|
||||
> a,
|
||||
|
||||
@ -11,6 +11,24 @@
|
||||
border: 1px solid @panel-border;
|
||||
border-radius: @panel-border-radius;
|
||||
.box-shadow(0 1px 1px rgba(0,0,0,.05));
|
||||
|
||||
// List groups in panels
|
||||
.list-group {
|
||||
margin: 15px -15px -15px;
|
||||
|
||||
.list-group-item {
|
||||
border-width: 1px 0;
|
||||
|
||||
// Remove border radius for top one
|
||||
&:first-child {
|
||||
.border-top-radius(0);
|
||||
}
|
||||
// But keep it for the last one
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Optional heading
|
||||
@ -82,21 +100,3 @@
|
||||
border-color: @panel-info-border;
|
||||
}
|
||||
}
|
||||
|
||||
// List groups in panels
|
||||
.list-group-flush {
|
||||
margin: 15px -15px -15px;
|
||||
|
||||
.list-group-item {
|
||||
border-width: 1px 0;
|
||||
|
||||
// Remove border radius for top one
|
||||
&:first-child {
|
||||
.border-top-radius(0);
|
||||
}
|
||||
// But keep it for the last one
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -60,15 +60,18 @@
|
||||
// -------------------------
|
||||
// Based on 14px font-size and 1.428 line-height (~20px to start)
|
||||
|
||||
@padding-base-vertical: 8px;
|
||||
@padding-base-vertical: 6px;
|
||||
@padding-base-horizontal: 12px;
|
||||
|
||||
@padding-large-vertical: 14px;
|
||||
@padding-large-vertical: 10px;
|
||||
@padding-large-horizontal: 16px;
|
||||
|
||||
@padding-small-vertical: 5px;
|
||||
@padding-small-horizontal: 10px;
|
||||
|
||||
@line-height-large: 1.33;
|
||||
@line-height-small: 1.5;
|
||||
|
||||
@border-radius-base: 4px;
|
||||
@border-radius-large: 6px;
|
||||
@border-radius-small: 3px;
|
||||
@ -132,8 +135,8 @@
|
||||
@input-color-placeholder: @gray-light;
|
||||
|
||||
@input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2);
|
||||
@input-height-large: (ceil(@font-size-large * @line-height-base) + (@padding-large-vertical * 2) + 2);
|
||||
@input-height-small: (ceil(@font-size-small * @line-height-base) + (@padding-small-vertical * 2) + 2);
|
||||
@input-height-large: (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
|
||||
@input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
|
||||
|
||||
@legend-border-color: #e5e5e5;
|
||||
|
||||
@ -174,6 +177,39 @@
|
||||
@zindex-modal-background: 1040;
|
||||
@zindex-modal: 1050;
|
||||
|
||||
// Media queries breakpoints
|
||||
// --------------------------------------------------
|
||||
|
||||
// Tiny screen / phone
|
||||
@screen-tiny: 480px;
|
||||
@screen-phone: @screen-tiny;
|
||||
|
||||
// Small screen / tablet
|
||||
@screen-small: 768px;
|
||||
@screen-tablet: @screen-small;
|
||||
|
||||
// Medium screen / desktop
|
||||
@screen-medium: 992px;
|
||||
@screen-desktop: @screen-medium;
|
||||
|
||||
// So media queries don't overlap when required, provide a maximum
|
||||
@screen-small-max: (@screen-medium - 1);
|
||||
@screen-tablet-max: @screen-small-max;
|
||||
|
||||
// Large screen / wide desktop
|
||||
@screen-large: 1200px;
|
||||
@screen-large-desktop: @screen-large;
|
||||
|
||||
// Grid system
|
||||
// --------------------------------------------------
|
||||
|
||||
// Number of columns in the grid system
|
||||
@grid-columns: 12;
|
||||
// Padding, to be divided by two and applied to the left and right of all columns
|
||||
@grid-gutter-width: 30px;
|
||||
// Point at which the navbar stops collapsing
|
||||
@grid-float-breakpoint: @screen-tablet;
|
||||
|
||||
|
||||
// Navbar
|
||||
// -------------------------
|
||||
@ -520,30 +556,6 @@
|
||||
@component-offset-horizontal: 180px;
|
||||
|
||||
|
||||
// Media queries breakpoints
|
||||
// --------------------------------------------------
|
||||
|
||||
// Tiny screen / phone
|
||||
@screen-tiny: 480px;
|
||||
@screen-phone: @screen-tiny;
|
||||
|
||||
// Small screen / tablet
|
||||
@screen-small: 768px;
|
||||
@screen-tablet: @screen-small;
|
||||
|
||||
// Medium screen / desktop
|
||||
@screen-medium: 992px;
|
||||
@screen-desktop: @screen-medium;
|
||||
|
||||
// So media queries don't overlap when required, provide a maximum
|
||||
@screen-small-max: (@screen-medium - 1);
|
||||
@screen-tablet-max: @screen-small-max;
|
||||
|
||||
// Large screen / wide desktop
|
||||
@screen-large: 1200px;
|
||||
@screen-large-desktop: @screen-large;
|
||||
|
||||
|
||||
// Container sizes
|
||||
// --------------------------------------------------
|
||||
|
||||
@ -555,14 +567,3 @@
|
||||
|
||||
// Large screen / wide desktop
|
||||
@container-large-desktop: 1170px;
|
||||
|
||||
|
||||
// Grid system
|
||||
// --------------------------------------------------
|
||||
|
||||
// Number of columns in the grid system
|
||||
@grid-columns: 12;
|
||||
// Padding, to be divided by two and applied to the left and right of all columns
|
||||
@grid-gutter-width: 30px;
|
||||
// Point at which the navbar stops collapsing
|
||||
@grid-float-breakpoint: @screen-tablet;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user