kotovalexarian-likes-github
/
twbs--bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Releases Activity

simpler type, docs callout for reproducing the v3 style headings and small text

This commit is contained in:
Mark Otto 2015-08-12 20:45:21 -07:00
parent 314161cb17
commit b1a74195c8
10 changed files with 20 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
dist/css/bootstrap.css
View File

@ -481,61 +481,18 @@ h1, h2, h3, h4, h5, h6,
color: inherit;
}
h1 small,
h1 .small, h2 small,
h2 .small, h3 small,
h3 .small, h4 small,
h4 .small, h5 small,
h5 .small, h6 small,
h6 .small,
.h1 small,
.h1 .small, .h2 small,
.h2 .small, .h3 small,
.h3 .small, .h4 small,
.h4 .small, .h5 small,
.h5 .small, .h6 small,
.h6 .small {
font-weight: normal;
line-height: 1;
color: #818a91;
}
h1, .h1,
h2, .h2,
h3, .h3 {
margin-bottom: .5rem;
}
h1 small,
h1 .small, .h1 small,
.h1 .small,
h2 small,
h2 .small, .h2 small,
.h2 .small,
h3 small,
h3 .small, .h3 small,
.h3 .small {
font-size: 65%;
}
h4, .h4,
h5, .h5,
h6, .h6 {
margin-bottom: .5rem;
}
h4 small,
h4 .small, .h4 small,
.h4 .small,
h5 small,
h5 .small, .h5 small,
.h5 .small,
h6 small,
h6 .small, .h6 small,
.h6 .small {
font-size: 75%;
}
h1, .h1 {
font-size: 2.75rem;
}
@ -594,7 +551,8 @@ hr {
small,
.small {
font-size: 85%;
font-size: 80%;
font-weight: normal;
}
mark,

2
dist/css/bootstrap.css.map vendored
View File

File diff suppressed because one or more lines are too long

2
dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
dist/css/bootstrap.min.css.map vendored
View File

File diff suppressed because one or more lines are too long

42
docs/content/typography.md
View File

@ -66,41 +66,16 @@ All HTML headings, `<h1>` through `<h6>`, are available. `.h1` through `.h6` cla
<h6>h6. Bootstrap heading</h6>
{% endhighlight %}
Create lighter, secondary text in any heading with a generic `<small>` tag or the `.small` class.
### Customizing headings
<div class="bd-example bd-example-type">
<table class="table">
<tbody>
<tr>
<td><h1>h1. Bootstrap heading <small>Secondary text</small></h1></td>
</tr>
<tr>
<td><h2>h2. Bootstrap heading <small>Secondary text</small></h2></td>
</tr>
<tr>
<td><h3>h3. Bootstrap heading <small>Secondary text</small></h3></td>
</tr>
<tr>
<td><h4>h4. Bootstrap heading <small>Secondary text</small></h4></td>
</tr>
<tr>
<td><h5>h5. Bootstrap heading <small>Secondary text</small></h5></td>
</tr>
<tr>
<td><h6>h6. Bootstrap heading <small>Secondary text</small></h6></td>
</tr>
</tbody>
</table>
</div>
Use the included utility classes to recreate the small secondary heading text from Bootstrap 3.
{% highlight html %}
<h1>h1. Bootstrap heading <small>Secondary text</small></h1>
<h2>h2. Bootstrap heading <small>Secondary text</small></h2>
<h3>h3. Bootstrap heading <small>Secondary text</small></h3>
<h4>h4. Bootstrap heading <small>Secondary text</small></h4>
<h5>h5. Bootstrap heading <small>Secondary text</small></h5>
<h6>h6. Bootstrap heading <small>Secondary text</small></h6>
{% endhighlight %}
{% example html %}
<h3>
Fancy display heading
<small class="text-muted">With faded secondary text</small>
</h3>
{% endexample %}
## Display headings
@ -125,7 +100,6 @@ Traditional heading elements are designed to work best in the meat of your page
</table>
</div>
## Lead
Make a paragraph stand out by adding `.lead`.

46
docs/dist/css/bootstrap.css
View File

@ -481,61 +481,18 @@ h1, h2, h3, h4, h5, h6,
color: inherit;
}
h1 small,
h1 .small, h2 small,
h2 .small, h3 small,
h3 .small, h4 small,
h4 .small, h5 small,
h5 .small, h6 small,
h6 .small,
.h1 small,
.h1 .small, .h2 small,
.h2 .small, .h3 small,
.h3 .small, .h4 small,
.h4 .small, .h5 small,
.h5 .small, .h6 small,
.h6 .small {
font-weight: normal;
line-height: 1;
color: #818a91;
}
h1, .h1,
h2, .h2,
h3, .h3 {
margin-bottom: .5rem;
}
h1 small,
h1 .small, .h1 small,
.h1 .small,
h2 small,
h2 .small, .h2 small,
.h2 .small,
h3 small,
h3 .small, .h3 small,
.h3 .small {
font-size: 65%;
}
h4, .h4,
h5, .h5,
h6, .h6 {
margin-bottom: .5rem;
}
h4 small,
h4 .small, .h4 small,
.h4 .small,
h5 small,
h5 .small, .h5 small,
.h5 .small,
h6 small,
h6 .small, .h6 small,
.h6 .small {
font-size: 75%;
}
h1, .h1 {
font-size: 2.75rem;
}
@ -594,7 +551,8 @@ hr {
small,
.small {
font-size: 85%;
font-size: 80%;
font-weight: normal;
}
mark,

2
docs/dist/css/bootstrap.css.map vendored
View File

File diff suppressed because one or more lines are too long

2
docs/dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
docs/dist/css/bootstrap.min.css.map vendored
View File

File diff suppressed because one or more lines are too long

21
scss/_type.scss
View File

@ -13,34 +13,17 @@ h1, h2, h3, h4, h5, h6,
font-weight: $headings-font-weight;
line-height: $headings-line-height;
color: $headings-color;
small,
.small {
font-weight: normal;
line-height: 1;
color: $headings-small-color;
}
}
h1, .h1,
h2, .h2,
h3, .h3 {
margin-bottom: ($spacer / 2);
small,
.small {
font-size: 65%;
}
}
h4, .h4,
h5, .h5,
h6, .h6 {
margin-bottom: ($spacer / 2);
small,
.small {
font-size: 75%;
}
}
h1, .h1 { font-size: $font-size-h1; }
@ -90,10 +73,10 @@ hr {
// Emphasis
//
// Ex: (12px small font / 14px base font) * 100% = about 85%
small,
.small {
font-size: floor((100% * $font-size-sm / $font-size-base));
font-size: 80%;
font-weight: normal;
}
mark,