2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-30 15:24:08 +03:00

Merge branch 'v4-dev' of https://github.com/twbs/bootstrap into v4-dev

This commit is contained in:
Mark Otto
2017-11-24 17:02:01 -08:00
14 changed files with 124 additions and 50 deletions
+40
View File
@@ -1018,6 +1018,46 @@ Custom `<select>` menus need only a custom class, `.custom-select` to trigger th
</select>
{% endexample %}
You may also choose from small and large custom selects to match our similarly sized text inputs.
{% example html %}
<select class="custom-select custom-select-lg">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<select class="custom-select custom-select-sm">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
{% endexample %}
The `multiple` attribute is also supported:
{% example html %}
<select class="custom-select" multiple>
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
{% endexample %}
As is the `size` attribute:
{% example html %}
<select class="custom-select" size="3">
<option selected>Open this select menu</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
{% endexample %}
### File browser
The file input is the most gnarly of the bunch and require additional JavaScript if you'd like to hook them up with functional *Choose file...* and selected file name text.
+1 -1
View File
@@ -210,7 +210,7 @@ When modals become too long for the user's viewport or device, they scroll indep
### Vertically centered
Add `.modal-dialog-centered` to `.modal-dialog` to vertically center the modal. **Do not use this with long modals**—it will overflow the viewport and potentially hide parts of your modal.
Add `.modal-dialog-centered` to `.modal-dialog` to vertically center the modal.
<div id="exampleModalCenter" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
+1 -1
View File
@@ -586,7 +586,7 @@ Create responsive tables by adding `.table-responsive{-sm|-md|-lg|-xl}` to any `
## Captions
A `<caption>` functions like a heading for a table. It helps users with screen readers to find a table and understand what its about and decide if they want to read it.
A `<caption>` functions like a heading for a table. It helps users with screen readers to find a table and understand what it's about and decide if they want to read it.
{% example html %}
<table class="table">
+2
View File
@@ -11,6 +11,8 @@ toc: true
While Beta 2 saw the bulk of our breaking changes during the beta phase, but we still have a few that needed to be addressed in the Beta 3 release. These changes apply if you're updating to Beta 3 from Beta 2 or any older version of Bootstrap.
- Removed the unused `$thumbnail-transition` variable. We weren't transitioning anything, so it was just extra code.
- Changed the CSS for managing multiple `background-image`s on custom form checkboxes and radios. Previously, the `.custom-control-indicator` element had the background color, gradient, and SVG icon. Customizing the background gradient meant replacing all of those every time you needed to change just one. Now, we have `.custom-control-indicator` for the fill and gradient and `.custom-control-indicator::before` handles the icon.
- The npm package no longer includes any files other than our source and dist files; if you relied on them and were running our scripts via the `node_modules` folder, you should adapt your workflow.
- Updated selector for input-based button groups. Instead of `[data-toggle="buttons"] { }` for style and behavior, we use the `data` attribute just for JS behaviors and rely on a new `.btn-group-toggle` class for styling.
## Beta 2 changes