mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00
Code Activity

Fathom

Browse Source
This commit is contained in:
Mark Otto
2022-05-09 16:59:05 -07:00
committed by Mark Otto
parent d0c6a9e12a
commit 0d0ca30f5d
825 changed files with 5120 additions and 4302 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/5.1/utilities/api/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -436,10 +437,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<p>Bootstrap utilities are generated with our utility API and can be used to modify or extend our default set of utility classes via Sass. Our utility API is based on a series of Sass maps and functions for generating families of classes with various options. If you&rsquo;re unfamiliar with Sass maps, read up on the <a href="https://sass-lang.com/documentation/values/maps">official Sass docs</a> to get started.</p>
<p>The <code>$utilities</code> map contains all our utilities and is later merged with your custom <code>$utilities</code> map, if present. The utility map contains a keyed list of utility groups which accept the following options:</p>
@@ -945,7 +946,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/background/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -422,10 +423,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="background-color">Background color</h2>
<p>Similar to the contextual text color classes, set the background of an element to any contextual class. Background utilities <strong>do not set <code>color</code></strong>, so in some cases you&rsquo;ll want to use <code>.text-*</code> <a href="/docs/5.1/utilities/colors/">color utilities</a>.</p>
@@ -716,7 +717,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/borders/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -426,10 +427,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="border">Border</h2>
<p>Use border utilities to add or remove an element&rsquo;s borders. Choose from all borders or one at a time.</p>
@@ -766,7 +767,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/colors/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -421,10 +422,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="colors">Colors</h2>
<p>Colorize text with color utilities. If you want to colorize links, you can use the <a href="/docs/5.1/helpers/colored-links/"><code>.link-*</code> helper classes</a> which have <code>:hover</code> and <code>:focus</code> states.</p>
@@ -672,7 +673,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/display/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -416,10 +417,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="how-it-works">How it works</h2>
<p>Change the value of the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/display"><code>display</code> property</a> with our responsive display utility classes. We purposely support only a subset of all possible values for <code>display</code>. Classes can be combined for various effects as you need.</p>
@@ -636,7 +637,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/flex/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -427,10 +428,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="enable-flex-behaviors">Enable flex behaviors</h2>
<p>Apply <code>display</code> utilities to create a flexbox container and transform <strong>direct children elements</strong> into flex items. Flex containers and items are able to be modified further with additional flex properties.</p>
@@ -1395,7 +1396,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/float/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -413,10 +414,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="overview">Overview</h2>
<p>These utility classes float an element to the left or right, or disable floating, based on the current viewport size using the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/float">CSS <code>float</code> property</a>. <code>!important</code> is included to avoid specificity issues. These use the same viewport breakpoints as our grid system. Please be aware float utilities have no effect on flex items.</p>
@@ -545,7 +546,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/interactions/index.html
+6 -5
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,10 +399,10 @@
</div>
<div class="bd-content ps-lg-4">
<h2 id="text-selection">Text selection</h2>
<p>Change the way in which the content is selected when the user interacts with it.</p>
@@ -514,7 +515,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/opacity/index.html
+6 -5
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,10 +399,10 @@
</div>
<div class="bd-content ps-lg-4">
<p>The <code>opacity</code> property sets the opacity level for an element. The opacity level describes the transparency level, where <code>1</code> is not transparent at all, <code>.5</code> is 50% visible, and <code>0</code> is completely transparent.</p>
<p>Set the <code>opacity</code> of an element using <code>.opacity-{value}</code> utilities.</p>
@@ -500,7 +501,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/overflow/index.html
+6 -5
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,10 +399,10 @@
</div>
<div class="bd-content ps-lg-4">
<p>Adjust the <code>overflow</code> property on the fly with four default values and classes. These classes are not responsive by default.</p>
<div class="bd-example d-md-flex">
@@ -503,7 +504,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/position/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -416,10 +417,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="position-values">Position values</h2>
<p>Quick positioning classes are available, though they are not responsive.</p>
@@ -669,7 +670,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/shadows/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -413,10 +414,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="examples">Examples</h2>
<p>While shadows on components are disabled by default in Bootstrap and can be enabled via <code>$enable-shadows</code>, you can also quickly add or remove a shadow with our <code>box-shadow</code> utility classes. Includes support for <code>.shadow-none</code> and three default sizes (which have associated variables to match).</p>
@@ -521,7 +522,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/sizing/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -413,10 +414,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="relative-to-the-parent">Relative to the parent</h2>
<p>Width and height utilities are generated from the utility API in <code>_utilities.scss</code>. Includes support for <code>25%</code>, <code>50%</code>, <code>75%</code>, <code>100%</code>, and <code>auto</code> by default. Modify those values as you need to generate different utilities here.</p>
@@ -592,7 +593,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/spacing/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -421,10 +422,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="margin-and-padding">Margin and padding</h2>
<p>Assign responsive-friendly <code>margin</code> or <code>padding</code> values to an element or a subset of its sides with shorthand classes. Includes support for individual properties, all properties, and vertical and horizontal properties. Classes are built from a default Sass map ranging from <code>.25rem</code> to <code>3rem</code>.</p>
@@ -724,7 +725,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/text/index.html
+7 -6
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,7 +399,7 @@
</div>
<div class="bd-toc mt-4 mb-5 my-md-0 ps-xl-3 mb-lg-5 text-muted">
<strong class="d-block h6 my-2 pb-2 border-bottom">On this page</strong>
<nav id="TableOfContents">
@@ -423,10 +424,10 @@
</ul>
</nav>
</div>
<div class="bd-content ps-lg-4">
<h2 id="text-alignment">Text alignment</h2>
<p>Easily realign text to components with text alignment classes. For start, end, and center alignment, responsive classes are available that use the same viewport width breakpoints as the grid system.</p>
@@ -745,7 +746,7 @@ Note that <a href="https://rtlstyling.com/posts/rtl-styling#3.-line-break">break
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/vertical-align/index.html
+6 -5
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,10 +399,10 @@
</div>
<div class="bd-content ps-lg-4">
<p>Change the alignment of elements with the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align"><code>vertical-alignment</code></a> utilities. Please note that vertical-align only affects inline, inline-block, inline-table, and table cell elements.</p>
<p>Choose from <code>.align-baseline</code>, <code>.align-top</code>, <code>.align-middle</code>, <code>.align-bottom</code>, <code>.align-text-bottom</code>, and <code>.align-text-top</code> as needed.</p>
@@ -527,7 +528,7 @@
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>
docs/5.1/utilities/visibility/index.html
+6 -5
View File
@@ -48,6 +48,7 @@
<meta property="og:image:width" content="1000">
<meta property="og:image:height" content="500">
<script defer src="https://cdn.usefathom.com/script.js" data-site="ITUSEYJG"></script>
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-146052-10', 'getbootstrap.com');
@@ -137,7 +138,7 @@
</header>
<nav class="bd-subnavbar py-2" aria-label="Secondary navigation">
<div class="container-xxl d-flex align-items-md-center">
<form class="bd-search position-relative me-auto">
@@ -398,10 +399,10 @@
</div>
<div class="bd-content ps-lg-4">
<p>Set the <code>visibility</code> of elements with our visibility utilities. These utility classes do not modify the <code>display</code> value at all and do not affect layout – <code>.invisible</code> elements still take up space in the page.</p>
<div class="bd-callout bd-callout-warning">
@@ -502,7 +503,7 @@ Elements with the <code>.invisible</code> class will be hidden <em>both</em> vis
<script src="/docs/5.1/assets/js/docs.min.js"></script>
</body>
</html>