Update authors and copyright to match npm, add repository reference. Also incorporates licensing expression change by @vanillajonathan (#37378)
Co-authored-by: Jesse Mandel <jesse.mandel@jdpa.com>
- add `sr-only` "Bootstrap", which will be part of the accessible name
- extra `sr-only` text to give some context - that the dropdown is about switching versions
- remove the redundant id/aria-labelledby for the dropdown
- change the control from `<a>` to `<button>`
* Manually backport 32630
Dynamic tabs: use buttons rather than links
* Tweak unit test
* Tweak unit tests
* More tweakage
* show() should also bail if `disabled` attribute is set
* Tweak tests
* Simplify test for relatedTarget
* Temporarily remove problematic test
(as i can't get local tests to run just noww)
* Revert previous
* test: fix broken test cases for tab.js
* test: fix role=tablist invalid on nav element
* test: prefer <div/> over <div></div>
* Manually backport 32630
Dynamic tabs: use buttons rather than links
* test: fix broken test cases for tab.js
* Fixes
* Remove and ignore lock file
Co-authored-by: alpadev <alpa.muc@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
Co-authored-by: Mark Otto <markdotto@gmail.com>
This is a backport from BS5 to BS4.
As per https://github.com/twbs/bootstrap/issues/35553
The ```small-font -size``` will actually increase from ```13px``` to ```14px``` with this proposed change. Personally I'd prefer keeping it the BS5 way (```14px```), as the text is more readable now.
If it's needed, I can do another PR with the ```$small-font-size: .8125rem !default;``` to resemble BS4 more closely but I feel like this would be a move forward even for BS4.
manual backport of #34886
per https://www.w3.org/TR/html-aria/#docconformance
> It is NOT RECOMMENDED to use `aria-disabled="true"` on an `a` element with an `href` attribute.
>
>NOTE
>If a link needs to be "disabled", remove the `href` attribute.
This PR removes the unnecessary `href="#"`, `tabindex="-1"`, and `aria-disabled="true"` from disabled links in both docs pages and examples. `aria-disabled="true"` *is* kept for disabled link-based buttons (that have `role="button"`) as there it's appropriate to use (you *want* to convey to assistive technologies that this thing you're claiming is a button is also disabled at the moment)
Further, the PR extends the "Link functionality caveat" to show the "proper" way (removing `href` and adding `.disabled` class only) to disable a link, but then explains what to do if that's not possible (and then keeps an example with all the traditional `href="#" tabindex="-1" aria-disabled="true"`, but explains clearly that it's not ideal). Same sort of explanation is also added to the pointer event utilities page
In case of a modal with fading enabled, a prevented show event can cause show to not showing the modal anymore.
See #34055
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* 🐛 Enable `0.x` with negative margins @ v4
I set it as below, but no negative margin was added.
`$spacers: (0\.5: ($spacer * .125));`
After investigating, it seems that `0 \ .5` is also evaluated as 0.
So I changed it to string comparison.
HTML example: `<img class="mt-n0.5">`
* 💚 Clear CI errors
`aria-haspopup="true"` is really intended to signal that an ARIA `menu` will be opened on activation. as a result, some assistive technologies will announce controls with `aria-haspopup="true"` as a menu or menu item (e.g. JAWS and NVDA).
In addition, `aria-haspopup` seems to trigger a bug in Edge/Narrator where the `aria-expanded` state is not correctly announced at the moment when `aria-haspopup` is present.
This now makes the dropdown button more like a generic disclosure widget control - see also https://www.w3.org/TR/wai-aria-practices-1.2/examples/disclosure/disclosure-navigation.html01
* switch to async/await
* remove shelljs
* switch to globby; supports .gitignore out of the box
* don't write any files to the disk if they are indentical
* add two more cmd switches: --dry and --verbose
* strip leading "v" from version arguments so that we don't end up with duplicate `v`s
The `test` method on regexes does not behave like `match` on strings
for checks if the regex matches when the global modifier (g) is present.
Also adds a unit test on tooltips for sanitizing the same template twice.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* Add a callout for the sanitizer in popovers and tooltips
* Add second reference to sanitizer in the options
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Fixes#30131
Issue mentions `form-control` but it impacts `.custom-select` — but not `textarea` since it has a qualifying type selector that increases its specificty.
So another way could be to set `select.custom-select` and `input.form-control`. Would there be any other tag concerned by those classes?
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* Backport #32037
Add `.navbar-nav-scroll` for vertical scrolling of navbar content
* drop the css var for a Sass css
Co-authored-by: Mark Otto <markdotto@gmail.com>
* Backport of changes to v5 docs that updated and clarified information about the Sass compiler used and the minimum rounding precision we recommend with it.
Co-authored-by: Mark Otto <otto@github.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
They're links, acting as links. Just because they're styled as buttons visually (as is often the case for "Call to action" (CTA) links) doesn't mean they need/get `role="button"`
While technically it still works, we're already saying authors shouldn't do it later on, and we removed any examples of this. This was a straggler.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* v4: Add an actual `data-touch="false"` example in the carousel docs
Backport of https://github.com/twbs/bootstrap/pull/32638
* Remove data-ride from example carousel
* Correct attribute table explanation and remove slide class from example
i believe the correct option is `slide` here, not `ride`.
the `if "carousel"` bit was rather unclear/confusing
* Edits...
sorry, trying to make sense of our quirky carousel stuff, it seems some illogical things have been there ever since
* Add data-interval to suppress autoplay
* Tweak carousel options formatting
* Update site/content/docs/4.5/components/carousel.md
Co-authored-by: Mark Otto <markd.otto@gmail.com>
* Tweak language
mostly based on @mdo's suggestion, but also adds the word "attribute" after `data-ride` for better flow/legibility
Co-authored-by: Mark Otto <markd.otto@gmail.com>
Remove unnecessary `_getCustomClass` method.
`customClass` will be in the configuration already, even if it is provided in the data attributes, and jQuery's [`addClass()`](https://api.jquery.com/addclass/) method will handle it, either `this.config.customClass` is a function or a class name (even if it is a blank string).
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
When using single-quotes in config.yml, the previous
regular expression in build/generate-cli.js wasn't working correctly,
it was replacing ALL string values with hashes.
Now both double- and single-quotes can be used in config.yml,
and the RegExp will work as expected.
Also, allow trailing whitespaces and empty ("") values to be matched.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit includes all the needed workarounds and most changes from the main branch for everything to work, like:
* removing empty lines in raw HTML that break output
* read .browserslistrc, CSS variables from disk instead of duplicating it
* using Hugo mounts
* using Hugo for the docs CSS/JS
* move ToC Sass code to a separate file while adapting it for Hugo
Thus, this patch makes our npm scripts faster since lint runs on one step and there's no separate docs assets processing.
When starting a cycle for a carousel, it only checks for a default interval, and not an interval defined on the slide element via data props. This adds a check in before creating the interval to move to the next slide.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* Make docs anchorjs links darker on keyboard focus
Not just on mouse hover
* Update site/assets/scss/_anchor.scss
Co-authored-by: Mark Otto <markd.otto@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
* Update Edge's Rendering Engine on CONTRIBUTING.md
Also updated the URL to prevent a HTTP redirect.
* Add 'Go to "Help > Send Feedback" from the browser' note
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This basically brings back the previous behavior we had on Travis CI, where if the commit message included `[ci skip]`, BrowserStack tests didn't run.
Additionally, this allows skipping BrowserStack if the commit message contains `[skip ci]` too.
On Ubuntu, our native font-stack doesn't output the same font on Firefox and Chrome. This is [a known aliasing issue](http://fontfamily.io/sans-serif) — check at the bottom, Ubuntu 14.04. Ubuntu 18.04 (my current) doesn't use the same (Firefox uses Liberation Sans, Chrome uses the default system font Ubuntu).
I'm inclined to prefer Liberation Sans since it's closer to Arial / Helvetica. This patch already exists in Boosted, didn't notice it was missing in bootstrap until today…
BTW, our linked Smashing Magazine's system fonts post mentions this and is even more accurate since it targets the three major Linux distributions. AFAIK this is not needed since [Liberation Sans is available everywhere](http://fontfamily.io/Liberation_Sans) — but we might go back to `Oxygen, Ubuntu, Cantarell`if we want to stick to system fonts.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* feature(spinners): slow down spinners when prefers-reduced-motion
* docs(spinners): add reduced motion callout and mention slowing down in accessibility page
* Update spinners.md
* docs(accessibility): rewording
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Patrick H. Lauke <redux@splintered.co.uk>
* Fixed: Undefined mixin 'deprecate' when importing 'bootstrap-grid-scss'
* Updated: Mixin import moved down to feature together with others
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
- add unit test to count how many events are thrown when widget contains multiple tags inside label
- add a parameter to toggle, if click event is provided onto an input then don't trigger another change event already thrown by the browser
- simplify the case where toggle interface is called click provide from input itself OR it's a button without label. If label is present, then browser propagate click event from childrens through label and then cause multiple calls to toggle
- the test assumes that `.btn` class is always set onto the label if there's one, otherwise need to update this plugin and look for label around the input
Test with keyboard, mouse and js click call
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Closes#30835 by leaving a comment in the source that the escape-svg() function must have quotes around data URIs.
(cherry picked from commit 849fea5a1e)
Typo in box-shadow attribute, global variable used instead of local.
Co-authored-by: Arthur Shlain <artur.slain@gmail.com>
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* clear timeout before showing the toast
* Add unit test
* Remove the check for timeout
* Check for clearTimeout to have been called
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
# Conflicts:
# js/tests/unit/toast.spec.js
New default behavior for scroll anchoring (rolled out in Chrome 84?) leads to unsightly/odd accordion interactions - see #31341
This rule suppresses this new behavior and reverts back to the old way.
See https://drafts.csswg.org/css-scroll-anchoring/
* Expand advice for anchor-based controls
* Expand accessibility note in input group
* Correct statement about validation, fix server example
* Tweak label > accessible name
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
* Move color utility callouts to start of page
Hierarchically/structurally, in the position they are currently at, the two callouts seem like they "belong" just to the "background color" section. Moving them to the start makes it clearer that those two callouts relate to everything in the page (both "Color" and "Background color" classes.
* Change heading level
otherwise the assistive technology callout looks like it's hierarchically under the "Dealing with specificity" heading
* Make example less broken-looking
don't want to give impression that now it's ok to just sprinkle `role="button"` around. this at least makes the `span` keyboard-focusable, similar to at least the start of a custom control
Remove the class `.nav-item` from `.nav-link` inside the non `ul` or `ol` based navs.
This makes the consistency for `.nav-item` (This class will not be required on the `.nav-link`).
`.nav-item` was only required when you use `.nav-fill` or `.nav-justified` on the `.nav`. In other cases, it was redundant. And the purpose of `.nav-item` on `.nav-link`s can be achieved via flexbox utilities as well (Mentioned in the docs also).
* docs(example): drop IE workaround since it works fine in IE
* Serial comma
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Co-authored-by: Mark Otto <markd.otto@gmail.com>
* instead of stopping event if onclick is triggered on input, call toggle method only if its not on checkbox inside a label
* add unit test
* add a dedicated test to ensure click event is forward to label
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
For some reason, custom checks in CSS columns need a new stacking order to maintain visibility. This PR adds `z-index: 1` to trigger that new stacking order. Since v5's forms are being redone entirely, and we're dropping IE10/11 there, I think this is totally fine to ship with v4 only. Will need to check v5's forms it in Edge though.
Fixes#29607.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
While it might not be possible to invalidate the cache by changing test.yml, this should speed things up a lot due to `bundle i` taking most of the time.
- Adds .user-select-* utils from v5
- Adds button role attribute util, one of the top requested features in our issues for adding pointer cursors
- Adds new docs page to demonstrate both
- Includes Sass list for customizing user select
- Refreshes the look and feel of the homepage with fresh colors, new content, and simplified styles.
- Updates docs button styles
- Replaces bytesize icons with Bootstrap icons
- Adds themes callout to examples page
Cleans up some column classes to ensure things line up across all viewports. Also fixes some broken padding on the .navbar-brand.
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
* Fix spinner-grow animation
Safari seems to be interpreting the old keyframes animation as incomplete. Adding `transform` to the second frame seems to resolve the issue.
Co-Authored-By: Martijn Cuppens <martijn.cuppens@gmail.com>
This allows the minifier to mangle the constants. It also allows the linter to find unused strings properly.
While at it, remove a few unused properties.
File Before After Diff
--------------------------------------------------------
bootstrap.bundle.min.js 22.09 kB 21.13 kB -0.96 kB (-4.35 %)
bootstrap.min.js 15.4 kB 14.46 kB -0.94 kB (-3.86 %)
The HTML5 Boilerplate CSS has moved to a separate GitHub repo (h5bp/main.css) so the source link referenced here no longer works. This PR updates the link to the new correct location.
- Rename and move the variable to variables file
- Move code to the grid file
- Use the mixin to generate our own classes
- Wrap in a grid classes enabled conditional
- Document the mixin
Trying to find a new way to do responsive card decks while not locking ourselves into the cards themselves. My thinking here is we can easily control the column (.col) width by the parent, but I don't know how many we need (have 0-5 now) across each breakpoint. This works for cards so far, and I think could get us equal height, too.
* Follow-up to #29095
This PR fixes the responsive containers that were added in #29095, originally stubbed out in #25631. Apologies to @browner12 for getting that wrong.
Fixes#25631.
* update navbar as well because we cannot reset all containers uniformly
* Update navbars example to include container-xl example to ensure containers match
* rewrite responsive containers docs, add table of max-widths
* Update container docs
- Move table up to the intro
- Remove the container example because it's actually hella confusing
- Update and link to grid example as a demo instead
* create responsive containers
provide more flexibility and allow the user to determine when containers switch from fluid to fixed width.
* fix the base container code
this commit fixes the non-media portion of the generated CSS. I learned about the `@extends` directive and was able to put it to good use.
I create a new temporary map that contains all the main `$container-max-widths` and join it to our 2 special cases of 'xs' and 'fluid'. Then we loop through that and, with the appropriate infixes, extend our placeholder
* formatting for style
forgot to run my tests before the last push, i think these are better.
* finish incomplete comment
* fix the responsive containers
using the `@extend` directive I was able to clean up this code
* fix responsive containers in the navbar
mostly we just look through all of our breakpoints so we can include all of the responsive container classes in the tweaks we have to do for the navbar (redeclaring flex properties, don't double up on padding, etc)
* Simplify container extends
* Simplify navbar containers
* Rearrange, add comments, ensure everything is nested in $enable-grid-classes
* Reduce new CSS by using attribute selector
We avoid using `@extend` whenever possible, and this is more readable
* Update _grid.scss
* Update _navbar.scss
* Add docs for responsive containers, redesign the container layout page
* Add to the Grid example
* Ensure correct active class is set on button toggles/checkboxes/radios on page load
Sanity check, ensures that the UI visually matches the actual values/states of controls. Also ensures that if any autocomplete/autofill happened, this is visually accounted for
by having the correct class set.
Includes unit tests (and `autocomplete` has been removed from these as it's no longer necessary)
* Remove now unnecessary autocomplete attribute
As the attribute was there to force/ensure that the visual presentation matched the state, and this is now taken care of programmatically, there's no need to unnecessarily suppress autocomplete...let them autocomplete if they want to...
- adds more defensive checks to make sure no unnecessary toggling happens on disabled buttons; this also fixes an up-to-now undiscovered bug where a toggle button with `.disabled` class would still have its `aria-pressed` toggled
- adds a set of explicit tests for the above case of disabled buttons and `aria-pressed`
- remove a now irrelevant (or at least very nonsensical) test for `<label>` containing both an actionable and a `hidden` `<input>`
- expand the test for disabled checkbox to also explicitly test starting conditions (used mainly in my debugging)
- ensure that `$btn[0].click()` is used to click checkboxes in tests, rather than the `click()` on the jquery object which is simply a shorthand for `trigger('click')` and does not actually trigger the browser default behavior
- remove the `preventDefault()` from the button handling, which was preventing correct keyboard functionality for checkboxes/radio buttons
- add extra logic to the button.js code to handle checkboxes correctly and avoid double-triggering as a result of mouse interactions (which saw the checkboxes being toggled twice, thus returning them to their original state)
- add logic that prevents the `checked` property from being added incorrectly for any inputs other than radio buttons and checkboxes
- added more tests (including the most basic test for a properly triggered fake checkbox button)
- work around Firefox bug #1540995 (which this code was hitting after removing the `preventDefault()`, due to Firefox's incorrect toggling of disabled checkboxes when programmatically (but not manually) activated with a `click()` event
- Add same advice about keyboard/AT handling to popovers as a callout; also add information about not adding excessive content or interactive controls (and the suggestion to opt for a modal)
- Tweak the tooltips callout for consistency
Extrapolates the previously used selector into a new mixin that only generates valid CSS by creating psuedo-classes for `valid` and `invalid`, and nothing else.
Fixes#28380.
* Fix buttons :focus state styles
Buttons :hover and :focus state shares styles.
Buttons :focus text color on 'a.btn' is now consistent with others '.btn'.
* `:focus` styles should be in sync with `.focus`.
So shared styles with hover were copy to focus definition. Rather then using
`hover-focus` mixin which do not contain `.focus`.
instead, only apply outline suppression if the browser wouldn't normally apply the focus outline, using the (currently experimental) `:focus-visible` pseudo-class
Negative margin example wasn't displaying correctly due to border and background styling being applied directly to the `.col` element. Made a child element and applied the styling to it
* update border-radius mixins
Add $enable-rounded as a keyword argument to border-raidus mixins
* Update rounded classes
- use border-radius mixins to repleace !important
- use true for $enable-rounded for rounded classes
- Add `.rounded-sm` and `.rounded-sm` #27934
* update borders docs
* Revert touch of dist files
* Revert change of border-radius mixins
* use !important in border-radius utilies classes
* update border radius classes keep only rounded-lg and rounded-sm
In a scenario where `$input-line-height` or `$input-font-size` are different than `$input-btn-line-height` and `$input-btn-font-size` the final `$input-height-inner` was wrongly calculated.
Alternate take to #27683 that builds the modifier class based on min-width, such that list groups are stacked until the class's breakpoint is reached. This is less verbose, matches our primary responsive approach, and prevents an extra class. Unfortunately, I believe supporting flush list groups is too much code here, so I've skipped that and made a note in the docs.
Also added examples generate from our breakpoints data file with a protip for how to do equal width items.
* Add variable for dropdown-divider-margin-y
For us to reassign the nav-divider-margin-y variable here, we have to rearrange some of the variables.
Fixes#26660.
* bump bundlesize
With the current styles, it is not possible to nest a popover inside of
another popover if they have different placements because the arrow
styles of the parent popover will conflict with the arrow styles of the
child popover.
- Move 4.1 docs to 4.2
- Update versions everywhere to 4.1.3 with release script
- Manually bump the shorthand version in package.json
- Add 4.2 to the versions docs page
- Update some redirects
- Fix tests asset URLs
- Bump Nuget and more
* SVG accessibility fixes
- add `focusable="false"` to all SVGs, to stop IE from including the `<svg>` in its default focus cycle
- completely hide decorative SVGs using `aria-hidden="true"`
- add `role="img"` to meaningful/"content" SVGs, ensure they have an appropriate `<title>` and/or `aria-label`
- simplify placeholder default title
* Simplify usage of placeholder.svg in the docs
- in most cases, no need for separate/redundant text and title (now that we make text itself part of the alternative text explicitly)
- no need (expect in rare cirumstances) to describe the placeholder image (unless the look of the image is important/the actual content, as is the case with the image thumbnail class)
* Simplify example.html rewriting of <svg> to <img> code sample
- as the `alt` for the placeholder isn't really important, just add an ellipsis instead (otherwise, to be correct, we'd have to construct the whole "title+text" construct like we do now in the
placeholder.svg itself
* Change svgo configuration to retain role attribute and add/force focusable=false
- regarding `focusable=false`, see https://github.com/svg/svgo/issues/1011 (which would be the "proper" SVGO fix) and the (hacky) solution https://github.com/svg/svgo/pull/817
Edge/Mobile appears to have moved support for `-ms-viewport` behind a flag at some point, instead supporting meta viewport directives.
Removing this altogether also fixes issues in IE11 on high-dpi displays - see https://github.com/twbs/bootstrap/issues/21780
The default font weight value for <strong> <br> in reboot was
set by a fixed value we now use the variable $font-weight-bolder
to let users override this value.
Callouts are already excluded from ToC, but due to a limitation in jekyll-toc they are still being included.
We should revisit this if the bug is fixed later.
* prevent text selection for floating labels
* expand the click target by no selecting the label text
* use `pointer-events: none;` instead of `user-select`
* thx @MartijnCuppens
The latest (2.6.2) docsearch.js version now displays results as standard `<a href>` links, allowing users to `ctrl`-click on them to trigger default browser behavior of opening in a new tab.
To maintain backward compatibility, this behavior has only been enabled to users that didn't define their own `handleSelected` method.
This PR updates your `docsearch()` code to take advantage of the new `<a href>` template, by removing your custom `handleSelected` and moving its behavior to the `transformData` call. Namely, what you wanted to avoid was jumping to the first `<h1>` of the pages, which would prevent users from seeing the header. This PR checks if the suggestion targets the `#content` anchor (meaning it goes to this first `<h1>`) and remove it.
Behavior should be the same, but at least now you can enjoy the `ctrl`-click :)
- Add headings to examples section
- Clarify styles and customization options in examples
- Add dismiss buttons to all toasts
- Missing period added for consistency
- Update roles, tweak text
this is the opposite of `.text-nowrap`, and a forces elements to wrap onto new lines.
One use case for this is extra long button text. Bootstrap buttons by default do no wrap, so this class could be used to override that behavior.
* Tweak the accessibility/reduced motion text
include mention of carousel slides, remove the (now inaccurate, as Firefox 63 includes it too) mention that support is limited to Safari/macOS
xref https://github.com/twbs/bootstrap/issues/27525
* Add new callout for reduced motion
* Add variable to control prefers-reduced-motion media query support
* Add callout about prefers-reduced-motion to all components currently using animation which are affected
Having variables initialised from start `_isTransitioning` is better.
Would be better to add an eslint rule to check for undeclared variables use.
Reordered enter checks for `show` and `hide` by priority.
This change follows exactly what was done for the `$grays`, `$colors`, and `$theme-colors` lists in #23260. This allows for easy addition of new breakpoints or grid containers also.
The current documentation for .flex-fill indicated that the flex
items would have equal widths, regardless of content. This update
ensures that the documentation reflects the fact that the width
of the flex items depends on their actual content.
When gradients are enabled there is still a hover state on disabled
buttons since the hover rules apply to background-image and disabled
rules apply to background-color. This applies the logic already present
in dropdowns to buttons. This fix was originally proposed by @ysds.
Firefox currently seems extremely fickle - with `pan-y` if fires pointercancel as soon as a touch strays even a pixel or so vertically.
While `touch-action: pan-y` would be ideal (allowing users to scroll the page even when their finger started the scroll on the carousel), this prevents a swipe that isn't perfectly/only horizontal to be recognised by Firefox.
In the event that the content is larger than the image, the content will continue to be displayed outside the image itself. There are some workarounds but they apply only to browsers that support this option and IE11 is not one of them.
Blockquote footer font size is currently hardcoded to 80%, implying (in a comment) that this would result in the default font size. However, since the blockquote font size itself is variable, this is not necessarily true, and 80% of anything actually results in an arbitrary font size.
80% as a default is still fine.
* add 'lighter' and 'bolder' font weight classes
these are 2 special values for font weight, that will give their content a font-weight value of 100 more or less than their inherited font-weight.
probably doesn't fully fulfill this issue, https://github.com/twbs/bootstrap/issues/23969, but it's a start
* Update .stylelintrc
* add 'lighter' and 'bolder' variables per @mdo 's request.
* Redo input height on .form-control
- Use the already present -height variables on .form-control
- Consolidate the select size and multiple overrides into the .form-control base class instead of sm/lg modifiers
- Remove the Sass extends from input groups since it picks up too many selectors
* Prevent height on textareas
* Fix focus box shadow of custom ranges
* Put `:focus` selector right after `.custom-range`
* Remove unnecessary `outline: none`
* Fix box-shadow issues in IE/Edge
* Better align
* Fix thumb vertical positions in IE/Edge
* Fix incorrect formula of thumb vertical positions in Webkit
* Fix an incorrect comment
* Fix incorrect box-shadow-width
Now `.custom-control` will have height equal to `$font-size-base`
Fix custom checkbox and radio top position (we can't subtract rem from unit)
`$line-height-base - $custom-control-indicator-size` is not valid
Because `$line-height-base` is a unitless variable and `$custom-control-indicator-size`
is a unit (rem) variable
- Updates nodemon scripts to watch specific directories instead of ignoring several
- Split watch tasks for CSS and JS into main and docs
- Add docs-watch script to serve the docs instead of just build
- Add new start script so that instead of two tabs, one for docs-watch and one for watch, we just run npm start
With the current docs directory setup, I'm making too many mistakes and have to manually address path changes and directory moves on deploy. This makes for a frustrating experience developing locally and shipping releases. With this PR, we're basically back to the same setup from v3—duplicating the dist directory into our docs directory. Not the most ideal, but very straightforward for me as the release manager.
- Only applies to textual inputs and textareas with `.form-control` and selects with `.custom-select`
- Wrap the feedback icons in a Sass variable option, $enable-validation-icons, so folks who theme can disable
- Update docs to summarize styles, mention the icons, include a textarea demo, and add mention of the Sass variable option to the Theming section
The 'Floating labels' example is only supported on Chrome, Safari and Firefox. On Edge and IE the label is displayed always and any text input overlaps the label which makes it unreadable.
The fix here targets Edge and IE and makes the form behave normally, the labels are hidden and the placeholder color is standard.
- Fixes#25656 where custom selects had the wrong focus shadow
- Fixes#26668 where custom selects had no inset shadow (also closes#26572 which had the wrong form classes on the first example anyway)
Downgrade bundlesize until they make brotli optional since it doesn't work with node.js 10.x yet.
So, babel, qunit/karma-qunit and bundle-size aren't the latest versions.
By applying the transition: CSS property only to classes that are
active during sliding, we avoid an unnecessary, non-zero-time
animation that although mostly invisible, does interfere with e.g.
z-index based parallax
* Doc update - remove media-breakpoint-up(xs)
If media-breakpoint-down(xl) is not listed, then media-breakpoint-up(xs) does not need to be listed either.
The above 4 media queries are now aligned with the 4 media-breakpoint-up mixins (just like their media-breakpoint-down counterparts).
* Improve media-breakpoint-up/down docs
`<dialog>`, in browsers that support it, has user agent styles of `dialog { display:block; ...} dialog:not([open]) { display:none; }`
by forcing it to `display:block` in the shim, the dialog is shown even when closed. There's no clean way to shim this for non-supporting browsers,
but arguably these browsers would have further problems with pure `<dialog>` usage anyway, and it's up to authors to then use different elements/shims.
* update docs path from docs/4.0/ to docs/4.1/
* bump version to 4.1.0
* Update redirects to work for 4.1 docs move
* Update docs version switcher to include latest and link to 4.0 docs
* re-run dist
* Update package-lock.json
* Update docs-navbar.html
- Replaces CSS variables with their appropriate hex values
- Fixes the broken navbar transition by moving from 2D translates to using position
- Fix broken IE navbar toggler placement with some utilities (not necessary anywhere else, but necessary given flexbox quirks)
* Update Dashboard example
- Replaces .sticky-top on .navbar with .fixed-top
- Adjusts padding on main content area and sidebar to account for fixed navbar
- Move to padding in sidebar instead of top: 48px; fixes Firefox rendering issue
- Adds new .shadow utility for a little extra cherry on top
- Moves sticky styles to separate feature query ruleset to avoid IE rendering issues
* Add .w-100 to chart to fix IE horizontal scroll from label that extended past viewport
1. It's == "it is"
2. The subject of the sentence is "Only one" (not "these") so the verb must agree with it.
Feel free to do nothing with this change, use it, etc - I just saw this while reading through the code.
Removes the .justify-content-between from a navbar form example given it's the default style. Instead, mention how to adjust this and link to flex utils.
* Making use of `prefers-reduced-motion` media query
As discussed in #25249 - if a user (Who is using Safari / iOS) requests
reduced motion in their system settings, we should avoid transitions.
* Ignoring prefers reduced motion for CSS Linting
* Updating copy clarifying the reduce motion functionality in accessibility.md
Rely on `site.url` which is different for production. In that case do nothing with the search result, otherwise when in development remove our url from it.
Running `./build/change-version.js v4.0.0-alpha.6 v4.0.0` fixed this,
so the version change script works fine. I'm presuming instead this
change was just omitted from 35f80bb12e, and then wouldn't have
been caught by subsequent runs of `change-version`, since it only
ever replaces the exact old version string specified.
* Tell where to find the variables to override
* Be consistent with path to _variables.scss
* Get rid of some 'our' in the doc
Replaced by 'Boostrap's' when relevant
* added the styling
* added the documentation
* update for one rule per line
* fix hound error: trailing whitespace
* trimmed off vendor prefixes
* Add note about track and thumb
* Psuedo-elements must be split across multiple rulesets to have an affect
* Fix firefox inner focus
* Seems that FF is the only one affected by this
* Add support for gradients
* Add labels, clarify min/max changes
* add step example
* add custom range vars
* Expand/clarify recommendation for using custom validation styles
Seems support for correctly announcing browser default navigation bubbles/notifications has improved recently. Now it seems only Chrome (at least on Win and Android, not tested on macOS) is the odd one out.
However, we should really make sure the custom validation messages are also tied correctly to their relevant form controls - need to dig out the PR that will ensure that.
* Add note about resetting form appearance after submission
xref https://github.com/twbs/bootstrap/issues/25626
* Move helpful code comments
* Add .carousel-fade option to Sass
* Document example of the fade carousel
* more logical warning of the .active class on carousel items
Currently bootstrap only provides 4 variations of `width` and `height` css utilities, which are:
1. 25%
2. 50%
3. 75%
4. 100%.
Here, I'm adding `auto` to the list. This is useful when we need to reset the width/height value
back to the browser default value at some point.
Removed '**Animated progress bars don't work in Opera 12**—as they don't support CSS3 animations.' note.
Bootstrap 4 doesn't (and doesn't need to) support the ancient Opera 12 released in 2012 with a 0.04% marketshare so no need to mention.
* Prevent print utils from overriding all other display utils
Fixes#25221.
I agree with the referenced issue—this is unexpected and also causes a serious bug when mixed with other utility classes. This wasn't an issue in v3 given we had different utilities for hiding that weren't focused on display property.
* Add printing changes to migration docs
* unrelated heading sentence case change
* List out all .d-print- classes
When changing `$input-border-width`, `$input-height-border` does not change and `select.form-control` `custom-select` `custom-file` will still have `$input-height` which is resolved from `$input-btn-border-width`
This will work in cases when want controls with border, and buttons without.
Temporary fix will be to override 2 variables
```
$input-border-width: 2px !default;
// which is
// $input-height-border: $input-btn-border-width * 2 !default;
$input-height-border: $input-border-width * 2 !default;
```
* fix cover nav
* Improve signin visuals and alignment with that flexbox love
* rewrite cover example in flexbox
* lighten signin bg
* first pass at pricing example
* redo examples index with data file
* tighten up spacing a bit
* update navbar descriptions
* link pricing
* move that back
* property order
* Fix test errors.
* Compress pricing.png.
* add form validation example
* remove that
* rename that
* restyle and space out
* fix errors
* change order
* cleanup album css and styles
* tweak examples index
* make it a badge
* options
* improve sticky footer alignment
* redesign example index
* brand new blog layout
* start new screenshots
* new product example page a la apple
* add email field
* fix linter, remove unused blog css
* hook up feather icons to start
* redo dashboard
* fix linting
* add floating labels example
* formatting
* formatting
* lint
* fix values on select
* optional input, plus input group
* new dashboard image
* start to reboot the offcanvas example
* updated images
* new offcanvas mostly implemented
* linting
* edit description
* more description changes
* - Add vertical margin to album hero buttons for when they're stacked
- Adjust font-size and padding for pricing header and hero
- Fix checkout's stacked column margins, plus update their check/radio
markup
- Update product's utilities to be responsive
- Made blog cards somewhat responsive (needs a bit more work tbh)
* drop leading zero
* more linting
* swap empty images for holder, fix border
* dist the docs
* navbars have no margin-bottom to begin
* add css var, tweak padding for mobile
* comment headers
* nix commented out code
* nix the navbar structure for a custom one, stack it on mobile
* tweak heading button group for mobile
* Removed narrow jumbotron and justified nav examples as these are easily accomplished with new components in v4
* improve card sizing on pricing
* update and compress
* Use `$component-active-bg`, `$component-active-color` in custom-control-indicators and pagination for checked, indeterminate, and active states
* Button and Forms focus colors should be based on `$component-active-bg`
When using the `media-breakpoint-between` or `media-breakpoint-only`
mixins with a custom breakpoint map – not defined as `$grid-breakpoints`
– the mixin incorrectly defaults back to the global `$grid-breakpoints`
map in certain situations. This commit correctly passes on the
`$breakpoints` argument to the other mixins called within the block.
* Deprecate hover media query shim and mixins
Fixes#25195.
This never was completed or fully implemented, and the docs are inaccurate as to what browsers are currently affected by this stickied hover problem. This PR aims to update the docs and deprecate the shim from our mixins and only return the pseudo-classes. To reflect the order of these states used elsewhere (e.g., our button styles), I've also updated the order of each within the mixin.
* Mention in docs and variables that it's deprecated
The latest shipping version of Edge supports position: sticky and I've successfully tested it with Bootstrap 4 and it works as intended. I added IE10 in place of Edge in that note as I assume that IE10 also has the `position: relative` fallback.
REF: https://caniuse.com/#search=sticky
* Add min-width to body when printing
This should address some inconsistencies between browsers when printing. It applies a min-width to the body so that the content better resembles what your might see on your screen. I've made it a variable for easy customizing, too.
* Don't underline buttons when printing
* Add basic print styles for page and body size to create a semi-consistent print experience across browsers
* Add additional form validation examples
Fixes#24811.
This adds .valid-feedback to our custom styles and server side examples; previously we ommitted this to suggest you don't always need valid feedback. In addition, this adds examples of the .{valid|invalid}-tooltip classes with a new subsection in the Validation docs.
* Update validation tooltip styles to remove fixed width; instead should retain itself to the parent element
* update ids
* finish docs paragraph, mention position: relative
- Drops the hover-focus mixin for standard :hover
- Adds explicit :focus styles to match button, input, etc with a box-shadow
- Adjusts z-index values to ensure the layers go initial, hover, active, focus
Fixes#24838.
The append and prepend classes vertically aligned items in the center
For textareas this meant the addon would aling vertically instead of stretch and have it's contents vertically aligned
these changes fix that so everything is aligned how it should be
This commit allows nested structures for accordions. Also a part of
the documentation about data-children is removed because this
functionality didn't work and it's not applicable anymore.
Tests with the collapse accordion are also a bit adjusted to the new
situation.
The download link for Entypo (on its website) is invalid. It's a Dropbox link which now results in a 403 error. The website was last updated in 2015 (as seen in the footer).
"Choose file ..." text is now written inside the label tag, so the translation is outside the css scope.
$custom-file-text variable should only contain "Browse" translations.
Closes#23319. Both `.text-muted` and `.btn-outline-secondary` (and indeed all secondary items) make use of `$gray-600`. New value provides a contrast ratio of 4.69.
@@ -18,14 +18,15 @@ the preferred channel for [bug reports](#bug-reports), [features requests](#feat
and [submitting pull requests](#pull-requests), but please respect the following
restrictions:
* Please **do not** use the issue tracker for personal support requests. Stack
Overflow ([`bootstrap-4`](https://stackoverflow.com/questions/tagged/bootstrap-4) tag), [Slack](https://bootstrap-slack.herokuapp.com/) or [IRC](README.md#community) are better places to get help.
* Please **do not** use the issue tracker for personal support requests. Stack
[Slack](https://bootstrap-slack.herokuapp.com/) or [IRC](/README.md#community) are better places to get help.
* Please **do not** derail or troll issues. Keep the discussion on topic and
respect the opinions of others.
* Please **do not** post comments consisting solely of "+1" or ":thumbsup:".
Use [GitHub's "reactions" feature](https://github.com/blog/2119-add-reactions-to-pull-requests-issues-and-comments)
Use [GitHub's "reactions" feature](https://blog.github.com/2016-03-10-add-reactions-to-pull-requests-issues-and-comments/)
instead. We reserve the right to delete comments which violate this rule.
* Please **do not** open issues regarding the official themes offered on <https://themes.getbootstrap.com/>.
@@ -57,15 +58,14 @@ Good bug reports are extremely helpful, so thanks!
Guidelines for bug reports:
0.**Validate and lint your code** — [validate your HTML](https://html5.validator.nu/)
and [lint your HTML](https://github.com/twbs/bootlint) to ensure your
0.**[validate your HTML](https://html5.validator.nu/)** to ensure your
problem isn't caused by a simple error in your own code.
1.**Use the GitHub issue search** — check if the issue has already been
reported.
2.**Check if the issue has been fixed** — try to reproduce it using the
latest `master` or development branch in the repository.
latest `master` or `v4-dev` branch in the repository.
3.**Isolate the problem** — ideally create a [reduced test
case](https://css-tricks.com/reduced-test-cases/) and a live example.
@@ -102,16 +102,12 @@ Example:
Sometimes bugs reported to us are actually caused by bugs in the browser(s) themselves, not bugs in Bootstrap per se.
When feasible, we aim to report such upstream bugs to the relevant browser vendor(s), and then list them on our [Wall of Browser Bugs](https://getbootstrap.com/browser-bugs/) and [document them in MDN](https://developer.mozilla.org/en-US/docs/Web).
| Mozilla | Firefox | Gecko | https://bugzilla.mozilla.org/enter_bug.cgi | "Core" is normally the right product option to choose. |
| Apple | Safari | WebKit | https://bugs.webkit.org/enter_bug.cgi?product=WebKit <br> https://bugreport.apple.com | In Apple's bug reporter, choose "Safari" as the product. |
| Google, Opera | Chrome, Chromium, Opera v15+ | Blink | https://code.google.com/p/chromium/issues/list | Click the "New issue" button. |
| Microsoft | Edge | EdgeHTML | https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/ | |
### Issues bots
[@twbs-lmvtfy](https://github.com/twbs-lmvtfy) is a Bootstrap bot that hangs out in our GitHub issue tracker and automatically checks for HTML validation errors in live examples (e.g. jsFiddles, JS Bins, Bootplys, Plunks, CodePens, etc.) posted in issue comments. If it finds any errors, it will post a follow-up comment on the issue and point out the errors. If this happens with an example you've posted, please fix the errors and post an updated live example. If you opened a bug report, please check whether the bug still occurs with your revised, valid live example. If the bug no longer occurs, it was probably due to your invalid HTML rather than something in Bootstrap and we'd appreciate it if you could close out the GitHub issue.
[@twbs-rorschach](https://github.com/twbs-rorschach) is a Bootstrap bot that hangs out in our GitHub issue tracker and automatically checks all pull requests for a few simple common mistakes. It's possible that Rorschach might leave a comment on your pull request and then close it. If that happens, simply fix the problem(s) mentioned in the comment (there should be link(s) in the comment explaining the problem(s) in detail) and then either:
* Push the revised version to your pull request's branch and post a comment on the pull request saying that you've fixed the problem(s). One of the Bootstrap Core Team members will then come along and reopen your pull request.
* Or you can just open a new pull request for your revised version.
[@twbs-savage](https://github.com/twbs-savage) is a Bootstrap bot that automatically runs cross-browser tests (via [Sauce](https://saucelabs.com/) and Travis CI) on JavaScript pull requests. Savage will leave a comment on pull requests stating whether cross-browser JS tests passed or failed, with a link to the full Travis build details. If your pull request fails, check the Travis log to see which browser + OS combinations failed. Each browser test in the Travis log includes a link to a Sauce page with details about the test. On those details pages, you can watch a screencast of the test run to see exactly which unit tests failed.
## Code guidelines
### HTML
[Adhere to the Code Guide.](http://codeguide.co/#html)
[Adhere to the Code Guide.](https://codeguide.co/#html)
- Use tags and elements appropriate for an HTML5 doctype (e.g., self-closing tags).
- Use CDNs and HTTPS for third-party JS when possible. We don't use protocol-relative URLs in this case because they break when viewing the page locally via `file://`.
@@ -226,10 +215,10 @@ includes code changes) and under the terms of the
### CSS
[Adhere to the Code Guide.](http://codeguide.co/#css)
[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](http://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
@@ -246,7 +235,7 @@ Run `npm run test` before committing to ensure your changes follow our coding st
## License
By contributing your code, you agree to license your contribution under the [MIT License](LICENSE).
By contributing to the documentation, you agree to license your contribution under the [Creative Commons Attribution 3.0 Unported License](docs/LICENSE).
By contributing your code, you agree to license your contribution under the [MIT License](../LICENSE).
By contributing to the documentation, you agree to license your contribution under the [Creative Commons Attribution 3.0 Unported License](https://creativecommons.org/licenses/by/3.0/).
Prior to v3.1.0, Bootstrap's code was released under the Apache License v2.0.
about: Tell us about a bug you may have identified in Bootstrap.
title: ''
labels: ''
assignees: ''
---
Before opening:
- [Search for duplicate or closed issues](https://github.com/twbs/bootstrap/issues?utf8=%E2%9C%93&q=is%3Aissue)
- [Validate](https://html5.validator.nu/) any HTML to avoid common problems
- Read the [contributing guidelines](https://github.com/twbs/bootstrap/blob/v4-dev/.github/CONTRIBUTING.md)
Bug reports must include:
- Operating system and version (Windows, macOS, Android, iOS)
- Browser and version (Chrome, Firefox, Safari, Internet Explorer, Microsoft Edge, Opera, Android Browser)
- A [reduced test case](https://css-tricks.com/reduced-test-cases/) or suggested fix using [CodePen](https://codepen.io/) or [JS Bin](https://jsbin.com/)
@@ -40,7 +40,4 @@ Project maintainers who do not follow or enforce the Code of Conduct in good fai
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version]
This Code of Conduct is adapted from the [Contributor Covenant](https://www.contributor-covenant.org/), version 1.4, available at <https://www.contributor-covenant.org/version/1/4/code-of-conduct/>
- [Download the latest release.](https://github.com/twbs/bootstrap/archive/v4.0.0-beta.3.zip)
- [Download the latest release.](https://github.com/twbs/bootstrap/archive/v4.6.2.zip)
- Clone the repo: `git clone https://github.com/twbs/bootstrap.git`
- Install with [npm](https://www.npmjs.com/): `npm install bootstrap@4.0.0-beta.3`
- Install with [yarn](https://yarnpkg.com/): `yarn add bootstrap@4.0.0-beta.3`
- Install with [Composer](https://getcomposer.org/): `composer require twbs/bootstrap:4.0.0-beta.3`
- Install with [NuGet](https://www.nuget.org/): CSS: `Install-Package bootstrap -Pre` Sass: `Install-Package bootstrap.sass -Pre` (`-Pre` is only required until Bootstrap v4 has a stable release).
- Install with [npm](https://www.npmjs.com/): `npm install bootstrap`
- Install with [yarn](https://yarnpkg.com/): `yarn add bootstrap@4.6.2`
- Install with [Composer](https://getcomposer.org/): `composer require twbs/bootstrap:4.6.2`
- Install with [NuGet](https://www.nuget.org/): CSS: `Install-Package bootstrap` Sass: `Install-Package bootstrap.sass`
Read the [Getting started page](https://getbootstrap.com/docs/4.6/getting-started/introduction/) for information on the framework contents, templates and examples, and more.
Read the [Getting started page](https://getbootstrap.com/docs/4.0/getting-started/introduction/) for information on the framework contents, templates and examples, and more.
[](#backers)
[](#sponsors)
[](https://saucelabs.com/u/bootstrap)
## What's included
Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:
Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations.
```
<details><summary>Download contents</summary>
```text
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ ├── bootstrap.min.css
│ ├── bootstrap.min.css.map
│ ├── bootstrap-grid.css
│ ├── bootstrap-grid.css.map
│ ├── bootstrap-grid.min.css
│ ├── bootstrap-grid.min.css.map
│ ├── bootstrap-reboot.css
│ ├── bootstrap-reboot.css.map
│ ├── bootstrap-reboot.min.css
│ └── bootstrap-reboot.min.css.map
└── js/
├── bootstrap.bundle.js
├── bootstrap.bundle.min.js
├── bootstrap.js
└── bootstrap.min.js
└── dist/
├── css/
│ ├── bootstrap-grid.css
│ ├── bootstrap-grid.css.map
│ ├── bootstrap-grid.min.css
│ ├── bootstrap-grid.min.css.map
│ ├── bootstrap-reboot.css
│ ├── bootstrap-reboot.css.map
│ ├── bootstrap-reboot.min.css
│ ├── bootstrap-reboot.min.css.map
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ ├── bootstrap.min.css
│ └── bootstrap.min.css.map
└── js/
├── bootstrap.bundle.js
├── bootstrap.bundle.js.map
├── bootstrap.bundle.min.js
├── bootstrap.bundle.min.js.map
├── bootstrap.js
├── bootstrap.js.map
├── bootstrap.min.js
└── bootstrap.min.js.map
```
</details>
We provide compiled CSS and JS (`bootstrap.*`), as well as compiled and minified CSS and JS (`bootstrap.min.*`). CSS [source maps](https://developers.google.com/web/tools/chrome-devtools/debug/readability/source-maps) (`bootstrap.*.map`) are available for use with certain browsers' developer tools. Bundled JS files (`bootstrap.bundle.js` and minified `bootstrap.bundle.min.js`) include [Popper](https://popper.js.org/), but not [jQuery](https://jquery.com/).
We provide compiled CSS and JS (`bootstrap.*`), as well as compiled and minified CSS and JS (`bootstrap.min.*`). [Source maps](https://developers.google.com/web/tools/chrome-devtools/javascript/source-maps) (`bootstrap.*.map`) are available for use with certain browsers' developer tools. Bundled JS files (`bootstrap.bundle.js` and minified `bootstrap.bundle.min.js`) include [Popper](https://popper.js.org/), but not [jQuery](https://jquery.com/).
## Bugs and feature requests
Have a bug or a feature request? Please first read the [issue guidelines](https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md#using-the-issue-tracker) and search for existing and closed issues. If your problem or idea is not addressed yet, [please open a new issue](https://github.com/twbs/bootstrap/issues/new).
Have a bug or a feature request? Please first read the [issue guidelines](https://github.com/twbs/bootstrap/blob/v4-dev/.github/CONTRIBUTING.md#using-the-issue-tracker) and search for existing and closed issues. If your problem or idea is not addressed yet, [please open a new issue](https://github.com/twbs/bootstrap/issues/new).
## Documentation
Bootstrap's documentation, included in this repo in the root directory, is built with [Jekyll](https://jekyllrb.com/) and publicly hosted on GitHub Pages at <https://getbootstrap.com/>. The docs may also be run locally.
Bootstrap's documentation, included in this repo in the root directory, is built with [Hugo](https://gohugo.io/) and publicly hosted on GitHub Pages at <https://getbootstrap.com/>. The docs may also be run locally.
Documentation search is powered by [Algolia's DocSearch](https://community.algolia.com/docsearch/). Working on our search? Be sure to set `debug: true` in the `_scripts.html` include.
Documentation search is powered by [Algolia's DocSearch](https://community.algolia.com/docsearch/). Working on our search? Be sure to set `debug: true` in `site/assets/js/search.js`.
### Running documentation locally
1. Run through the [tooling setup](https://getbootstrap.com/docs/4.0/getting-started/build-tools/#tooling-setup) to install Jekyll (the site builder) and other Ruby dependencies with `bundle install`.
2. Run `npm install` to install Node.js dependencies.
3. Run `npm run test` (or a specific NPM script) to rebuild distributed CSS and JavaScript files, as well as our docs assets.
4.From the root `/bootstrap` directory, run `npm run docs-serve` in the command line.
5. Open `http://localhost:9001` in your browser, and voilà.
1. Run `npm install` to install the Node.js dependencies, including Hugo (the site builder).
2. Run `npm run test` (or a specific npm script) to rebuild distributed CSS and JavaScript files, as well as our docs assets.
3. Run `npm start` to compile CSS and JavaScript files, generate our docs, and watch for changes.
4.Open `http://localhost:9001/` in your browser, and voilà.
Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/home/).
Learn more about using Hugo by reading its [documentation](https://gohugo.io/documentation/).
### Documentation for previous releases
- For v2.3.2: <https://getbootstrap.com/2.3.2/>
- For v3.3.x: <https://getbootstrap.com/docs/3.3/>
You can find all our previous releases docs on <https://getbootstrap.com/docs/versions/>.
[Previous releases](https://github.com/twbs/bootstrap/releases) and their documentation are also available for download.
## Contributing
Please read through our [contributing guidelines](https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md). Included are directions for opening issues, coding standards, and notes on development.
Please read through our [contributing guidelines](https://github.com/twbs/bootstrap/blob/v4-dev/.github/CONTRIBUTING.md). Included are directions for opening issues, coding standards, and notes on development.
Moreover, if your pull request contains JavaScript patches or features, you must include [relevant unit tests](https://github.com/twbs/bootstrap/tree/master/js/tests). All HTML and CSS should conform to the [Code Guide](https://github.com/mdo/code-guide), maintained by [Mark Otto](https://github.com/mdo).
Moreover, if your pull request contains JavaScript patches or features, you must include [relevant unit tests](https://github.com/twbs/bootstrap/tree/v4-dev/js/tests). All HTML and CSS should conform to the [Code Guide](https://github.com/mdo/code-guide), maintained by [Mark Otto](https://github.com/mdo).
Editor preferences are available in the [editor config](https://github.com/twbs/bootstrap/blob/master/.editorconfig) for easy use in common text editors. Read more and download plugins at <http://editorconfig.org/>.
Editor preferences are available in the [editor config](https://github.com/twbs/bootstrap/blob/v4-dev/.editorconfig) for easy use in common text editors. Read more and download plugins at <https://editorconfig.org/>.
## Community
@@ -137,14 +148,14 @@ Get updates on Bootstrap's development and chat with the project maintainers and
- Follow [@getbootstrap on Twitter](https://twitter.com/getbootstrap).
- Read and subscribe to [The Official Bootstrap Blog](https://blog.getbootstrap.com/).
- Join [the official Slack room](https://bootstrap-slack.herokuapp.com/).
- Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##bootstrap` channel.
- Chat with fellow Bootstrappers in IRC. On the `irc.libera.chat` server, in the `#bootstrap` channel.
- Implementation help may be found at Stack Overflow (tagged [`bootstrap-4`](https://stackoverflow.com/questions/tagged/bootstrap-4)).
- Developers should use the keyword `bootstrap` on packages which modify or add to the functionality of Bootstrap when distributing through [npm](https://www.npmjs.com/browse/keyword/bootstrap) or similar delivery mechanisms for maximum discoverability.
## Versioning
For transparency into our release cycle and in striving to maintain backward compatibility, Bootstrap is maintained under [the Semantic Versioning guidelines](http://semver.org/). Sometimes we screw up, but we'll adhere to those rules whenever possible.
For transparency into our release cycle and in striving to maintain backward compatibility, Bootstrap is maintained under [the Semantic Versioning guidelines](https://semver.org/). Sometimes we screw up, but we adhere to those rules whenever possible.
See [the Releases section of our GitHub project](https://github.com/twbs/bootstrap/releases) for changelogs for each release version of Bootstrap. Release announcement posts on [the official Bootstrap blog](https://blog.getbootstrap.com/) contain summaries of the most noteworthy changes made in each release.
@@ -162,6 +173,38 @@ See [the Releases section of our GitHub project](https://github.com/twbs/bootstr
Thanks to [BrowserStack](https://www.browserstack.com/) for providing the infrastructure that allows us to test in real browsers!
## Sponsors
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/bootstrap#sponsor)]
Code and documentation copyright 2011-2017 the [Bootstrap Authors](https://github.com/twbs/bootstrap/graphs/contributors) and [Twitter, Inc.](https://twitter.com) Code released under the [MIT License](https://github.com/twbs/bootstrap/blob/master/LICENSE). Docs released under [Creative Commons](https://github.com/twbs/bootstrap/blob/master/docs/LICENSE).
Code and documentation copyright 2011-2022 the [Bootstrap Authors](https://github.com/twbs/bootstrap/graphs/contributors) and [Twitter, Inc.](https://twitter.com) Code released under the [MIT License](https://github.com/twbs/bootstrap/blob/main/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/).
The Bootstrap team and community take security issues in Bootstrap seriously. We appreciate your efforts to responsibly disclose your findings, and will make every effort to acknowledge your contributions.
To report a security issue, email [security@getbootstrap.com](mailto:security@getbootstrap.com) and include the word "SECURITY" in the subject line.
We'll endeavor to respond quickly, and will keep you updated throughout the process.
<p>Designed and built with all the love in the world by <ahref="https://twitter.com/mdo"target="_blank"rel="noopener">@mdo</a> and <ahref="https://twitter.com/fat"target="_blank"rel="noopener">@fat</a>. Maintained by the <ahref="https://github.com/orgs/twbs/people">core team</a> with the help of <ahref="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</p>
Some files were not shown because too many files have changed in this diff
Show More
Reference in New Issue
Block a user
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Jesse Mandel
Louis-Maxime Piton
XhmikosR
Julien Déramond
Mark Otto
Julien Déramond
Patrick H. Lauke
Mark Otto
Adrian Curtin
Wladyslaw Dudko
pricop
Ty Mick
Christian Oliff
Barabas
Gaël Poupard
alpadev
dependabot[bot]
Kijima Daigo
k-utsumi
midzer
Carson Sievert
Stefano Bartoletti
Nikon the Third
Wesley Haines
voltaek
Aleksandr Gorbatov
Kyle Tsang
Rohit Sharma
Noah Rosenzweig
James Remeika
Mitchell Bryson
Martijn Cuppens
Adam Jones
Gaël Poupard
Itamar Eduardo Gonçalves de Oliveira
Alexandre Rosario
Ankit Mishra
Laussel Loïc
Johann-S
Joakim Riedel
Mr. Will
ysds
Giovanni Mendoza
Quy
Catalin Zalog
luktom
Tim Dujardin
Frank Liepert
Minobi
Jens Luyten
jorimvanhove
AlexKoala
719media
Sam Duvall
Gary PEGEOT
Mark Otto
Christian Oliff
astrahov
tracyjordan
Herst
Chandan Deep
Brian Juul Andersen
Kitten King
M. Wacker
Manuel Alcaraz
Sunny Dhoke
Bardi Harborow
Sergey Kovalenko
Jonathan Hawkins
Robin D'Arcy
Morteza Ziyae
Jay Pinho
Aditya Shankar
Sezer Esen
zhangbao
Shohei Yoshida
Matěj Kříž
Loïc Goyet
Jim Jiang
mspae
Chris Barr
Pierre GIRAUD
Zachary Welch
João Lucas
Jason Golieb
Jason Golieb
Ryan Worth
Martijn Cuppens
Justin
Miha Eržen
wojtask9
文翼
Vishnuprasad Venugopal
Florian Lacreuse
sabruss
Sam Tape
jess
ChrissBott
Gijs Boddeus
unaccomplished
Mike Vastola
Gijs Rogé
Jacob Müller
acidrums4
toshimaru
m5o
Pixelastic
Roy Klutman
Tieson Trowbridge
Iurii Kucherov
jvitela
sts-ryan-holton
LittleHuba
okazou
Arvind S
Andrew
Vincent Langlet
Varunram
Sebastian Hädrich
Andrew Luca
Andrew Luca
Matheus Rocha Vieira
dercodercom
Ng Yik Phang
ItaloBC
Caíque de Castro Soares da Silva
Mitko Georgiev
Johan Beckers
Nicolay Hvidsten
Andrew Pucci
Andrey
Doug Puchalski
andresgalante
Ian Walter
semenyakNik
galczo5
Bastien
namiltd
chocolateboy
Helmut Granda
Spencer Davies
Tanmay Gupta
Howard Cox
Florian Lacreuse
Christopher Morrissey
Nabil Kadimi
Catalin Zalog
Roman O
acj
Yannick Warnier
Greg Tyler
Rowan-James Tran
jarstelfox
Jonathan
Mitchell Grice
Robert
lgdean
Stefan Wrobel
Mohammad Younes
Joshua David
Lefteris Psitopoulos
Simon Podlipsky
Josh Wand
Theodore Dubois
parammittal16
Kirill Reunov
jakubhonisek
sts-ryan-holton
marcosfreitas
domq
Brandon
Constantin Ross
David De Sloovere
nickg
Alexander Rechsteiner
Swardu
denisname
ruedap
Jason Quense
Patrick Yeo
Tom Swirly
Nat Zimmermann
vsn4ik
Michael
Mike Rogers
Ethan Beyer
John Bennet Veloya
Stephen Beemsterboer
Peter Etelej
Léo Andrès
Alexander Hjorth
Robert Martin
Adam Kolinski
Isma
Ed Morley
Jos Maissan
Peter Blazejewicz
daviddalbusco
Adam Bowles
Peter Blazejewicz
Andy Pickler
in-in
freezy
Jan Clarin
Richard van Laak
Ryan Cleary
exige81
M. Appelman
Taufek Johar
Pierre-Denis Vanduynslager
denisx
719media
Casper Bornebusch
Gustavo Straube
Jason Korth
Patrick Yeo
Wolfgang Goedel
Sander Melnikov
Vytas
Łukasz
Jesse Mandel
Martijn Cuppens
Kramb
Kevin Ruscoe
Raaj Trambadia
Alberto
Andrew Timson
Juan Carlos González Cabrero
