mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Merge branch 'v4-dev' into colors-redux
This commit is contained in:
commit
2f1bcaafa2
6 changed files with 913 additions and 1018 deletions
|
@ -285,6 +285,19 @@
|
|||
}
|
||||
}
|
||||
|
||||
.modal.show {
|
||||
z-index: 1072;
|
||||
|
||||
.tooltip, .popover {
|
||||
z-index: 1073;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-backdrop {
|
||||
z-index: 1071;
|
||||
}
|
||||
|
||||
|
||||
// Example tabbable tabs
|
||||
.bd-example-tabs .nav-tabs {
|
||||
margin-bottom: 1rem;
|
||||
|
|
1897
build/npm-shrinkwrap.json
generated
1897
build/npm-shrinkwrap.json
generated
File diff suppressed because it is too large
Load diff
|
@ -226,10 +226,10 @@ When modals become too long for the user's viewport or device, they scroll indep
|
|||
</div>
|
||||
<div class="modal-body">
|
||||
<h5>Popover in a modal</h5>
|
||||
<p>This <a href="#" role="button" class="btn btn-secondary popover-test" title="Popover title" data-content="Popover body content is set in this attribute.">button</a> triggers a popover on click.</p>
|
||||
<p>This <a href="#" role="button" class="btn btn-secondary popover-test" title="Popover title" data-content="Popover body content is set in this attribute." data-container="#exampleModalPopovers">button</a> triggers a popover on click.</p>
|
||||
<hr>
|
||||
<h5>Tooltips in a modal</h5>
|
||||
<p><a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> have tooltips on hover.</p>
|
||||
<p><a href="#" class="tooltip-test" title="Tooltip" data-container="#exampleModalPopovers">This link</a> and <a href="#" class="tooltip-test" title="Tooltip" data-container="#exampleModalPopovers">that link</a> have tooltips on hover.</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
|
||||
|
|
|
@ -6,11 +6,11 @@ group: getting-started
|
|||
toc: true
|
||||
---
|
||||
|
||||
Bootstrap provides an easy-to-use framework of ready-made styles, layout tools, and interactive components, allowing developers to create web sites and applications that are visually appealing, functionally rich, and accessible out of the box.
|
||||
Bootstrap provides an easy-to-use framework of ready-made styles, layout tools, and interactive components, allowing developers to create websites and applications that are visually appealing, functionally rich, and accessible out of the box.
|
||||
|
||||
## Overview and limitations
|
||||
## Overview and Limitations
|
||||
|
||||
The overall accessibility of any project built with Bootstrap depends in large part on the author's markup, additional styling, and scripting they've included. However, provided that these have been implemented correctly, it should be perfectly possible to create web sites and applications with Bootstrap that fulfill [<abbr title="Web Content Accessibility Guidelines">WCAG</abbr> 2.0](https://www.w3.org/TR/WCAG20/) (A/AA/AAA), [Section 508](https://www.section508.gov/) and similar accessibility standards and requirements.
|
||||
The overall accessibility of any project built with Bootstrap depends in large part on the author's markup, additional styling, and scripting they've included. However, provided that these have been implemented correctly, it should be perfectly possible to create websites and applications with Bootstrap that fulfill [<abbr title="Web Content Accessibility Guidelines">WCAG</abbr> 2.0](https://www.w3.org/TR/WCAG20/) (A/AA/AAA), [Section 508](https://www.section508.gov/) and similar accessibility standards and requirements.
|
||||
|
||||
### Structural markup
|
||||
|
||||
|
@ -18,7 +18,7 @@ Bootstrap's styling and layout can be applied to a wide range of markup structur
|
|||
|
||||
### Interactive components
|
||||
|
||||
Bootstrap's interactive components—such as modal dialogs, dropdown menus and custom tooltips—are designed to work for touch, mouse and keyboard users. Through the use of relevant [<abbr title="Web Accessibility Initiative">WAI</abbr> <abbr title="Accessible Rich Internet Applications">ARIA</abbr>](https://www.w3.org/WAI/intro/aria) roles and attributes, these components should also be understandable and operable using assistive technologies (such as screen readers).
|
||||
Bootstrap's interactive components—such as modal dialogs, dropdown menus and custom tooltips—are designed to work for touch, mouse and keyboard users. Through the use of relevant [<abbr title="Web Accessibility Initiative">WAI</abbr>-<abbr title="Accessible Rich Internet Applications">ARIA</abbr>](https://www.w3.org/WAI/intro/aria) roles and attributes, these components should also be understandable and operable using assistive technologies (such as screen readers).
|
||||
|
||||
Because Bootstrap's components are purposely designed to be fairly generic, authors may need to include further <abbr title="Accessible Rich Internet Applications">ARIA</abbr> roles and attributes, as well as JavaScript behavior, to more accurately convey the precise nature and functionality of their component. This is usually noted in the documentation.
|
||||
|
||||
|
|
|
@ -12,7 +12,7 @@ toc: true
|
|||
|
||||
## Importing JavaScript
|
||||
|
||||
Import [Bootstrap's JavaScript](/getting-started/javascript/) by adding this line to your app's entry point (usally `index.js` or `app.js`):
|
||||
Import [Bootstrap's JavaScript](/getting-started/javascript/) by adding this line to your app's entry point (usually `index.js` or `app.js`):
|
||||
|
||||
{% highlight js %}
|
||||
import 'bootstrap';
|
||||
|
|
|
@ -38,9 +38,7 @@
|
|||
"js-minify": "uglifyjs --compress warnings=false --mangle --comments '/^!/' --output dist/js/bootstrap.min.js dist/js/bootstrap.js",
|
||||
"js-minify-docs": "uglifyjs --compress warnings=false --mangle --comments '/^!/' --output assets/js/docs.min.js assets/js/vendor/anchor.min.js assets/js/vendor/clipboard.min.js assets/js/vendor/holder.min.js assets/js/src/application.js",
|
||||
"js-test": "phantomjs ./node_modules/qunit-phantomjs-runner/runner.js js/tests/index.html 60",
|
||||
"js-test-dep": "npm install grunt && npm install grunt-saucelabs",
|
||||
"js-launch-cloud": "ruby -r webrick -e \"s = WEBrick::HTTPServer.new(:Port => 3000, :DocumentRoot => Dir.pwd, :Logger => WEBrick::Log.new('/dev/null'), :AccessLog => []); trap('INT') { s.shutdown }; s.start\" & grunt saucelabs-qunit",
|
||||
"js-test-cloud": "npm-run-all js-test-dep js-launch-cloud",
|
||||
"js-test-cloud": "ruby -r webrick -e \"s = WEBrick::HTTPServer.new(:Port => 3000, :DocumentRoot => Dir.pwd, :Logger => WEBrick::Log.new('/dev/null'), :AccessLog => []); trap('INT') { s.shutdown }; s.start\" & grunt saucelabs-qunit",
|
||||
"docs": "npm-run-all docs-compile docs-lint",
|
||||
"docs-lint": "htmllint --rc build/.htmllintrc _gh_pages/*.html _gh_pages/**/*.html js/tests/visual/*.html",
|
||||
"docs-compile": "bundle exec jekyll build",
|
||||
|
@ -80,6 +78,9 @@
|
|||
"babel-preset-es2015": "^6.24.1",
|
||||
"clean-css-cli": "^4.1.3",
|
||||
"eslint": "^3.19.0",
|
||||
"grunt": "^1.0.1",
|
||||
"grunt-cli": "^1.2.0",
|
||||
"grunt-saucelabs": "^9.0.0",
|
||||
"htmllint-cli": "^0.0.6",
|
||||
"node-sass": "^4.5.3",
|
||||
"nodemon": "^1.11.0",
|
||||
|
|
Loading…
Add table
Reference in a new issue