mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-18 10:52:19 +01:00
Update instances of .font-weight to .fw
This commit is contained in:
Mark Otto
Martijn Cuppens
parent
4d1ee3b0a7
commit
d1dcc1e5e6
@ -40,7 +40,7 @@ title: Album example
|
||||
<section class="py-5 text-center container">
|
||||
<div class="row py-lg-5">
|
||||
<div class="col-lg-6 col-md-8 mx-auto">
|
||||
<h1 class="font-weight-light">Album example</h1>
|
||||
<h1 class="fw-light">Album example</h1>
|
||||
<p class="lead text-muted">Something short and leading about the collection below—its contents, the creator, etc. Make it short and sweet, but not too short so folks don’t simply skip over it entirely.</p>
|
||||
<p>
|
||||
<a href="#" class="btn btn-primary my-2">Main call to action</a>
|
||||
|
||||
@ -48,7 +48,7 @@ include_js: false
|
||||
<div class="col-md-6 px-0">
|
||||
<h1 class="display-4 font-italic">Title of a longer featured blog post</h1>
|
||||
<p class="lead my-3">Multiple lines of text that form the lede, informing new readers quickly and efficiently about what’s most interesting in this post’s contents.</p>
|
||||
<p class="lead mb-0"><a href="#" class="text-white font-weight-bold">Continue reading...</a></p>
|
||||
<p class="lead mb-0"><a href="#" class="text-white fw-bold">Continue reading...</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -24,7 +24,7 @@ include_js: false
|
||||
<h1>Cover your page.</h1>
|
||||
<p class="lead">Cover is a one-page template for building simple and beautiful home pages. Download, edit the text, and add your own fullscreen background photo to make it your own.</p>
|
||||
<p class="lead">
|
||||
<a href="#" class="btn btn-lg btn-secondary font-weight-bold border-white bg-white">Learn more</a>
|
||||
<a href="#" class="btn btn-lg btn-secondary fw-bold border-white bg-white">Learn more</a>
|
||||
</p>
|
||||
</main>
|
||||
|
||||
|
||||
@ -7,7 +7,7 @@ include_js: false
|
||||
---
|
||||
|
||||
<header class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom shadow-sm">
|
||||
<p class="h5 my-0 mr-md-auto font-weight-normal">Company name</p>
|
||||
<p class="h5 my-0 mr-md-auto fw-normal">Company name</p>
|
||||
<nav class="my-2 my-md-0 mr-md-3">
|
||||
<a class="p-2 text-dark" href="#">Features</a>
|
||||
<a class="p-2 text-dark" href="#">Enterprise</a>
|
||||
@ -27,7 +27,7 @@ include_js: false
|
||||
<div class="col">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-header">
|
||||
<h4 class="my-0 font-weight-normal">Free</h4>
|
||||
<h4 class="my-0 fw-normal">Free</h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h1 class="card-title pricing-card-title">$0 <small class="text-muted">/ mo</small></h1>
|
||||
@ -44,7 +44,7 @@ include_js: false
|
||||
<div class="col">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-header">
|
||||
<h4 class="my-0 font-weight-normal">Pro</h4>
|
||||
<h4 class="my-0 fw-normal">Pro</h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h1 class="card-title pricing-card-title">$15 <small class="text-muted">/ mo</small></h1>
|
||||
@ -61,7 +61,7 @@ include_js: false
|
||||
<div class="col">
|
||||
<div class="card mb-4 shadow-sm">
|
||||
<div class="card-header">
|
||||
<h4 class="my-0 font-weight-normal">Enterprise</h4>
|
||||
<h4 class="my-0 fw-normal">Enterprise</h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h1 class="card-title pricing-card-title">$29 <small class="text-muted">/ mo</small></h1>
|
||||
|
||||
@ -23,8 +23,8 @@ extra_css:
|
||||
<main>
|
||||
<div class="position-relative overflow-hidden p-3 p-md-5 m-md-3 text-center bg-light">
|
||||
<div class="col-md-5 p-lg-5 mx-auto my-5">
|
||||
<h1 class="display-4 font-weight-normal">Punny headline</h1>
|
||||
<p class="lead font-weight-normal">And an even wittier subheading to boot. Jumpstart your marketing efforts with this example based on Apple’s marketing pages.</p>
|
||||
<h1 class="display-4 fw-normal">Punny headline</h1>
|
||||
<p class="lead fw-normal">And an even wittier subheading to boot. Jumpstart your marketing efforts with this example based on Apple’s marketing pages.</p>
|
||||
<a class="btn btn-outline-secondary" href="#">Coming soon</a>
|
||||
</div>
|
||||
<div class="product-device shadow-sm d-none d-md-block"></div>
|
||||
|
||||
@ -10,7 +10,7 @@ include_js: false
|
||||
<main class="form-signin">
|
||||
<form>
|
||||
<img class="mb-4" src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo.svg" alt="" width="72" height="57">
|
||||
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
|
||||
<h1 class="h3 mb-3 fw-normal">Please sign in</h1>
|
||||
<label for="inputEmail" class="visually-hidden">Email address</label>
|
||||
<input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
|
||||
<label for="inputPassword" class="visually-hidden">Password</label>
|
||||
|
||||
@ -65,8 +65,8 @@ Bootstrap includes a handful of options for including some or all of our compile
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap.css</code></div>
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap.min.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap.min.css</code></div>
|
||||
</th>
|
||||
<td>Included</td>
|
||||
<td>Included</td>
|
||||
@ -75,8 +75,8 @@ Bootstrap includes a handful of options for including some or all of our compile
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap-grid.css</code></div>
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap-grid.min.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap-grid.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap-grid.min.css</code></div>
|
||||
</th>
|
||||
<td><a class="link-secondary" href="{{< docsref "/layout/grid" >}}">Only grid system</a></td>
|
||||
<td class="text-muted">—</td>
|
||||
@ -85,8 +85,8 @@ Bootstrap includes a handful of options for including some or all of our compile
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap-utilities.css</code></div>
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap-utilities.min.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap-utilities.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap-utilities.min.css</code></div>
|
||||
</th>
|
||||
<td class="text-muted">—</td>
|
||||
<td class="text-muted">—</td>
|
||||
@ -95,8 +95,8 @@ Bootstrap includes a handful of options for including some or all of our compile
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap-reboot.css</code></div>
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap-reboot.min.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap-reboot.css</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap-reboot.min.css</code></div>
|
||||
</th>
|
||||
<td class="text-muted">—</td>
|
||||
<td><a class="link-secondary" href="{{< docsref "/content/reboot" >}}">Only Reboot</a></td>
|
||||
@ -120,15 +120,15 @@ Similarly, we have options for including some or all of our compiled JavaScript.
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap.bundle.js</code></div>
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap.bundle.min.js</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap.bundle.js</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap.bundle.min.js</code></div>
|
||||
</th>
|
||||
<td>Included</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap.js</code></div>
|
||||
<div><code class="font-weight-normal text-nowrap">bootstrap.min.js</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap.js</code></div>
|
||||
<div><code class="fw-normal text-nowrap">bootstrap.min.js</code></div>
|
||||
</th>
|
||||
<td class="text-muted">—</td>
|
||||
</tr>
|
||||
|
||||
@ -26,33 +26,33 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td class="border-dark"></td>
|
||||
<th scope="col">
|
||||
Extra small<br>
|
||||
<span class="font-weight-normal"><576px</span>
|
||||
<span class="fw-normal"><576px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
Small<br>
|
||||
<span class="font-weight-normal">≥576px</span>
|
||||
<span class="fw-normal">≥576px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
Medium<br>
|
||||
<span class="font-weight-normal">≥768px</span>
|
||||
<span class="fw-normal">≥768px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
Large<br>
|
||||
<span class="font-weight-normal">≥992px</span>
|
||||
<span class="fw-normal">≥992px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
X-Large<br>
|
||||
<span class="font-weight-normal">≥1200px</span>
|
||||
<span class="fw-normal">≥1200px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
XX-Large<br>
|
||||
<span class="font-weight-normal">≥1400px</span>
|
||||
<span class="fw-normal">≥1400px</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td>540px</td>
|
||||
<td>720px</td>
|
||||
@ -61,7 +61,7 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td>1320px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container-sm</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container-sm</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td>540px</td>
|
||||
<td>720px</td>
|
||||
@ -70,7 +70,7 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td>1320px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container-md</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container-md</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
<td>720px</td>
|
||||
@ -79,7 +79,7 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td>1320px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container-lg</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container-lg</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
@ -88,7 +88,7 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td>1320px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container-xl</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container-xl</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
@ -97,7 +97,7 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td>1320px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container-xxl</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container-xxl</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
@ -106,7 +106,7 @@ See them in action and compare them in our [Grid example]({{< docsref "/examples
|
||||
<td>1320px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row" class="font-weight-normal"><code>.container-fluid</code></th>
|
||||
<th scope="row" class="fw-normal"><code>.container-fluid</code></th>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
<td class="text-muted">100%</td>
|
||||
|
||||
@ -69,33 +69,33 @@ As noted above, each of these breakpoints have their own container, unique class
|
||||
<th scope="col"></th>
|
||||
<th scope="col">
|
||||
xs<br>
|
||||
<span class="font-weight-normal"><576px</span>
|
||||
<span class="fw-normal"><576px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
sm<br>
|
||||
<span class="font-weight-normal">≥576px</span>
|
||||
<span class="fw-normal">≥576px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
md<br>
|
||||
<span class="font-weight-normal">≥768px</span>
|
||||
<span class="fw-normal">≥768px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
lg<br>
|
||||
<span class="font-weight-normal">≥992px</span>
|
||||
<span class="fw-normal">≥992px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
xl<br>
|
||||
<span class="font-weight-normal">≥1200px</span>
|
||||
<span class="fw-normal">≥1200px</span>
|
||||
</th>
|
||||
<th scope="col">
|
||||
xxl<br>
|
||||
<span class="font-weight-normal">≥1400px</span>
|
||||
<span class="fw-normal">≥1400px</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th class="text-nowrap" scope="row">Container <code class="font-weight-normal">max-width</code></th>
|
||||
<th class="text-nowrap" scope="row">Container <code class="fw-normal">max-width</code></th>
|
||||
<td>None (auto)</td>
|
||||
<td>540px</td>
|
||||
<td>720px</td>
|
||||
|
||||
@ -33,7 +33,7 @@
|
||||
<div class="masthead-followup-icon d-inline-block mb-2 text-white bg-danger">
|
||||
{{ partial "icons/droplet-fill.svg" (dict "width" "32" "height" "32") }}
|
||||
</div>
|
||||
<h2 class="display-6 font-weight-normal">Go further with Bootstrap Themes</h2>
|
||||
<h2 class="display-6 fw-normal">Go further with Bootstrap Themes</h2>
|
||||
<p class="col-md-10 col-lg-8 mx-auto lead">
|
||||
Need something more than these examples? Take Bootstrap to the next level with premium themes from the <a href="{{ .Site.Params.themes }}">official Bootstrap Themes marketplace</a>. They’re built as their own extended frameworks, rich with new components and plugins, documentation, and powerful build tools.
|
||||
</p>
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
|
||||
{{- if $group.pages }}
|
||||
<div class="collapse{{ if $is_active_group }} show{{ end }}" id="{{ $group_slug }}-collapse">
|
||||
<ul class="list-unstyled font-weight-normal pb-1 small">
|
||||
<ul class="list-unstyled fw-normal pb-1 small">
|
||||
{{- range $doc := $group.pages -}}
|
||||
{{- $doc_slug := $doc.title | urlize -}}
|
||||
{{- $is_active := and $is_active_group (eq $page_slug $doc_slug) -}}
|
||||
|
||||
@ -4,8 +4,8 @@
|
||||
<div class="masthead-followup-icon d-inline-block mb-2 text-white bg-success">
|
||||
{{ partial "icons/code.svg" (dict "width" "32" "height" "32") }}
|
||||
</div>
|
||||
<h2 class="display-5 font-weight-normal">Installation</h2>
|
||||
<p class="lead font-weight-normal">
|
||||
<h2 class="display-5 fw-normal">Installation</h2>
|
||||
<p class="lead fw-normal">
|
||||
Install Bootstrap’s source Sass and JavaScript files via npm, Composer, or Meteor.
|
||||
</p>
|
||||
<p>Package managed installs don’t include documentation or our full build scripts. You can also <a href="https://github.com/twbs/bootstrap-npm-starter">use our npm template repo</a> to quickly generate a Bootstrap project via npm.</p>
|
||||
@ -22,8 +22,8 @@
|
||||
<div class="masthead-followup-icon d-inline-block mb-2 text-white bg-primary">
|
||||
{{ partial "icons/cloud-fill.svg" (dict "width" "32" "height" "32") }}
|
||||
</div>
|
||||
<h2 class="display-5 font-weight-normal">jsDelivr</h2>
|
||||
<p class="lead font-weight-normal">
|
||||
<h2 class="display-5 fw-normal">jsDelivr</h2>
|
||||
<p class="lead fw-normal">
|
||||
When you only need to include Bootstrap’s compiled CSS or JS, you can use <a href="https://www.jsdelivr.com/">jsDelivr</a>.
|
||||
</p>
|
||||
<p>
|
||||
@ -44,8 +44,8 @@
|
||||
<div class="masthead-followup-icon d-inline-block mb-2 text-white bd-bg-purple-bright">
|
||||
{{ partial "icons/circle-square.svg" (dict "width" "32" "height" "32") }}
|
||||
</div>
|
||||
<h2 class="display-5 font-weight-normal">Bootstrap Icons</h2>
|
||||
<p class="lead font-weight-normal">
|
||||
<h2 class="display-5 fw-normal">Bootstrap Icons</h2>
|
||||
<p class="lead fw-normal">
|
||||
For the first time ever, Bootstrap has its own open source SVG icon library, designed to work best with our components and documentation.
|
||||
</p>
|
||||
<p>
|
||||
@ -66,8 +66,8 @@
|
||||
<div class="masthead-followup-icon d-inline-block mb-2 text-white bg-danger">
|
||||
{{ partial "icons/droplet-fill.svg" (dict "width" "32" "height" "32") }}
|
||||
</div>
|
||||
<h2 class="display-5 font-weight-normal">Official Themes</h2>
|
||||
<p class="lead font-weight-normal">
|
||||
<h2 class="display-5 fw-normal">Official Themes</h2>
|
||||
<p class="lead fw-normal">
|
||||
Take Bootstrap to the next level with premium themes from the <a href="{{ .Site.Params.themes }}">official Bootstrap Themes marketplace</a>.
|
||||
</p>
|
||||
<p>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user