aboutsummaryrefslogtreecommitdiff
path: root/site/content/docs
AgeCommit message (Collapse)AuthorFilesLines
2022-12-30Docs: enhance Focus ring example section descJulien Déramond1-1/+1
2022-12-29Focus ring helper and utilities (#33125)Mark Otto2-0/+74
* Add global variables for box-shadow focus rings * Update instances of -btn-focus-box-shadow to use -ring-box-shadow, unless it's for buttons or inputs * fix variable name * Add CSS variables for global focus styling, document it * Move to CSS vars section * Update scss/_nav.scss Co-authored-by: Gaël Poupard <[email protected]> * Helper and utils * Fix bundlewatch * Change 'Focus ring' in sidebar so that the page can be visible * Minor typo fix * fix merge * Revamp some more, improve docs Co-authored-by: Gaël Poupard <[email protected]> Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Patrick H. Lauke <[email protected]>
2022-12-29Docs: replace dark btns by primary ones from Button group docs to avoid ↵Julien Déramond1-15/+15
issues in dark mode
2022-12-28Docs: display examples based on the docs current color mode (#37562)Julien Déramond26-50/+50
* Docs: display examples based on the docs current color mode * Fix _default/examples.html
2022-12-28Fix CSS variables mentioned in our docsJulien Déramond1-1/+16
2022-12-28Add .nav-underline modifier class (#33126)Mark Otto1-0/+27
* Add .nav-underline modifier class * Tweak sizing and spacing, add underline on hover * Rebuild with Sass and CSS variables * Document CSS vars * Bump bundlewatch
2022-12-28Improve readability in docs flex page (#34647)Ben Koshy1-18/+18
It's not easy to otherwise correlate the examples with the relevant classes: you'd have to mentally count and correlate them. This obviates that need. Please see the image below to see the usefulness of the above. Co-authored-by: Mark Otto <[email protected]>
2022-12-28Use aria-labelledby to associate form-text (helper) with input field … ↵Hannah Issermann2-5/+6
(#37587) * Use aria-labelledby to associate form-text (helper) with input field when it contains mandatory info (e.g. data format) * Example in input-group needs aria-describedby (or aria-labelledby) too Co-authored-by: Mark Otto <[email protected]>
2022-12-28Update /#color-schemes to v5.3Teaca-Sebastian1-1/+1
2022-12-26Docs: change some title containing '&' to bypass Algolia issueJulien Déramond3-3/+3
2022-12-26Few miscellaneous docs fixes (#37625)Mark Otto1-1/+3
* Update hero button color * Fix link color on examples index * Move .bd-btn-lg to docs buttons partial, move larger border-radius to that class so medium buttons don't look odd * Undo the markup split * Round padding up to whole number
2022-12-26Remove unnecessary `id`/`aria-labelledby` from cheatsheet accordions (#37718)Patrick H. Lauke2-12/+12
Explicit labelling (which then would also benefit from a `role="group"` or similar role) is only optional, and not really appropriate just for a cheatsheet https://www.w3.org/WAI/ARIA/apg/patterns/accordion/ Closes #37591
2022-12-24Remove some unused SVGs in Dropdowns exampleJulien Déramond1-31/+0
2022-12-24Release v5.3.0-alpha1 (#37661)XhmikosR185-22/+22
* Bump version to 5.3.0-alpha1 * Dist * Add docs versions updates * Update note in homepage hero Co-authored-by: Mark Otto <[email protected]>
2022-12-20Update docs and package information to clarify licenseMark Otto1-3/+3
2022-12-20Docs: fix typo for Sass vars references in Customize > Color modes > ↵Julien Déramond1-3/+3
Building with Sass
2022-12-19Docs: remove Webpack reference in Parcel guide (#37670)Louis-Maxime Piton1-1/+1
2022-12-18docs: move color-mode script (#37658)XhmikosR1-1/+1
* docs: move color-mode script * Move color-modes.js in static folder * Async load color-modes.js * Switch to DOMContentLoaded * Revert async loading
2022-12-18Fix grid and alignment of Features example (#37502)Vipin Mishra1-37/+36
Co-authored-by: Julien Déramond <[email protected]>
2022-12-01Update javascript.md (#37566)XhmikosR1-4/+9
2022-11-29Docs: fix 'Usage > Enable dark mode' code example (#37553)Julien Déramond1-2/+2
2022-11-28Docs: rewrite/reorganise carousel docs page (#37354)Patrick H. Lauke1-54/+113
* Instantiate/initialize all non-autoplaying carousels in docs pages * Rewrite/reorganise carousel docs page * start with static/non-autoplaying examples * explicitly mention that carousels currently need to be manually initialized * split out and explain autoplaying and the weird "autoplay after first interaction" behaviour, as well as the pause on hover/focus * Add callout about autoplaying and accessibility * Don't have the dark variant example autoplay * Add "autoplaying" to cspell custom dictionary * Tweal wording, move Page Visibility API to autoplay section * Tweak explanation for methods, add line break in js code for consistency with last code block on the page * Tweak method descriptions * Tweak headings (plural "carousels") * Move some paragraphs out of intro and into basic example, reword the nested and accessibility paragraph * Tweak warning about `.active` slide * Tweak callout wording * Further prose tweaks move the sentence about not double-initialising autoplaying carousels to the callout right at the top instead of talking about `data-bs...` attributes, talk about the "option" instead, as authors may be setting these not via data attributes, but at instatiation time with options in the constructor remove the incorrect statement about pausing when keyboard focus is in the carousel * Instantiate/initialize all non-autoplaying carousels in docs pages * Rewrite/reorganise carousel docs page * start with static/non-autoplaying examples * explicitly mention that carousels currently need to be manually initialized * split out and explain autoplaying and the weird "autoplay after first interaction" behaviour, as well as the pause on hover/focus * Add callout about autoplaying and accessibility * Don't have the dark variant example autoplay * Add "autoplaying" to cspell custom dictionary * Tweal wording, move Page Visibility API to autoplay section * Tweak explanation for methods, add line break in js code for consistency with last code block on the page * Tweak method descriptions * Tweak headings (plural "carousels") * Move some paragraphs out of intro and into basic example, reword the nested and accessibility paragraph * Tweak warning about `.active` slide * Tweak callout wording * Further prose tweaks move the sentence about not double-initialising autoplaying carousels to the callout right at the top instead of talking about `data-bs...` attributes, talk about the "option" instead, as authors may be setting these not via data attributes, but at instatiation time with options in the constructor remove the incorrect statement about pausing when keyboard focus is in the carousel * Fix relative link * Update site/assets/js/snippets.js Co-authored-by: GeoSot <[email protected]> * Fix snippet.js * Tweak content organisation just a bit Co-authored-by: GeoSot <[email protected]> Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Mark Otto <[email protected]>
2022-11-28Rework progress bar markup and styles (#36831)Patrick H. Lauke5-80/+145
* Rework progress bar markup and styles Logically moves the various `role` and `aria-` attributes to the `.progress` element itself, leaving the `.progress-bar` to be used purely for the visual presentation. This fixes the problem #36736 that in certain browser/AT combinations, zero-value/zero-width progress bars are completely ignored and not announced. For multiple/stacked progress bars, this PR introduces a new wrapper and class `.progress-stacked`, to accommodate for the fact that with the more logical structure above, we need full `.progress` elements with child `.progress-bar` elements, and can't get away with the fudge we had before of having a single `.progress` with multiple `.progress-bar`s. Note that the old markup structures still work with this change, so this could be considered a non-breaking change - though one we definitely want to highlight as it's more accessible (as it now guarantees that zero-value/zero-width progress bars, whether on their own or as part of a multi/stacked bar, are actually announced) * Add a note about progress bar change in migration guide * Add notes with old markup examples and explanation * Fix bundlewatch * Update site/content/docs/5.2/components/progress.md Co-authored-by: Julien Déramond <[email protected]> * Reintroduce deleted styles Turns out they're needed for correct positioning of text inside progress bar * Move changes in markup to Migrationg guide, link to that from top of progress page, rewrite some content * Fix typo in callout * Clarify "Sizing" section * Remove redundant "now" Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Mark Otto <[email protected]> Co-authored-by: Mark Otto <[email protected]>
2022-11-28Docs: Add black text/background examples (#37538)EricDunsworth2-1/+3
These classes have existed since 5.1 but weren't previously documented. Specifically: * .text-black * .bg-black * .bg-black.bg-gradient Co-authored-by: Mark Otto <[email protected]>
2022-11-28Add dark mode support (#35857)Mark Otto36-169/+1013
* Add dark mode to docs * Minor fix: missing space indentation * Minor fix: revert utilities/z-index added-in modification * Remove prev: and next: from doc because extracted to another PR * Use .bg-body-tertiary in all Utilities > Overflow examples * fix example * Fix up spacing examples * Update box-shadow Sass variables and utilities to auto-adjust to color modes * Remove unused docs class * Refactor form styles to use CSS variable for background images on .form-check and .form-switch * Fix docs selector * Rename shortcut for clarity * Heading consistency * Reintroduce missing 4th grid item in Utilities > Spacing example * Fix bundlewatch * .bd-callout* rendering is OK so removing comments in the code * Update scss/_utilities.scss Co-authored-by: Julien Déramond <[email protected]> * Fix gutters example styling * Fix text colors on background utils docs * redesign and fix up position marker example, which doesn't show nicely in darkmode but at least isn't broken * fix some color utils examples * Deprecate mixin notice * Deprecate notice for list-group-item-variant() mixin * Revamp new link CSS vars * Use map-keys in some each Sass files * Remove list-group-item-variant mixin ref in sass loop desc * Display CSS vars scoped to our built-in dark mode * Revert previous commit * Fix list group variant link * Fix typo * Remove imports of alert/list-group mixins in scss/_mixins.scss * Small formatting + comments removal in scss/_content.scss * Fix alert links colors * fix dropdown border-radius mixin * fix link color and underline again, this time using CSS var override for color var and fallback value for the underline * fix colors on docs navbar for dark mode * remove two changes * missing ref * another link underline fix, just use sass vars for link decoration for now * missing color bg docs, plus move dropdown override to scss * more changes from review * fix some examples, drop unused docs navbar styles, update docs navbar color mode to use mixin * Few fixes around type - Restored CSS variable for color on headings, this time with a fallback value - In conjunction, restored and wrapped the default CSS var with a null value check - Split headings and paragraphs docs in Reboot, elaborated on them * Restyle custom details > summary element in docs * Rewrite some migration docs * fix form checks * Fix up some navbar styling, tweak docs callout * Fix select images, mostly for validation styling * Clean up some migration notes, document some new form control CSS vars, mention new variables-dark in sass docs * Update site/content/docs/5.2/components/scrollspy.md Co-authored-by: Julien Déramond <[email protected]> * Apply suggestions from code review Co-authored-by: Julien Déramond <[email protected]> * mention form control css vars in migration guide * Tweak grid and flex docs background examples * clarify some docs * fix some more things Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Julien Déramond <[email protected]>
2022-11-25Docs: fix typo in Navbars example (#37535)Christian Oliff1-1/+1
2022-11-15Grid Gap Updates (#37413)Daniel Raymond1-7/+34
* Grid Gap Updates - added column-gap - added row-gap * Grid Gap Updates * Bundlewatch update * Apply suggestions from code review Co-authored-by: Daniel O <[email protected]> Co-authored-by: Mark Otto <[email protected]> Co-authored-by: Mark Otto <[email protected]>
2022-11-14Update input-group.md with form text example (#37406)Ryan Mortier1-4/+7
* Update input-group.md with form text example This updated example shows where to correctly put form text (i.e. not inside the input group). * Fix markup * Update input-group.md Co-authored-by: Mark Otto <[email protected]>
2022-11-14Docs: fix margins between cards in examplesJulien Déramond1-4/+4
2022-11-14Docs: Make added-in badge page-level for z-index utilities (#37491)Mark Otto1-3/+1
2022-11-12Docs: use `<button>` for dropdown/popover examples, explain preference over ↵Patrick H. Lauke3-13/+13
`<a>` for dropdowns, tweak collapse prose (#37432) * Expand dropdown explanation for use of `<a>`, use `<button>`s for modal examples * Remove redundant `role="button"` from collapse test `<button>` elements * Tweak language * Tweak collapse prose
2022-10-30Docs: Slightly improve tooling setup descriptionJulien Déramond1-1/+1
2022-10-30Change title of color-background.md pageMark Otto1-1/+1
Fixes #37342
2022-10-29Update z-index.mdjonnysp1-4/+4
changes the example. so that the effect can be seen.
2022-10-29Fix disabled floating labels and add some examples of it in the docs (#37299)Julien Déramond1-0/+28
* Fix disabled floating labels and add some examples of it in the docs * Add disabled custom height textarea
2022-10-29Font style utilities did not contained "-style-" in BS4 (#37361)Jeldrik Hanschke1-1/+1
* Font style utilities did not contained "-style-" in BS4 * Update site/content/docs/5.2/migration.md Co-authored-by: Mark Otto <[email protected]>
2022-10-26docs: remove moot newlines (#37379)XhmikosR1-1/+0
2022-10-25Markdownlint fixes (#37255)XhmikosR10-11/+10
2022-10-25Docs: use 'added' page information to display a tag on top of the pages (#37341)Julien Déramond1-2/+0
2022-10-22Add `z-index` utilities, `.z-*` (#37317)Mark Otto1-0/+46
* Add z-index utilities, .z-* * Fix missing comma in _utilities.scss * Fix bundlewatch * Fix lint * Update site/content/docs/5.2/utilities/z-index.md Co-authored-by: Julien Déramond <[email protected]> * custom appearance * linter Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Julien Déramond <[email protected]>
2022-10-22Update navbars example to include a centered nav with utilities (#36523)Mark Otto1-0/+34
* Update navbars example to include a centered nav with utilities * Update site/content/docs/5.2/examples/navbars/index.html Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: Julien Déramond <[email protected]> Co-authored-by: XhmikosR <[email protected]>
2022-10-16Docs: organize callouts in partials (#37320)Mark Otto24-36/+36
2022-10-12docs: fixes text buttons to match behaviorCatalin Zalog1-2/+2
2022-10-12Doc: add Sass vars for switchesJulien Déramond1-0/+6
2022-10-12Docs: standardize usage of `<kbd>`Julien Déramond4-5/+5
2022-10-12Improve example of .flex-wrap and -reversenaitsirch1-30/+28
The current example of `.flex-wrap` and `.flex-wrap-reverse` does not really show the difference between those two utilities, because every item is labelled 'Flex item'. With the added numbers it is more clear what happens and how `.flex-wrap-reverse` works.
2022-10-06Utilities for overflow and object fit (#36848)Daniel Raymond2-0/+120
* Added "overflow-x" and "overflow-y" - Having the same properties as overflow but for just the x and y axises - Usecase being I want my y axis to be scrollable but not my x axis - E.g a card with a vertical list of items. * Added "object-fit" utilities - The CSS object-fit property is used to specify how an <img> or <video> should be resized to fit its container. - A responsive alternative to using background-img for a resizable fill/fit image. * Updated documantation for the overflow utilities - Now includes docs for `overflow-x` and `overflow-y` utilities * Placeholder shortcode updated - Can now choose to render an img tag or svg - The image contains a base64 svg generated within the template - example shortcode updated to detect, replace and render preview of 'img' tags as well * New documentaion for Object Fit added - Documentation added for the 'object-fit' util * Updated spell checks issues * Update object-fit.md * Update overflow.md * Update object-fit.md * Updated markup to address HTML Validation Errors - error: Bad value for attribute "src" on element "img": Illegal character in scheme data: space is not allowed. - info warning: Self-closing tag syntax in text/html documents is widely discouraged; it's unnecessary and interacts badly with other HTML features (e.g., unquoted attribute values). If you're using a tool that injects self-closing tag syntax into all void elements, without any option to prevent it from doing so, then consider switching to a different tool. * Updated Fix - Added Legibility to the img markup (example.html) - Fixed issue with example not working properly (because image closing tag no longer has "/>" ) * update values by step of 0.25 in bundlewatch.config The following values in .bundlewatch.config.json have been updated: - ./dist/css/bootstrap-utilities.css - ./dist/css/bootstrap-utilities.min.css - ./dist/css/bootstrap.css - ./dist/css/bootstrap.min.css Co-authored-by: Daniel O <[email protected]> Co-authored-by: Mark Otto <[email protected]>
2022-10-06Fix button hover color in cover exampleJoão Tomás2-4/+4
Replaced .btn-secondary class with .btn-light
2022-10-06Rename examples CSS/JS files for consistencyJulien Déramond17-11/+11
2022-10-04Correct typo in documentation for hiding elements (#37250)franko5531-2/+2