bs sync - primarily $line-height went back to $line-height-base

This commit is contained in:
Kevin Ross 2016-02-05 10:41:42 -06:00
parent 82f45db96e
commit c4636027b9
12 changed files with 73 additions and 11 deletions

View File

@ -22,7 +22,6 @@
> th,
> td {
padding: $table-cell-padding;
line-height: $line-height;
vertical-align: top;
border: 1px solid $table-border-color;

View File

@ -60,6 +60,19 @@ Use the `.alert-link` utility class to quickly provide matching colored links wi
</div>
{% endexample %}
### Additional content
Alerts can also contain additional HTML elements like headings and paragraphs.
{% example html %}
<div class="alert alert-success" role="alert">
<h4 class="alert-heading">Well done!</h4>
<p>Aww yeah, you successfully read this important alert message. This example text is going to run a bit longer so that you can see how spacing within an alert works with this kind of content.</p>
<p class="m-b-0">Whenever you need to, be sure to use a margin utilities to keep things nice and tidy.</p>
</div>
{% endexample %}
### Dismissing
Using the alert JavaScript plugin, it's possible to dismiss any alert inline. Here's how:

View File

@ -222,6 +222,56 @@ Add an optional header and/or footer within a card.
</div>
{% endexample %}
## Header nav
Use Bootstrap's nav pills or tabs within a card header. Be sure to always include a `.pull-*-*` utility class for proper alignment.
{% example html %}
<div class="card text-xs-center">
<div class="card-header">
<ul class="nav nav-tabs card-header-tabs pull-xs-left">
<li class="nav-item">
<a class="nav-link active" href="#">Active</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
</div>
<div class="card-block">
<h4 class="card-title">Special title treatment</h4>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
{% endexample %}
{% example html %}
<div class="card text-xs-center">
<div class="card-header">
<ul class="nav nav-pills card-header-pills pull-xs-left">
<li class="nav-item">
<a class="nav-link active" href="#">Active</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
</div>
<div class="card-block">
<h4 class="card-title">Special title treatment</h4>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-primary">Go somewhere</a>
</div>
</div>
{% endexample %}
## Image caps
Similar to headers and footers, cards include top and bottom image caps.

View File

@ -206,7 +206,7 @@ As a heads up, we include this in all of Bootstrap's documentation and examples
### Overflow and scrolling
Support for `overflow: hidden;` on the `<body>` element is quite limited in iOS and Android. To that end, when you scroll past the top or bottom of a modal in either of those devices' browsers, the `<body>` content will begin to scroll.
Support for `overflow: hidden;` on the `<body>` element is quite limited in iOS and Android. To that end, when you scroll past the top or bottom of a modal in either of those devices' browsers, the `<body>` content will begin to scroll. See [WebKit bug #153852](https://bugs.webkit.org/show_bug.cgi?id=153852).
### Virtual keyboards

View File

@ -1,6 +1,6 @@
form {
// ensure enough room at the bottom of any form to display a one-line mdb-help
margin-bottom: ($mdb-help-size-ratio * $font-size-base) * $line-height;
margin-bottom: ($mdb-help-size-ratio * $font-size-base) * $line-height-base;
// reverse the above for navbars (no help expected in a navbar form)
.navbar & {

View File

@ -6,7 +6,7 @@ label.radio-inline {
.mdb-radio-outer-circle, // don't use generic span, it may conflict with span in user markup #693
.mdb-radio-inner-circle {
position: absolute;
top: calc-top($line-height, $font-size-base, $mdb-radio-size); // vertical center of line-height
top: calc-top($line-height-base, $font-size-base, $mdb-radio-size); // vertical center of line-height
left: 0;
display: inline-block;
width: $mdb-radio-size;

View File

@ -6,7 +6,7 @@
.mdb-switch-track {
position: absolute;
top: calc-top($line-height, $font-size-base, $mdb-switch-height);
top: calc-top($line-height-base, $font-size-base, $mdb-switch-height);
left: 0;
display: inline-block;
width: $mdb-switch-width;

View File

@ -195,7 +195,7 @@
.checkbox label,
label.checkbox-inline,
.switch label {
line-height: $line-height; // keep the same line height for radios and checkboxes
line-height: $line-height-base; // keep the same line height for radios and checkboxes
}
// Note: this may be inside or outside a form-group, may be .mdb-form-group.mdb-form-group-sm or .mdb-form-group.mdb-form-group-lg

View File

@ -1,5 +1,5 @@
@function calc-top($line-height, $font-size, $component-height) {
@return (($line-height * $font-size) - $component-height) / 2; // vertical center of line-height
@function calc-top($line-height-base, $font-size, $component-height) {
@return (($line-height-base * $font-size) - $component-height) / 2; // vertical center of line-height
}

View File

@ -29,7 +29,7 @@ $input-padding-y-sm: .25rem !default; // spec 4px //.275rem !default
$input-padding-x-lg: 0 !default; // 1.25rem !default;
$input-padding-y-lg: .5625rem !default; // no-spec 9px // .75rem !default;
//$input-height: (($font-size-base * $line-height) + ($input-padding-y * 2)) !default;
//$input-height: (($font-size-base * $line-height-base) + ($input-padding-y * 2)) !default;
//$input-height-lg: (($font-size-lg * $line-height-lg) + ($input-padding-y-lg * 2)) !default;
//$input-height-sm: (($font-size-sm * $line-height-sm) + ($input-padding-y-sm * 2)) !default;
//

View File

@ -5,7 +5,7 @@ $modal-content-xs-box-shadow: $mdb-shadow-24dp !default;
//$modal-inner-padding: 15px !default;
//
//$modal-title-padding: 15px !default;
//$modal-title-line-height: $line-height !default;
//$modal-title-line-height: $line-height-base !default;
//
//$modal-content-bg: #fff !default;
//$modal-content-border-color: rgba(0,0,0,.2) !default;

View File

@ -35,7 +35,7 @@ $display4-size: 2.125rem !default; // md display-1 34px was 3.5rem
//$display3-weight: 300 !default;
//$display4-weight: 300 !default;
//
//$line-height: 1.5 !default;
//$line-height-base: 1.5 !default;
//
//$headings-margin-bottom: ($spacer / 2) !default;
//$headings-font-family: inherit !default;