mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-28 07:39:57 +02:00
Code Issues Releases Wiki Activity

Add v5.0.2 docs

Browse Source
This commit is contained in:
XhmikosR
2021-06-22 21:28:23 +03:00
parent 258f7e37f3
commit a43dd5a897
181 changed files with 4591 additions and 4253 deletions
Download Patch File Download Diff File Expand all files Collapse all files

132
docs/5.0/examples/index.html
View File

@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Hugo 0.83.1">
<meta name="generator" content="Hugo 0.84.0">
<meta name="docsearch:language" content="en">
<meta name="docsearch:version" content="5.0">
@@ -17,7 +17,7 @@
<!-- Bootstrap core CSS -->
<link href="/docs/5.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<link href="/docs/5.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="/docs/5.0/assets/css/docs.css" rel="stylesheet">
@@ -62,7 +62,7 @@
<div class="skippy visually-hidden-focusable overflow-hidden">
<div class="container-xl">
<a class="d-inline-flex p-2 m-1" href="#content">Skip to main content</a>
</div>
</div>
@@ -137,19 +137,19 @@
</header>
<header class="py-5 border-bottom">
<div class="container pt-md-1 pb-md-4">
<div class="row">
<div class="col-xl-8">
<h1 class="bd-title mt-0">Examples</h1>
<p class="bd-lead">Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.</p>
<div class="d-flex flex-column flex-sm-row">
<a href="https://github.com/twbs/bootstrap/releases/download/v5.0.1/bootstrap-5.0.1-examples.zip" class="btn btn-lg btn-bd-primary" onclick="ga('send', 'event', 'Examples', 'Hero', 'Download Examples');">Download examples</a>
<a href="https://github.com/twbs/bootstrap/archive/v5.0.1.zip" class="btn btn-lg btn-outline-secondary mt-3 mt-sm-0 ms-sm-3" onclick="ga('send', 'event', 'Examples', 'Hero', 'Download');">Download source code</a>
<a href="https://github.com/twbs/bootstrap/releases/download/v5.0.2/bootstrap-5.0.2-examples.zip" class="btn btn-lg btn-bd-primary" onclick="ga('send', 'event', 'Examples', 'Hero', 'Download Examples');">Download examples</a>
<a href="https://github.com/twbs/bootstrap/archive/v5.0.2.zip" class="btn btn-lg btn-outline-secondary mt-3 mt-sm-0 ms-sm-3" onclick="ga('send', 'event', 'Examples', 'Hero', 'Download');">Download source code</a>
</div>
</div>
<div class="col-xl-4 d-lg-flex justify-content-xl-end">
<script async src="https://cdn.carbonads.com/carbon.js?serve=CKYIKKJL&placement=getbootstrapcom" id="_carbonads_js"></script>
@@ -161,7 +161,7 @@
<main class="bd-content order-1 py-5" id="content">
<div class="container">
<h2 id="snippets">Snippets</h2>
<p>Common patterns for building sites and apps that build on existing components and utilities with custom CSS and more.</p>
<div class="row">
@@ -177,8 +177,8 @@
</a>
<p class="text-muted">Display your branding, navigation, search, and more with these header components</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/heroes/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/heroes.png,
@@ -191,8 +191,8 @@
</a>
<p class="text-muted">Set the stage on your homepage with heroes that feature clear calls to action.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/features/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/features.png,
@@ -205,8 +205,8 @@
</a>
<p class="text-muted">Explain the features, benefits, or other details in your marketing content.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/sidebars/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/sidebars.png,
@@ -235,8 +235,8 @@
</a>
<p class="text-muted">Simple one-page template for photo galleries, portfolios, and more.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/pricing/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/pricing.png,
@@ -249,8 +249,8 @@
</a>
<p class="text-muted">Example pricing page built with Cards and featuring a custom header and footer.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/checkout/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/checkout.png,
@@ -263,8 +263,8 @@
</a>
<p class="text-muted">Custom checkout form showing our form components and their validation features.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/product/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/product.png,
@@ -277,8 +277,8 @@
</a>
<p class="text-muted">Lean product-focused marketing page with extensive grid and image work.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/cover/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/cover.png,
@@ -291,8 +291,8 @@
</a>
<p class="text-muted">A one-page template for building simple and beautiful home pages.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/carousel/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/carousel.png,
@@ -305,8 +305,8 @@
</a>
<p class="text-muted">Customize the navbar and carousel, then add some new components.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/blog/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/blog.png,
@@ -319,8 +319,8 @@
</a>
<p class="text-muted">Magazine like blog template with header, navigation, featured content.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/dashboard/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/dashboard.png,
@@ -333,8 +333,8 @@
</a>
<p class="text-muted">Basic admin dashboard shell with fixed sidebar and navbar.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/sign-in/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/sign-in.png,
@@ -347,8 +347,8 @@
</a>
<p class="text-muted">Custom form layout and design for a simple sign in form.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/sticky-footer/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/sticky-footer.png,
@@ -361,8 +361,8 @@
</a>
<p class="text-muted">Attach a footer to the bottom of the viewport when page content is short.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/sticky-footer-navbar/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/sticky-footer-navbar.png,
@@ -375,8 +375,8 @@
</a>
<p class="text-muted">Attach a footer to the bottom of the viewport with a fixed top navbar.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/jumbotron/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/jumbotron.png,
@@ -405,8 +405,8 @@
</a>
<p class="text-muted">Nothing but the basics: compiled CSS and JavaScript.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/grid/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/grid.png,
@@ -419,8 +419,8 @@
</a>
<p class="text-muted">Multiple examples of grid layouts with all four tiers, nesting, and more.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/cheatsheet/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/cheatsheet.png,
@@ -433,8 +433,8 @@
</a>
<p class="text-muted">Kitchen sink of Bootstrap components.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/cheatsheet-rtl/" hreflang="ar">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/cheatsheet-rtl.png,
@@ -463,8 +463,8 @@
</a>
<p class="text-muted">Demonstration of all responsive and container options for the navbar.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/navbar-static/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/navbar-static.png,
@@ -477,8 +477,8 @@
</a>
<p class="text-muted">Single navbar example of a static top navbar along with some additional content.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/navbar-fixed/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/navbar-fixed.png,
@@ -491,8 +491,8 @@
</a>
<p class="text-muted">Single navbar example with a fixed top navbar along with some additional content.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/navbar-bottom/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/navbar-bottom.png,
@@ -505,8 +505,8 @@
</a>
<p class="text-muted">Single navbar example with a bottom navbar along with some additional content.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/offcanvas-navbar/">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/offcanvas-navbar.png,
@@ -538,8 +538,8 @@
</a>
<p class="text-muted">Simple one-page template for photo galleries, portfolios, and more.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/checkout-rtl/" hreflang="ar">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/checkout-rtl.png,
@@ -552,8 +552,8 @@
</a>
<p class="text-muted">Custom checkout form showing our form components and their validation features.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/carousel-rtl/" hreflang="ar">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/carousel-rtl.png,
@@ -566,8 +566,8 @@
</a>
<p class="text-muted">Customize the navbar and carousel, then add some new components.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/blog-rtl/" hreflang="ar">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/blog-rtl.png,
@@ -580,8 +580,8 @@
</a>
<p class="text-muted">Magazine like blog template with header, navigation, featured content.</p>
</div>
<div class="col-sm-6 col-md-4 col-xl-3 mb-3">
<a class="d-block" href="/docs/5.0/examples/dashboard-rtl/" hreflang="ar">
<img class="img-thumbnail mb-3" srcset="/docs/5.0/assets/img/examples/dashboard-rtl.png,
@@ -611,10 +611,10 @@
<p class="text-muted">Combine the powers of the Bootstrap grid and the Masonry layout.</p>
</div>
</div>
<hr class="my-5">
<div class="container">
<div class="text-center">
@@ -635,7 +635,7 @@
src="/docs/5.0/assets/img/bootstrap-themes-collage.png"
alt="Bootstrap Themes" width="1150" height="320" loading="lazy">
</div>
</div>
</main>
@@ -651,7 +651,7 @@
<ul class="list-unstyled small text-muted">
<li class="mb-2">Designed and built with all the love in the world by the <a href="/docs/5.0/about/team/">Bootstrap team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</li>
<li class="mb-2">Code licensed <a href="https://github.com/twbs/bootstrap/blob/main/LICENSE" target="_blank" rel="license noopener">MIT</a>, docs <a href="https://creativecommons.org/licenses/by/3.0/" target="_blank" rel="license noopener">CC BY 3.0</a>.</li>
<li class="mb-2">Currently v5.0.1.</li>
<li class="mb-2">Currently v5.0.2.</li>
</ul>
</div>
<div class="col-6 col-lg-2 offset-lg-1 mb-3">
@@ -698,7 +698,7 @@
</div>
</footer>
<script src="/docs/5.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>
<script src="/docs/5.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
@@ -706,7 +706,7 @@
<script src="/docs/5.0/assets/js/docs.min.js"></script>
</body>
</html>