kotovalexarian-likes-github/twbs--bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00
Code Releases Activity

Examples: use our utilities more. (#29358)

Browse source
This commit is contained in:
XhmikosR 2019-09-02 19:19:25 +03:00 • committed by GitHub
parent 88d7d8b822
commit d0affaa2ec
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 12 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
site/content/docs/4.3/examples/checkout/form-validation.css
View file

@ -1,5 +1,3 @@
.container {
max-width: 960px;
}
.lh-condensed { line-height: 1.25; }

8
site/content/docs/4.3/examples/checkout/index.html
View file

@ -22,21 +22,21 @@ body_class: "bg-light"
<span class="badge bg-secondary rounded-pill">3</span>
</h4>
<ul class="list-group mb-3">
<li class="list-group-item d-flex justify-content-between lh-condensed">
<li class="list-group-item d-flex justify-content-between lh-sm">
<div>
<h6 class="my-0">Product name</h6>
<small class="text-muted">Brief description</small>
</div>
<span class="text-muted">$12</span>
</li>
<li class="list-group-item d-flex justify-content-between lh-condensed">
<li class="list-group-item d-flex justify-content-between lh-sm">
<div>
<h6 class="my-0">Second product</h6>
<small class="text-muted">Brief description</small>
</div>
<span class="text-muted">$8</span>
</li>
<li class="list-group-item d-flex justify-content-between lh-condensed">
<li class="list-group-item d-flex justify-content-between lh-sm">
<div>
<h6 class="my-0">Third item</h6>
<small class="text-muted">Brief description</small>
@ -92,7 +92,7 @@ body_class: "bg-light"
<span class="input-group-text">@</span>
</div>
<input type="text" class="form-control" id="username" placeholder="Username" required>
<div class="invalid-feedback" style="width: 100%;">
<div class="invalid-feedback w-100">
Your username is required.
</div>
</div>

1
site/content/docs/4.3/examples/floating-labels/floating-labels.css
View file

@ -36,7 +36,6 @@ body {
display: block;
width: 100%;
margin-bottom: 0; /* Override default `<label>` margin */
line-height: 1.5;
color: #495057;
pointer-events: none;
cursor: text; /* Match the input under the label */

16
site/content/docs/4.3/examples/offcanvas/index.html
View file

@ -64,8 +64,8 @@ body_class: "bg-light"
<main role="main" class="container">
<div class="d-flex align-items-center p-3 my-3 text-white-50 bg-purple rounded shadow-sm">
<img class="mr-3" src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-outline.svg" alt="" width="48" height="48">
<div class="lh-100">
<h6 class="mb-0 text-white lh-100">Bootstrap</h6>
<div class="lh-1">
<h6 class="mb-0 text-white lh-1">Bootstrap</h6>
<small>Since 2011</small>
</div>
</div>
@ -74,21 +74,21 @@ body_class: "bg-light"
<h6 class="border-bottom border-gray pb-2 mb-0">Recent updates</h6>
<div class="media text-muted pt-3">
{{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="mr-2 rounded" >}}
<p class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray">
<p class="media-body pb-3 mb-0 small lh-sm border-bottom border-gray">
<strong class="d-block text-gray-dark">@username</strong>
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
</p>
</div>
<div class="media text-muted pt-3">
{{< placeholder width="32" height="32" background="#e83e8c" color="#e83e8c" class="mr-2 rounded" >}}
<p class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray">
<p class="media-body pb-3 mb-0 small lh-sm border-bottom border-gray">
<strong class="d-block text-gray-dark">@username</strong>
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
</p>
</div>
<div class="media text-muted pt-3">
{{< placeholder width="32" height="32" background="#6f42c1" color="#6f42c1" class="mr-2 rounded" >}}
<p class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray">
<p class="media-body pb-3 mb-0 small lh-sm border-bottom border-gray">
<strong class="d-block text-gray-dark">@username</strong>
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
</p>
@ -102,7 +102,7 @@ body_class: "bg-light"
<h6 class="border-bottom border-gray pb-2 mb-0">Suggestions</h6>
<div class="media text-muted pt-3">
{{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="mr-2 rounded" >}}
<div class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray">
<div class="media-body pb-3 mb-0 small lh-sm border-bottom border-gray">
<div class="d-flex justify-content-between align-items-center w-100">
<strong class="text-gray-dark">Full Name</strong>
<a href="#">Follow</a>
@ -112,7 +112,7 @@ body_class: "bg-light"
</div>
<div class="media text-muted pt-3">
{{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="mr-2 rounded" >}}
<div class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray">
<div class="media-body pb-3 mb-0 small lh-sm border-bottom border-gray">
<div class="d-flex justify-content-between align-items-center w-100">
<strong class="text-gray-dark">Full Name</strong>
<a href="#">Follow</a>
@ -122,7 +122,7 @@ body_class: "bg-light"
</div>
<div class="media text-muted pt-3">
{{< placeholder width="32" height="32" background="#007bff" color="#007bff" class="mr-2 rounded" >}}
<div class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray">
<div class="media-body pb-3 mb-0 small lh-sm border-bottom border-gray">
<div class="d-flex justify-content-between align-items-center w-100">
<strong class="text-gray-dark">Full Name</strong>
<a href="#">Follow</a>

4
site/content/docs/4.3/examples/offcanvas/offcanvas.css
View file

@ -65,7 +65,3 @@ body {
.text-white-50 { color: rgba(255, 255, 255, .5); }
.bg-purple { background-color: #6f42c1; }
.lh-100 { line-height: 1; }
.lh-125 { line-height: 1.25; }
.lh-150 { line-height: 1.5; }