[Adhere to the Code Guide.](https://codeguide.co/#css)
- When feasible, default color palettes should comply with [WCAG color contrast guidelines](https://www.w3.org/TR/WCAG20/#visual-audio-contrast).
-- Except in rare cases, don't remove default `:focus` styles (via e.g. `outline: none;`) without providing alternative styles. See [this A11Y Project post](https://a11yproject.com/posts/never-remove-css-outlines/) for more details.
+- Except in rare cases, don't remove default `:focus` styles (via e.g. `outline: none;`) without providing alternative styles. See [this A11Y Project post](https://www.a11yproject.com/posts/2013-01-25-never-remove-css-outlines/) for more details.
### JS
[](https://david-dm.org/twbs/bootstrap?type=peer)
[](https://david-dm.org/twbs/bootstrap?type=dev)
[](https://coveralls.io/github/twbs/bootstrap?branch=main)
-[](https://github.com/twbs/bootstrap/tree/main/dist/css/bootstrap.min.css)
-[](https://github.com/twbs/bootstrap/tree/main/dist/js/bootstrap.min.js)
+[](https://github.com/twbs/bootstrap/blob/main/dist/css/bootstrap.min.css)
+[](https://github.com/twbs/bootstrap/blob/main/dist/js/bootstrap.min.js)
[](https://www.browserstack.com/automate/public-build/SkxZcStBeExEdVJqQ2hWYnlWckpkNmNEY213SFp6WHFETWk2bGFuY3pCbz0tLXhqbHJsVlZhQnRBdEpod3NLSDMzaHc9PQ==--3d0b75245708616eb93113221beece33e680b229)
[](#backers)
[](#sponsors)
// Hide content visually while keeping it accessible to assistive technologies
//
-// See: https://a11yproject.com/posts/how-to-hide-content/
+// See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
// See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
@mixin visually-hidden() {
## Additional resources
- [Web Content Accessibility Guidelines (WCAG) 2.1](https://www.w3.org/TR/WCAG21/)
-- [The A11Y Project](https://a11yproject.com/)
+- [The A11Y Project](https://www.a11yproject.com/)
- [MDN accessibility documentation](https://developer.mozilla.org/en-US/docs/Web/Accessibility)
- [Tenon.io Accessibility Checker](https://tenon.io/)
- [Color Contrast Analyser (CCA)](https://developer.paciellogroup.com/resources/contrastanalyser/)
@import "~bootstrap/scss/bootstrap";
{{< /highlight >}}
-For Bootstrap to compile, make sure you install and use the required loaders: [sass-loader](https://github.com/webpack-contrib/sass-loader), [postcss-loader](https://github.com/postcss/postcss-loader) with [Autoprefixer](https://github.com/postcss/autoprefixer#webpack). With minimal setup, your webpack config should include this rule or similar:
+For Bootstrap to compile, make sure you install and use the required loaders: [sass-loader](https://github.com/webpack-contrib/sass-loader), [postcss-loader](https://github.com/webpack-contrib/postcss-loader) with [Autoprefixer](https://github.com/postcss/autoprefixer#webpack). With minimal setup, your webpack config should include this rule or similar:
{{< highlight js >}}
...
<main class="bd-main order-1">
<div class="bd-intro pt-md-3 pl-lg-4">
<div class="d-md-flex flex-md-row-reverse align-items-center justify-content-between">
- <a class="btn btn-sm btn-bd-light mb-2 mb-md-0" href="{{ .Site.Params.repo }}/tree/main/site/content/{{ .Page.File.Path }}" title="View and edit this file on GitHub" target="_blank" rel="noopener">View on GitHub</a>
+ <a class="btn btn-sm btn-bd-light mb-2 mb-md-0" href="{{ .Site.Params.repo }}/blob/main/site/content/{{ .Page.File.Path }}" title="View and edit this file on GitHub" target="_blank" rel="noopener">View on GitHub</a>
<h1 class="bd-title" id="content">{{ .Title | markdownify }}</h1>
</div>
<p class="bd-lead">{{ .Page.Params.Description | markdownify }}</p>