rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-30 22:52:24 +01:00
Code Issues Actions Packages Releases Activity

Fix duplicate .rounded-* and .fw-semibold defs in examples

Browse Source
This commit is contained in:
Julien Déramond 2022-03-29 08:48:56 +02:00 committed by Mark Otto
parent bef4f3b6c6
commit 16711ff5b1
7 changed files with 27 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
site/content/docs/5.1/examples/dropdowns/index.html
View File

@ -81,14 +81,14 @@ body_class: ""
</svg>
<div class="d-flex gap-5 justify-content-center">
<ul class="dropdown-menu position-static d-grid gap-1 p-2 rounded-4 mx-0 shadow w-220px">
<ul class="dropdown-menu position-static d-grid gap-1 p-2 rounded-3 mx-0 shadow w-220px">
<li><a class="dropdown-item rounded-2 active" href="#">Action</a></li>
<li><a class="dropdown-item rounded-2" href="#">Another action</a></li>
<li><a class="dropdown-item rounded-2" href="#">Something else here</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item rounded-2" href="#">Separated link</a></li>
</ul>
<ul class="dropdown-menu dropdown-menu-dark position-static d-grid gap-1 p-2 rounded-4 mx-0 border-0 shadow w-220px">
<ul class="dropdown-menu dropdown-menu-dark position-static d-grid gap-1 p-2 rounded-3 mx-0 border-0 shadow w-220px">
<li><a class="dropdown-item rounded-2 active" href="#">Action</a></li>
<li><a class="dropdown-item rounded-2" href="#">Another action</a></li>
<li><a class="dropdown-item rounded-2" href="#">Something else here</a></li>

2
site/content/docs/5.1/examples/features/features.css
View File

@ -1,6 +1,7 @@
.feature-icon {
width: 4rem;
height: 4rem;
border-radius: .75rem;
}
.icon-link > .bi {
@ -16,6 +17,7 @@
.icon-square {
width: 3rem;
height: 3rem;
border-radius: .75rem;
}
.text-shadow-1 { text-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25); }

18
site/content/docs/5.1/examples/features/index.html
View File

@ -71,7 +71,7 @@ body_class: ""
<h2 class="pb-2 border-bottom">Columns with icons</h2>
<div class="row g-4 py-5 row-cols-1 row-cols-lg-3">
<div class="feature col">
<div class="feature-icon d-inline-flex align-items-center justify-content-center bg-primary bg-gradient rounded-5 text-white fs-2 mb-3">
<div class="feature-icon d-inline-flex align-items-center justify-content-center bg-primary bg-gradient text-white fs-2 mb-3">
<svg class="bi" width="1em" height="1em"><use xlink:href="#collection"/></svg>
</div>
<h2>Featured title</h2>
@ -82,7 +82,7 @@ body_class: ""
</a>
</div>
<div class="feature col">
<div class="feature-icon d-inline-flex align-items-center justify-content-center bg-primary bg-gradient rounded-5 text-white fs-2 mb-3">
<div class="feature-icon d-inline-flex align-items-center justify-content-center bg-primary bg-gradient text-white fs-2 mb-3">
<svg class="bi" width="1em" height="1em"><use xlink:href="#people-circle"/></svg>
</div>
<h2>Featured title</h2>
@ -93,7 +93,7 @@ body_class: ""
</a>
</div>
<div class="feature col">
<div class="feature-icon d-inline-flex align-items-center justify-content-center bg-primary bg-gradient rounded-5 text-white fs-2 mb-3">
<div class="feature-icon d-inline-flex align-items-center justify-content-center bg-primary bg-gradient text-white fs-2 mb-3">
<svg class="bi" width="1em" height="1em"><use xlink:href="#toggles2"/></svg>
</div>
<h2>Featured title</h2>
@ -112,7 +112,7 @@ body_class: ""
<h2 class="pb-2 border-bottom">Hanging icons</h2>
<div class="row g-4 py-5 row-cols-1 row-cols-lg-3">
<div class="col d-flex align-items-start">
<div class="icon-square bg-light text-dark d-inline-flex align-items-center justify-content-center fs-4 rounded-5 flex-shrink-0 me-3">
<div class="icon-square bg-light text-dark d-inline-flex align-items-center justify-content-center fs-4 flex-shrink-0 me-3">
<svg class="bi" width="1em" height="1em"><use xlink:href="#toggles2"/></svg>
</div>
<div>
@ -124,7 +124,7 @@ body_class: ""
</div>
</div>
<div class="col d-flex align-items-start">
<div class="icon-square bg-light text-dark d-inline-flex align-items-center justify-content-center fs-4 rounded-5 flex-shrink-0 me-3">
<div class="icon-square bg-light text-dark d-inline-flex align-items-center justify-content-center fs-4 flex-shrink-0 me-3">
<svg class="bi" width="1em" height="1em"><use xlink:href="#cpu-fill"/></svg>
</div>
<div>
@ -136,7 +136,7 @@ body_class: ""
</div>
</div>
<div class="col d-flex align-items-start">
<div class="icon-square bg-light text-dark d-inline-flex align-items-center justify-content-center fs-4 rounded-5 flex-shrink-0 me-3">
<div class="icon-square bg-light text-dark d-inline-flex align-items-center justify-content-center fs-4 flex-shrink-0 me-3">
<svg class="bi" width="1em" height="1em"><use xlink:href="#tools"/></svg>
</div>
<div>
@ -157,7 +157,7 @@ body_class: ""
<div class="row row-cols-1 row-cols-lg-3 align-items-stretch g-4 py-5">
<div class="col">
<div class="card card-cover h-100 overflow-hidden text-white bg-dark rounded-6 shadow-lg" style="background-image: url('unsplash-photo-1.jpg');">
<div class="card card-cover h-100 overflow-hidden text-white bg-dark rounded-4 shadow-lg" style="background-image: url('unsplash-photo-1.jpg');">
<div class="d-flex flex-column h-100 p-5 pb-3 text-white text-shadow-1">
<h2 class="pt-5 mt-5 mb-4 display-6 lh-1 fw-bold">Short title, long jacket</h2>
<ul class="d-flex list-unstyled mt-auto">
@ -178,7 +178,7 @@ body_class: ""
</div>
<div class="col">
<div class="card card-cover h-100 overflow-hidden text-white bg-dark rounded-6 shadow-lg" style="background-image: url('unsplash-photo-2.jpg');">
<div class="card card-cover h-100 overflow-hidden text-white bg-dark rounded-4 shadow-lg" style="background-image: url('unsplash-photo-2.jpg');">
<div class="d-flex flex-column h-100 p-5 pb-3 text-white text-shadow-1">
<h2 class="pt-5 mt-5 mb-4 display-6 lh-1 fw-bold">Much longer title that wraps to multiple lines</h2>
<ul class="d-flex list-unstyled mt-auto">
@ -199,7 +199,7 @@ body_class: ""
</div>
<div class="col">
<div class="card card-cover h-100 overflow-hidden text-white bg-dark rounded-6 shadow-lg" style="background-image: url('unsplash-photo-3.jpg');">
<div class="card card-cover h-100 overflow-hidden text-white bg-dark rounded-4 shadow-lg" style="background-image: url('unsplash-photo-3.jpg');">
<div class="d-flex flex-column h-100 p-5 pb-3 text-shadow-1">
<h2 class="pt-5 mt-5 mb-4 display-6 lh-1 fw-bold">Another longer title belongs here</h2>
<ul class="d-flex list-unstyled mt-auto">

8
site/content/docs/5.1/examples/list-groups/index.html
View File

@ -161,25 +161,25 @@ body_class: ""
<div class="list-group list-group-checkable d-grid gap-2 border-0 w-auto">
<input class="list-group-item-check pe-none" type="radio" name="listGroupCheckableRadios" id="listGroupCheckableRadios1" value="" checked>
<label class="list-group-item rounded-4 py-3" for="listGroupCheckableRadios1">
<label class="list-group-item rounded-3 py-3" for="listGroupCheckableRadios1">
First radio
<span class="d-block small opacity-50">With support text underneath to add more detail</span>
</label>
<input class="list-group-item-check pe-none" type="radio" name="listGroupCheckableRadios" id="listGroupCheckableRadios2" value="">
<label class="list-group-item rounded-4 py-3" for="listGroupCheckableRadios2">
<label class="list-group-item rounded-3 py-3" for="listGroupCheckableRadios2">
Second radio
<span class="d-block small opacity-50">Some other text goes here</span>
</label>
<input class="list-group-item-check pe-none" type="radio" name="listGroupCheckableRadios" id="listGroupCheckableRadios3" value="">
<label class="list-group-item rounded-4 py-3" for="listGroupCheckableRadios3">
<label class="list-group-item rounded-3 py-3" for="listGroupCheckableRadios3">
Third radio
<span class="d-block small opacity-50">And we end with another snippet of text</span>
</label>
<input class="list-group-item-check pe-none" type="radio" name="listGroupCheckableRadios" id="listGroupCheckableRadios4" value="" disabled>
<label class="list-group-item rounded-4 py-3" for="listGroupCheckableRadios4">
<label class="list-group-item rounded-3 py-3" for="listGroupCheckableRadios4">
Fourth disabled radio
<span class="d-block small opacity-50">This option is disabled</span>
</label>

20
site/content/docs/5.1/examples/modals/index.html
View File

@ -57,7 +57,7 @@ body_class: ""
<div class="modal modal-sheet position-static d-block bg-secondary py-5" tabindex="-1" role="dialog" id="modalSheet">
<div class="modal-dialog" role="document">
<div class="modal-content rounded-6 shadow">
<div class="modal-content rounded-4 shadow">
<div class="modal-header border-bottom-0">
<h5 class="modal-title">Modal title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
@ -77,7 +77,7 @@ body_class: ""
<div class="modal modal-alert position-static d-block bg-secondary py-5" tabindex="-1" role="dialog" id="modalChoice">
<div class="modal-dialog" role="document">
<div class="modal-content rounded-4 shadow">
<div class="modal-content rounded-3 shadow">
<div class="modal-body p-4 text-center">
<h5 class="mb-0">Enable this setting?</h5>
<p class="mb-0">You can always change your mind in your account settings.</p>
@ -94,7 +94,7 @@ body_class: ""
<div class="modal modal-tour position-static d-block bg-secondary py-5" tabindex="-1" role="dialog" id="modalTour">
<div class="modal-dialog" role="document">
<div class="modal-content rounded-6 shadow">
<div class="modal-content rounded-4 shadow">
<div class="modal-body p-5">
<h2 class="fw-bold mb-0">What's new</h2>
@ -131,7 +131,7 @@ body_class: ""
<div class="modal modal-signin position-static d-block bg-secondary py-5" tabindex="-1" role="dialog" id="modalSignin">
<div class="modal-dialog" role="document">
<div class="modal-content rounded-5 shadow">
<div class="modal-content rounded-4 shadow">
<div class="modal-header p-5 pb-4 border-bottom-0">
<!-- <h5 class="modal-title">Modal title</h5> -->
<h2 class="fw-bold mb-0">Sign up for free</h2>
@ -141,26 +141,26 @@ body_class: ""
<div class="modal-body p-5 pt-0">
<form class="">
<div class="form-floating mb-3">
<input type="email" class="form-control rounded-4" id="floatingInput" placeholder="name@example.com">
<input type="email" class="form-control rounded-3" id="floatingInput" placeholder="name@example.com">
<label for="floatingInput">Email address</label>
</div>
<div class="form-floating mb-3">
<input type="password" class="form-control rounded-4" id="floatingPassword" placeholder="Password">
<input type="password" class="form-control rounded-3" id="floatingPassword" placeholder="Password">
<label for="floatingPassword">Password</label>
</div>
<button class="w-100 mb-2 btn btn-lg rounded-4 btn-primary" type="submit">Sign up</button>
<button class="w-100 mb-2 btn btn-lg rounded-3 btn-primary" type="submit">Sign up</button>
<small class="text-muted">By clicking Sign up, you agree to the terms of use.</small>
<hr class="my-4">
<h2 class="fs-5 fw-bold mb-3">Or use a third-party</h2>
<button class="w-100 py-2 mb-2 btn btn-outline-dark rounded-4" type="submit">
<button class="w-100 py-2 mb-2 btn btn-outline-dark rounded-3" type="submit">
<svg class="bi me-1" width="16" height="16"><use xlink:href="#twitter"/></svg>
Sign up with Twitter
</button>
<button class="w-100 py-2 mb-2 btn btn-outline-primary rounded-4" type="submit">
<button class="w-100 py-2 mb-2 btn btn-outline-primary rounded-3" type="submit">
<svg class="bi me-1" width="16" height="16"><use xlink:href="#facebook"/></svg>
Sign up with Facebook
</button>
<button class="w-100 py-2 mb-2 btn btn-outline-secondary rounded-4" type="submit">
<button class="w-100 py-2 mb-2 btn btn-outline-secondary rounded-3" type="submit">
<svg class="bi me-1" width="16" height="16"><use xlink:href="#github"/></svg>
Sign up with GitHub
</button>

2
site/content/docs/5.1/examples/sidebars/sidebars.css
View File

@ -57,5 +57,3 @@ main {
.scrollarea {
overflow-y: auto;
}
.fw-semibold { font-weight: 600; }

4
site/layouts/_default/examples.html
View File

@ -51,10 +51,6 @@
fill: currentColor;
}
.rounded-4 { border-radius: .5rem; }
.rounded-5 { border-radius: .75rem; }
.rounded-6 { border-radius: 1rem; }
.nav-scroller {
position: relative;
z-index: 2;