0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-19 16:54:24 +01:00

Merge branch 'v4-dev' into yiq-function-update

This commit is contained in:
Gijs Boddeus 2017-10-04 08:46:03 +02:00 committed by GitHub
commit 263190305e
241 changed files with 9700 additions and 6947 deletions

View File

@ -1,12 +0,0 @@
{
"presets": [
[
"es2015",
{
"loose": true,
"modules": false
}
]
],
"plugins": ["external-helpers"]
}

16
.babelrc.js Normal file
View File

@ -0,0 +1,16 @@
module.exports = {
presets: [
[
'env',
{
loose: true,
modules: false,
exclude: ['transform-es2015-typeof-symbol']
}
]
],
plugins: [
process.env.ROLLUP && 'external-helpers',
process.env.PLUGINS && 'transform-es2015-modules-strip'
].filter(Boolean)
};

2
.gitattributes vendored
View File

@ -4,10 +4,10 @@
*.js text eol=lf
*.json text eol=lf
*.md text eol=lf
*.py text eol=lf
*.rb text eol=lf
*.scss text eol=lf
*.svg text eol=lf
*.txt text eol=lf
*.yml text eol=lf
# Don't diff or textually merge source maps
*.map binary

View File

@ -42,7 +42,7 @@ Our bug tracker utilizes several labels to help organize and identify issues. He
- `docs` - Issues for improving or updating our documentation.
- `examples` - Issues involving the example templates included in our docs.
- `feature` - Issues asking for a new feature to be added, or an existing one to be extended or modified. New features require a minor version bump (e.g., `v3.0.0` to `v3.1.0`).
- `grunt` - Issues with our build system, which is used to run all our tests, concatenate and compile source files, and more.
- `build` - Issues with our build system, which is used to run all our tests, concatenate and compile source files, and more.
- `help wanted` - Issues we need or would love help from the community to resolve.
- `js` - Issues stemming from our compiled or source JavaScript files.
- `meta` - Issues with the project itself or our GitHub repository.
@ -57,7 +57,7 @@ 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)
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
problem isn't caused by a simple error in your own code.
@ -151,7 +151,7 @@ documentation source files and is managed separately by the Bootstrap Core Team.
Adhering to the following process is the best way to get your work
included in the project:
1. [Fork](https://help.github.com/fork-a-repo/) the project, clone your fork,
1. [Fork](https://help.github.com/articles/fork-a-repo/) the project, clone your fork,
and configure the remotes:
```bash
@ -180,7 +180,7 @@ included in the project:
4. Commit your changes in logical chunks. Please adhere to these [git commit
message guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html)
or your code is unlikely be merged into the main project. Use Git's
[interactive rebase](https://help.github.com/articles/interactive-rebase)
[interactive rebase](https://help.github.com/articles/about-git-rebase/)
feature to tidy up your commits before making them public.
5. Locally merge (or rebase) the upstream development branch into your topic branch:
@ -195,7 +195,7 @@ included in the project:
git push origin <topic-branch-name>
```
7. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/)
7. [Open a Pull Request](https://help.github.com/articles/about-pull-requests/)
with a clear title and description against the `master` branch.
**IMPORTANT**: By submitting a patch, you agree to allow the project owners to
@ -211,7 +211,7 @@ includes code changes) and under the terms of the
* 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.
[@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

View File

@ -1,7 +1,7 @@
Before opening an issue:
- [Search for duplicate or closed issues](https://github.com/twbs/bootstrap/issues?utf8=%E2%9C%93&q=is%3Aissue)
- [Validate](https://validator.w3.org/nu/) and [lint](https://github.com/twbs/bootlint#in-the-browser) any HTML to avoid common problems
- [Validate](https://html5.validator.nu/) and [lint](https://github.com/twbs/bootlint#in-the-browser) any HTML to avoid common problems
- Prepare a [reduced test case](https://css-tricks.com/reduced-test-cases/) for any bugs
- Read the [contributing guidelines](https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md)
@ -14,7 +14,7 @@ When reporting a bug, include:
- Operating system and version (Windows, Mac OS X, Android, iOS, Win10 Mobile)
- Browser and version (Chrome, Firefox, Safari, IE, MS Edge, Opera 15+, Android Browser)
- Reduced test cases and potential fixes using [JS Bin](https://jsbin.com)
- Reduced test cases and potential fixes using [JS Bin](https://jsbin.com/)
When suggesting a feature, include:

6
.gitignore vendored
View File

@ -38,12 +38,6 @@ Thumbs.db
.komodotools
*.komodoproject
# SCSS-Lint
scss-lint-report.xml
# grunt-contrib-sass cache
.sass-cache
# Jekyll metadata and extra config file for `github` script
docs/.jekyll-metadata
twbsconfig.yml

View File

@ -1,7 +1,7 @@
fail_on_violations: true
scss:
config_file: .scss-lint.yml
stylelint:
config_file: build/.stylelintrc
jshint:
enabled: false

View File

@ -1,537 +0,0 @@
# Default application configuration that all configurations inherit from.
scss_files:
- "scss/**/*.scss"
- "docs/assets/scss/**/*.scss"
plugin_directories: ['.scss-linters']
# List of gem names to load custom linters from (make sure they are already
# installed)
plugin_gems: []
# Default severity of all linters.
severity: warning
linters:
BangFormat:
enabled: true
space_before_bang: true
space_after_bang: false
BemDepth:
enabled: false
max_elements: 1
BorderZero:
enabled: true
convention: zero # or `none`
ChainedClasses:
enabled: false
ColorKeyword:
enabled: true
ColorVariable:
enabled: false
Comment:
enabled: true
exclude:
- scss/bootstrap.scss
style: silent
DebugStatement:
enabled: true
DeclarationOrder:
enabled: false
DisableLinterReason:
enabled: false
DuplicateProperty:
enabled: true
ElsePlacement:
enabled: true
style: same_line # or 'new_line'
EmptyLineBetweenBlocks:
enabled: false
ignore_single_line_blocks: true
EmptyRule:
enabled: true
ExtendDirective:
enabled: false
FinalNewline:
enabled: true
present: true
HexLength:
enabled: true
style: short # or 'long'
HexNotation:
enabled: true
style: lowercase # or 'uppercase'
HexValidation:
enabled: true
IdSelector:
enabled: true
ImportantRule:
enabled: false
ImportPath:
enabled: true
leading_underscore: false
filename_extension: false
Indentation:
enabled: true
allow_non_nested_indentation: false
character: space # or 'tab'
width: 2
LeadingZero:
enabled: true
style: exclude_zero # or 'include_zero'
MergeableSelector:
enabled: false
force_nesting: true
NameFormat:
enabled: true
allow_leading_underscore: true
convention: hyphenated_lowercase # or 'camel_case', or 'snake_case', or a regex pattern
NestingDepth:
enabled: true
max_depth: 5
ignore_parent_selectors: false
PlaceholderInExtend:
enabled: false
PropertyCount:
enabled: false
include_nested: false
max_properties: 10
PropertySortOrder:
enabled: true
ignore_unspecified: false
min_properties: 2
separate_groups: false
order:
- position
- top
- right
- bottom
- left
- z-index
- -webkit-box-sizing
- -moz-box-sizing
- box-sizing
- display
- flex
- flex-align
- flex-basis
- flex-direction
- flex-wrap
- flex-flow
- flex-grow
- flex-order
- flex-pack
- align-items
- align-self
- justify-content
- order
- float
- width
- min-width
- max-width
- height
- min-height
- max-height
- padding
- padding-top
- padding-right
- padding-bottom
- padding-left
- margin
- margin-top
- margin-right
- margin-bottom
- margin-left
- overflow
- overflow-x
- overflow-y
- -webkit-overflow-scrolling
- -ms-overflow-x
- -ms-overflow-y
- -ms-overflow-style
- clip
- clear
- font
- font-family
- font-size
- font-style
- font-weight
- font-variant
- font-size-adjust
- font-stretch
- font-effect
- font-emphasize
- font-emphasize-position
- font-emphasize-style
- font-smooth
- -webkit-hyphens
- -moz-hyphens
- hyphens
- line-height
- color
- text-align
- -webkit-text-align-last
- -moz-text-align-last
- -ms-text-align-last
- text-align-last
- text-emphasis
- text-emphasis-color
- text-emphasis-style
- text-emphasis-position
- text-decoration
- text-indent
- text-justify
- text-outline
- -ms-text-overflow
- text-overflow
- text-overflow-ellipsis
- text-overflow-mode
- text-shadow
- text-transform
- text-wrap
- -webkit-text-size-adjust
- -ms-text-size-adjust
- letter-spacing
- -ms-word-break
- word-break
- word-spacing
- -ms-word-wrap
- word-wrap
- overflow-wrap
- -moz-tab-size
- -o-tab-size
- tab-size
- white-space
- vertical-align
- list-style
- list-style-position
- list-style-type
- list-style-image
- pointer-events
- -ms-touch-action
- touch-action
- cursor
- visibility
- zoom
- table-layout
- empty-cells
- caption-side
- border-spacing
- border-collapse
- content
- quotes
- counter-reset
- counter-increment
- resize
- -webkit-user-select
- -moz-user-select
- -ms-user-select
- -o-user-select
- user-select
- nav-index
- nav-up
- nav-right
- nav-down
- nav-left
- background
- background-color
- background-image
- -ms-filter:\\'progid:DXImageTransform.Microsoft.gradient
- filter:progid:DXImageTransform.Microsoft.gradient
- filter:progid:DXImageTransform.Microsoft.AlphaImageLoader
- filter
- background-repeat
- background-attachment
- background-position
- background-position-x
- background-position-y
- -webkit-background-clip
- -moz-background-clip
- background-clip
- background-origin
- -webkit-background-size
- -moz-background-size
- -o-background-size
- background-size
- border
- border-color
- border-style
- border-width
- border-top
- border-top-color
- border-top-style
- border-top-width
- border-right
- border-right-color
- border-right-style
- border-right-width
- border-bottom
- border-bottom-color
- border-bottom-style
- border-bottom-width
- border-left
- border-left-color
- border-left-style
- border-left-width
- border-radius
- border-top-left-radius
- border-top-right-radius
- border-bottom-right-radius
- border-bottom-left-radius
- -webkit-border-image
- -moz-border-image
- -o-border-image
- border-image
- -webkit-border-image-source
- -moz-border-image-source
- -o-border-image-source
- border-image-source
- -webkit-border-image-slice
- -moz-border-image-slice
- -o-border-image-slice
- border-image-slice
- -webkit-border-image-width
- -moz-border-image-width
- -o-border-image-width
- border-image-width
- -webkit-border-image-outset
- -moz-border-image-outset
- -o-border-image-outset
- border-image-outset
- -webkit-border-image-repeat
- -moz-border-image-repeat
- -o-border-image-repeat
- border-image-repeat
- outline
- outline-width
- outline-style
- outline-color
- outline-offset
- -webkit-box-shadow
- -moz-box-shadow
- box-shadow
- filter:progid:DXImageTransform.Microsoft.Alpha(Opacity
- -ms-filter:\\'progid:DXImageTransform.Microsoft.Alpha
- opacity
- -ms-interpolation-mode
- -webkit-transition
- -moz-transition
- -ms-transition
- -o-transition
- transition
- -webkit-transition-delay
- -moz-transition-delay
- -ms-transition-delay
- -o-transition-delay
- transition-delay
- -webkit-transition-timing-function
- -moz-transition-timing-function
- -ms-transition-timing-function
- -o-transition-timing-function
- transition-timing-function
- -webkit-transition-duration
- -moz-transition-duration
- -ms-transition-duration
- -o-transition-duration
- transition-duration
- -webkit-transition-property
- -moz-transition-property
- -ms-transition-property
- -o-transition-property
- transition-property
- -webkit-transform
- -moz-transform
- -ms-transform
- -o-transform
- transform
- -webkit-transform-origin
- -moz-transform-origin
- -ms-transform-origin
- -o-transform-origin
- transform-origin
- -webkit-animation
- -moz-animation
- -ms-animation
- -o-animation
- animation
- -webkit-animation-name
- -moz-animation-name
- -ms-animation-name
- -o-animation-name
- animation-name
- -webkit-animation-duration
- -moz-animation-duration
- -ms-animation-duration
- -o-animation-duration
- animation-duration
- -webkit-animation-play-state
- -moz-animation-play-state
- -ms-animation-play-state
- -o-animation-play-state
- animation-play-state
- -webkit-animation-timing-function
- -moz-animation-timing-function
- -ms-animation-timing-function
- -o-animation-timing-function
- animation-timing-function
- -webkit-animation-delay
- -moz-animation-delay
- -ms-animation-delay
- -o-animation-delay
- animation-delay
- -webkit-animation-iteration-count
- -moz-animation-iteration-count
- -ms-animation-iteration-count
- -o-animation-iteration-count
- animation-iteration-count
- -webkit-animation-direction
- -moz-animation-direction
- -ms-animation-direction
- -o-animation-direction
PropertySpelling:
enabled: true
extra_properties: []
disabled_properties: []
PropertyUnits:
enabled: true
global: [
'ch', 'em', 'ex', 'rem', # Font-relative lengths
'cm', 'in', 'mm', 'pc', 'pt', 'px', 'q', # Absolute lengths
'vh', 'vw', 'vmin', 'vmax', # Viewport-percentage lengths
'deg', 'grad', 'rad', 'turn', # Angle
'ms', 's', # Duration
'Hz', 'kHz', # Frequency
'dpi', 'dpcm', 'dppx', # Resolution
'%'] # Other
properties: {}
PseudoElement:
enabled: true
QualifyingElement:
enabled: true
allow_element_with_attribute: false
allow_element_with_class: false
allow_element_with_id: false
SelectorDepth:
enabled: true
max_depth: 4
SelectorFormat:
enabled: false
convention: hyphenated_lowercase # or 'strict_BEM', or 'hyphenated_BEM', or 'snake_case', or 'camel_case', or a regex pattern
Shorthand:
enabled: true
allowed_shorthands: [1, 2, 3, 4]
SingleLinePerProperty:
enabled: false
allow_single_line_rule_sets: true
SingleLinePerSelector:
enabled: false
SpaceAfterComma:
enabled: false
style: one_space # or 'no_space', or 'at_least_one_space'
SpaceAfterPropertyColon:
enabled: true
style: at_least_one_space # or 'no_space', or 'at_least_one_space', or 'aligned'
SpaceAfterPropertyName:
enabled: true
SpaceAfterVariableName:
enabled: true
SpaceAroundOperator:
enabled: true
style: one_space # or 'at_least_one_space', or 'no_space'
SpaceBeforeBrace:
enabled: true
style: space # or 'new_line'
allow_single_line_padding: true
SpaceBetweenParens:
enabled: true
spaces: 0
StringQuotes:
enabled: true
style: double_quotes # or double_quotes
TrailingSemicolon:
enabled: true
TrailingWhitespace:
enabled: true
TrailingZero:
enabled: false
TransitionAll:
enabled: false
UnnecessaryMantissa:
enabled: true
UnnecessaryParentReference:
enabled: true
UrlFormat:
enabled: true
UrlQuotes:
enabled: true
VariableForProperty:
enabled: false
properties: []
VendorPrefix:
enabled: true
identifier_list: base
additional_identifiers: []
excluded_identifiers: []
ZeroUnit:
enabled: true
Compass::*:
enabled: false

View File

@ -4,31 +4,28 @@ language: node_js
git:
depth: 3
node_js:
- "4"
- "6"
- "8"
before_install:
- if [[ `npm -v` != 5* ]]; then npm install -g npm@5; fi
- "export TRAVIS_COMMIT_MSG=\"`git log --format=%B --no-merges -n 1`\""
- echo "$TRAVIS_COMMIT_MSG" | grep '\[skip browser\]'; export TWBS_DO_BROWSER=$?; true
install:
- bundle install --deployment --jobs=3 --retry=3
- npm install
script:
- npm test
- if [ "$TWBS_TEST" = browser -a "$SAUCE_ACCESS_KEY" ]; then npm run js-test-cloud; fi
after_success:
- if [ "$TRAVIS_REPO_SLUG" = twbs-savage/bootstrap ]; then npm run docs-upload-preview; fi
stages:
- test
- name: browser
if: type = push
jobs:
include:
- stage: browser
node_js: 8
script: if ! git log --format=%B --no-merges -n 1 | grep '\[skip browser\]'; then npm test && npm run js-test-cloud; fi
cache:
directories:
- node_modules
- vendor/bundle
env:
- TWBS_TEST=core
- TWBS_TEST=browser
matrix:
exclude:
- node_js: "4"
env: TWBS_TEST=browser
notifications:
slack: heybb:iz4wwosL0N0EdaX1gvgkU0NH
webhooks:

View File

@ -1,9 +1,8 @@
source 'https://rubygems.org'
group :development, :test do
gem 'jekyll', '~> 3.5.1'
gem 'jekyll', '~> 3.6.0'
gem 'jekyll-redirect-from', '~> 0.12.1'
gem 'jekyll-sitemap', '~> 1.1.1'
gem 'jekyll-toc', '~> 0.3.0.pre1'
gem 'scss_lint', '~> 0.54.0'
gem 'jekyll-toc', '~> 0.3.0'
end

View File

@ -7,16 +7,16 @@ GEM
ffi (1.9.18)
ffi (1.9.18-x64-mingw32)
forwardable-extended (2.6.0)
jekyll (3.5.2)
jekyll (3.6.0)
addressable (~> 2.4)
colorator (~> 1.0)
jekyll-sass-converter (~> 1.0)
jekyll-watch (~> 1.1)
kramdown (~> 1.3)
kramdown (~> 1.14)
liquid (~> 4.0)
mercenary (~> 0.3.3)
pathutil (~> 0.9)
rouge (~> 1.7)
rouge (>= 1.7, < 3)
safe_yaml (~> 1.0)
jekyll-redirect-from (0.12.1)
jekyll (~> 3.3)
@ -28,41 +28,40 @@ GEM
nokogiri (~> 1.6)
jekyll-watch (1.5.0)
listen (~> 3.0, < 3.1)
kramdown (1.14.0)
kramdown (1.15.0)
liquid (4.0.0)
listen (3.0.8)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
mercenary (0.3.6)
mini_portile2 (2.2.0)
nokogiri (1.8.0)
mini_portile2 (~> 2.2.0)
nokogiri (1.8.0-x64-mingw32)
mini_portile2 (~> 2.2.0)
mini_portile2 (2.3.0)
nokogiri (1.8.1)
mini_portile2 (~> 2.3.0)
nokogiri (1.8.1-x64-mingw32)
mini_portile2 (~> 2.3.0)
pathutil (0.14.0)
forwardable-extended (~> 2.6)
public_suffix (3.0.0)
rake (12.0.0)
rb-fsevent (0.10.2)
rb-inotify (0.9.10)
ffi (>= 0.5.0, < 2)
rouge (1.11.1)
rouge (2.2.1)
safe_yaml (1.0.4)
sass (3.4.25)
scss_lint (0.54.0)
rake (>= 0.9, < 13)
sass (~> 3.4.20)
sass (3.5.1)
sass-listen (~> 4.0.0)
sass-listen (4.0.0)
rb-fsevent (~> 0.9, >= 0.9.4)
rb-inotify (~> 0.9, >= 0.9.7)
PLATFORMS
ruby
x64-mingw32
DEPENDENCIES
jekyll (~> 3.5.1)
jekyll (~> 3.6.0)
jekyll-redirect-from (~> 0.12.1)
jekyll-sitemap (~> 1.1.1)
jekyll-toc (~> 0.3.0.pre1)
scss_lint (~> 0.54.0)
jekyll-toc (~> 0.3.0)
BUNDLED WITH
1.15.4

View File

@ -1,29 +0,0 @@
/*!
* Bootstrap's Gruntfile
* https://getbootstrap.com
* Copyright 2013-2017 The Bootstrap Authors
* Copyright 2013-2017 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
module.exports = function (grunt) {
'use strict'
// Project configuration.
grunt.initConfig({
'saucelabs-qunit': {
all: {
options: {
build: process.env.TRAVIS_JOB_ID,
concurrency: 10,
maxRetries: 3,
maxPollRetries: 4,
urls: ['http://localhost:3000/js/tests/index.html?hidepassed'],
browsers: grunt.file.readYAML('build/sauce_browsers.yml')
}
}
}
})
grunt.loadNpmTasks('grunt-saucelabs')
}

View File

@ -1,5 +1,5 @@
<p align="center">
<a href="https://getbootstrap.com">
<a href="https://getbootstrap.com/">
<img src="https://getbootstrap.com/assets/brand/bootstrap-solid.svg" width=72 height=72>
</a>
@ -8,14 +8,14 @@
<p align="center">
Sleek, intuitive, and powerful front-end framework for faster and easier web development.
<br>
<a href="https://getbootstrap.com/docs/4.0"><strong>Explore Bootstrap docs &raquo;</strong></a>
<a href="https://getbootstrap.com/docs/4.0/"><strong>Explore Bootstrap docs &raquo;</strong></a>
<br>
<br>
<a href="https://themes.getbootstrap.com">Bootstrap Themes</a>
<a href="https://themes.getbootstrap.com/">Bootstrap Themes</a>
&middot;
<a href="https://jobs.getbootstrap.com">Job Board</a>
<a href="https://jobs.getbootstrap.com/">Job Board</a>
&middot;
<a href="https://blog.getbootstrap.com">Blog</a>
<a href="https://blog.getbootstrap.com/">Blog</a>
</p>
</p>
@ -40,16 +40,16 @@ Several quick start options are available:
- [Download the latest release.](https://github.com/twbs/bootstrap/archive/v4.0.0-beta.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`
- Install with [yarn](https://yarnpkg.com): `yarn add bootstrap@4.0.0-beta`
- Install with [Composer](https://getcomposer.org): `composer require twbs/bootstrap:4.0.0-beta`
- 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@4.0.0-beta`
- Install with [yarn](https://yarnpkg.com/): `yarn add bootstrap@4.0.0-beta`
- Install with [Composer](https://getcomposer.org/): `composer require twbs/bootstrap:4.0.0-beta`
- 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).
Read the [Getting started page](https://getbootstrap.com/getting-started/) for information on the framework contents, templates and examples, and more.
## Status
[![Slack](https://bootstrap-slack.herokuapp.com/badge.svg)](https://bootstrap-slack.herokuapp.com)
[![Slack](https://bootstrap-slack.herokuapp.com/badge.svg)](https://bootstrap-slack.herokuapp.com/)
[![npm version](https://img.shields.io/npm/v/bootstrap.svg)](https://www.npmjs.com/package/bootstrap)
[![Gem version](https://img.shields.io/gem/v/bootstrap.svg)](https://rubygems.org/gems/bootstrap)
[![Build Status](https://img.shields.io/travis/twbs/bootstrap/v4-dev.svg)](https://travis-ci.org/twbs/bootstrap)
@ -125,8 +125,8 @@ Editor preferences are available in the [editor config](https://github.com/twbs/
Get updates on Bootstrap's development and chat with the project maintainers and community members.
- 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).
- 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.
- 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.
@ -137,7 +137,7 @@ Get updates on Bootstrap's development and chat with the project maintainers and
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.
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.
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.
## Creators

View File

@ -16,24 +16,24 @@ baseurl: ""
url: "https://getbootstrap.com"
encoding: UTF-8
exclude:
- .git
- .github
- .git/
- .github/
- assets/scss/
- build
- js
- node_modules
- nuget
- scss
- vendor
- build/
- js/
- node_modules/
- nuget/
- scss/
- vendor/
- bower.json
- composer.json
- Gemfile
- Gemfile.lock
- Gruntfile.js
- package.js
- package.json
- package-lock.json
- sache.json
- twbsconfig.yml
plugins:
- jekyll-redirect-from
@ -53,15 +53,15 @@ current_version: 4.0.0-beta
docs_version: 4.0
repo: "https://github.com/twbs/bootstrap"
slack: "https://bootstrap-slack.herokuapp.com"
download:
source: "https://github.com/twbs/bootstrap/archive/v4.0.0-beta.zip"
dist: "https://github.com/twbs/bootstrap/releases/download/v4.0.0-beta/bootstrap-4.0.0-beta-dist.zip"
blog: "https://blog.getbootstrap.com"
expo: "https://expo.getbootstrap.com"
jobs: "https://jobs.getbootstrap.com"
themes: "https://themes.getbootstrap.com"
download:
source: "https://github.com/twbs/bootstrap/archive/v4.0.0-beta.zip"
dist: "https://github.com/twbs/bootstrap/releases/download/v4.0.0-beta/bootstrap-4.0.0-beta-dist.zip"
cdn:
# See https://www.srihash.org for info on how to generate the hashes
css: "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css"

View File

@ -52,7 +52,7 @@
browser: >
Edge
summary: >
Implement the [`of <selector-list>` clause](http://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
Implement the [`of <selector-list>` clause](https://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
upstream_bug: >
UserVoice#15944476
origin: >
@ -62,7 +62,7 @@
browser: >
Firefox
summary: >
Implement the [`of <selector-list>` clause](http://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
Implement the [`of <selector-list>` clause](https://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
upstream_bug: >
Mozilla#854148
origin: >
@ -102,7 +102,7 @@
browser: >
Chrome
summary: >
Implement the [`of <selector-list>` clause](http://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
Implement the [`of <selector-list>` clause](https://caniuse.com/#feat=css-nth-child-of) of the `:nth-child()` pseudo-class
upstream_bug: >
Chromium#304163
origin: >

View File

@ -37,3 +37,8 @@
- name: Johann-S
user: johann-s
gravatar: d90d49733a4fe1aa461e45cb4a4fd9e3
- name: Andres Galante
user: andresgalante
gravatar: 03dc4f2e26e476958c952505c8d8f563

View File

@ -5,7 +5,7 @@
- title: Contents
- title: Browsers & devices
- title: JavaScript
- title: Options
- title: Theming
- title: Build tools
# - title: Best practices # TODO: Write this content
- title: Webpack

View File

@ -9,7 +9,7 @@
img: vogue
- name: Riot Design
url: http://riotdesign.eu/en/
url: https://riot.design/en/
expo_url: https://expo.getbootstrap.com/2014/03/13/riot-design/
img: riot

View File

@ -36,7 +36,7 @@
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item active" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/">Latest (4.x)</a>
<a class="dropdown-item" href="https://v4-alpha.getbootstrap.com">v4 Alpha 6</a>
<a class="dropdown-item" href="https://v4-alpha.getbootstrap.com/">v4 Alpha 6</a>
<a class="dropdown-item" href="https://getbootstrap.com/3.3/">v3.3.7</a>
<a class="dropdown-item" href="https://getbootstrap.com/2.3.2/">v2.3.2</a>
</div>

View File

@ -1,6 +1,6 @@
<form class="bd-search d-flex align-items-center">
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off">
<button class="btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">
{% include icons/menu.svg class="" width="30" height="30" %}
</button>
</form>

View File

@ -24,7 +24,7 @@
{% if page.layout == "docs" %}
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
<script>
var docsearch = docsearch({
docsearch({
apiKey: '48cb48b22351bc71ea5f12f4d1ede198',
indexName: 'bootstrap-v4',
inputSelector: '#search-input',
@ -46,10 +46,10 @@
{% endif %}
<script>
Holder.addTheme('gray', {
bg: '#777',
fg: 'rgba(255,255,255,.75)',
font: 'Helvetica',
fontweight: 'normal'
});
Holder.addTheme('gray', {
bg: '#777',
fg: 'rgba(255,255,255,.75)',
font: 'Helvetica',
fontweight: 'normal'
});
</script>

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
{% include header.html %}

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
{% include header.html %}

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
{% include header.html %}

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">

View File

@ -34,7 +34,7 @@ Syntax Error in tag 'example' while parsing the following markup:
#{markup}
Valid syntax: example <lang>
Valid syntax: example <lang> [id=foo]
eos
end
end
@ -55,7 +55,7 @@ eos
end
def example(output)
"<div class=\"bd-example\" data-example-id=\"#{@options[:id]}\">\n#{output}\n</div>"
"<div class=\"bd-example\"" + (@options[:id] ? " data-example-id=\"#{@options[:id]}\"" : "") + ">\n#{output}\n</div>"
end
def remove_holderjs(code)

Binary file not shown.

Before

Width:  |  Height:  |  Size: 42 KiB

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 262 KiB

After

Width:  |  Height:  |  Size: 226 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.5 KiB

After

Width:  |  Height:  |  Size: 4.2 KiB

12
assets/js/docs.min.js vendored

File diff suppressed because one or more lines are too long

View File

@ -5,8 +5,23 @@
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('/sw.js').then(function (registration) {
navigator.serviceWorker.register('/sw.js').then(function (registration) { // eslint-disable-line compat/compat
console.log('ServiceWorker registration successful with scope: ', registration.scope)
registration.onupdatefound = function () {
var installingWorker = registration.installing
installingWorker.onstatechange = function () {
switch (installingWorker.state) {
case 'installed':
if (navigator.serviceWorker.controller) { // eslint-disable-line compat/compat
console.log('new update available')
location.reload(true)
}
break
default:
}
}
}
}).catch(function (err) {
console.log('ServiceWorker registration failed: ', err)
})

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,4 @@
// scss-lint:disable ImportantRule, IdSelector
// stylelint-disable declaration-no-important, selector-max-id
//
// Carbon ads

View File

@ -1,3 +1,5 @@
// stylelint-disable declaration-no-important
// Docsearch overrides
//
// `!important` indicates overridden properties.
@ -25,7 +27,7 @@
display: none !important;
}
[class^=ds-dataset-] {
[class^="ds-dataset-"] {
padding: 0 !important;
overflow: visible !important;
background-color: transparent !important;
@ -101,7 +103,7 @@
padding: 0 1rem .5rem !important;
margin-top: -.25rem;
font-size: .875rem !important;
font-weight: normal;
font-weight: 400;
line-height: 1.25 !important;
}

View File

@ -1,7 +1,5 @@
// scss-lint:disable ImportantRule
.anchorjs-link {
font-weight: normal;
font-weight: 400;
color: rgba($link-color, .5);
transition: color .16s linear;

View File

@ -1,4 +1,4 @@
// scss-lint:disable QualifyingElement
// stylelint-disable selector-no-qualifying-type
//
// Grid examples
@ -288,7 +288,8 @@
.modal {
z-index: 1072;
.tooltip, .popover {
.tooltip,
.popover {
z-index: 1073;
}
}

View File

@ -1,4 +1,4 @@
// scss-lint:disable IdSelector, NestingDepth, SelectorDepth, QualifyingElement
// stylelint-disable selector-max-combinators, selector-max-compound-selectors, selector-max-type, selector-no-qualifying-type
//
// Automatically style Markdown-based tables like a Bootstrap `.table`.

View File

@ -1,4 +1,4 @@
// scss-lint:disable ImportantRule
// stylelint-disable declaration-no-important
.bd-masthead {
position: relative;

View File

@ -1,4 +1,4 @@
// scss-lint:disable ImportantRule
// stylelint-disable declaration-no-important
.bd-pageheader {
padding: 2rem ($grid-gutter-width / 2);
@ -13,7 +13,7 @@
h1 {
font-size: 3rem;
font-weight: normal;
font-weight: 400;
color: #fff;
}

View File

@ -1,5 +1,3 @@
// scss-lint:disable ImportantRule
//
// Responsive tests
//
@ -12,6 +10,6 @@
// Utility classes table
.bd-table th small {
display: block;
font-weight: normal;
font-weight: 400;
color: #999;
}

View File

@ -1,4 +1,4 @@
// scss-lint:disable VendorPrefix
// stylelint-disable declaration-no-important
//
// Right side table of contents

View File

@ -1,4 +1,4 @@
// scss-lint:disable IdSelector
// stylelint-disable selector-max-id
#skippy {
display: block;

View File

@ -1,3 +1,5 @@
// stylelint-disable declaration-block-single-line-max-declarations
.hll { background-color: #ffc; }
.c { color: #999; }
.k { color: #069; }
@ -62,5 +64,15 @@
.css .o + .nt,
.css .nt + .nt { color: #999; }
.language-bash::before { color: #009; content: "$ "; user-select: none; }
.language-powershell::before { color: #009; content: "PM> "; user-select: none; }
.language-bash::before,
.language-sh::before {
color: #009;
content: "$ ";
user-select: none;
}
.language-powershell::before {
color: #009;
content: "PM> ";
user-select: none;
}

248
build/.stylelintrc Normal file
View File

@ -0,0 +1,248 @@
{
"extends": ["stylelint-config-standard", "stylelint-config-recommended-scss"],
"plugins": [
"stylelint-order"
],
"rules": {
"at-rule-empty-line-before": [null,
"except": ["first-nested"]
],
"at-rule-name-space-after": "always",
"at-rule-no-vendor-prefix": true,
"at-rule-semicolon-space-before": "never",
"block-closing-brace-empty-line-before": null,
"block-closing-brace-newline-after": null,
"block-opening-brace-space-before": null,
"color-named": "never",
"declaration-block-semicolon-newline-after": "always-multi-line",
"declaration-block-semicolon-newline-before": "never-multi-line",
"declaration-block-semicolon-space-after": "always-single-line",
"declaration-empty-line-before": null,
"declaration-no-important": true,
"font-family-name-quotes": "always-where-required",
"font-weight-notation": "numeric",
"function-comma-space-after": null,
"function-url-no-scheme-relative": true,
"function-url-quotes": "always",
"length-zero-no-unit": true,
"max-empty-lines": 2,
"max-line-length": null,
"media-feature-name-no-vendor-prefix": true,
"media-feature-parentheses-space-inside": "never",
"media-feature-range-operator-space-after": "always",
"media-feature-range-operator-space-before": "never",
"no-descending-specificity": null,
"no-duplicate-selectors": null,
"number-leading-zero": "never",
"order/properties-order": [
"position",
"top",
"right",
"bottom",
"left",
"z-index",
"box-sizing",
"display",
"flex",
"flex-align",
"flex-basis",
"flex-direction",
"flex-wrap",
"flex-flow",
"flex-grow",
"flex-order",
"flex-pack",
"align-items",
"align-self",
"justify-content",
"order",
"float",
"width",
"min-width",
"max-width",
"height",
"min-height",
"max-height",
"padding",
"padding-top",
"padding-right",
"padding-bottom",
"padding-left",
"margin",
"margin-top",
"margin-right",
"margin-bottom",
"margin-left",
"overflow",
"overflow-x",
"overflow-y",
"-webkit-overflow-scrolling",
"-ms-overflow-x",
"-ms-overflow-y",
"-ms-overflow-style",
"clip",
"clear",
"font",
"font-family",
"font-size",
"font-style",
"font-weight",
"font-variant",
"font-size-adjust",
"font-stretch",
"font-effect",
"font-emphasize",
"font-emphasize-position",
"font-emphasize-style",
"font-smooth",
"hyphens",
"line-height",
"color",
"text-align",
"text-align-last",
"text-emphasis",
"text-emphasis-color",
"text-emphasis-style",
"text-emphasis-position",
"text-decoration",
"text-indent",
"text-justify",
"text-outline",
"-ms-text-overflow",
"text-overflow",
"text-overflow-ellipsis",
"text-overflow-mode",
"text-shadow",
"text-transform",
"text-wrap",
"-webkit-text-size-adjust",
"-ms-text-size-adjust",
"letter-spacing",
"-ms-word-break",
"word-break",
"word-spacing",
"-ms-word-wrap",
"word-wrap",
"overflow-wrap",
"tab-size",
"white-space",
"vertical-align",
"list-style",
"list-style-position",
"list-style-type",
"list-style-image",
"pointer-events",
"-ms-touch-action",
"touch-action",
"cursor",
"visibility",
"zoom",
"table-layout",
"empty-cells",
"caption-side",
"border-spacing",
"border-collapse",
"content",
"quotes",
"counter-reset",
"counter-increment",
"resize",
"user-select",
"nav-index",
"nav-up",
"nav-right",
"nav-down",
"nav-left",
"background",
"background-color",
"background-image",
"filter",
"background-repeat",
"background-attachment",
"background-position",
"background-position-x",
"background-position-y",
"background-clip",
"background-origin",
"background-size",
"border",
"border-color",
"border-style",
"border-width",
"border-top",
"border-top-color",
"border-top-style",
"border-top-width",
"border-right",
"border-right-color",
"border-right-style",
"border-right-width",
"border-bottom",
"border-bottom-color",
"border-bottom-style",
"border-bottom-width",
"border-left",
"border-left-color",
"border-left-style",
"border-left-width",
"border-radius",
"border-top-left-radius",
"border-top-right-radius",
"border-bottom-right-radius",
"border-bottom-left-radius",
"border-image",
"border-image-source",
"border-image-slice",
"border-image-width",
"border-image-outset",
"border-image-repeat",
"outline",
"outline-width",
"outline-style",
"outline-color",
"outline-offset",
"box-shadow",
"opacity",
"-ms-interpolation-mode",
"transition",
"transition-delay",
"transition-timing-function",
"transition-duration",
"transition-property",
"transform",
"transform-origin",
"animation",
"animation-name",
"animation-duration",
"animation-play-state",
"animation-timing-function",
"animation-delay",
"animation-iteration-count",
"animation-direction"
],
"property-no-vendor-prefix": true,
"rule-empty-line-before": null,
"selector-attribute-quotes": "always",
"selector-list-comma-newline-after": "always",
"selector-list-comma-newline-before": "never-multi-line",
"selector-list-comma-space-after": "always-single-line",
"selector-list-comma-space-before": "never-single-line",
"selector-max-attribute": 2,
"selector-max-class": 4,
"selector-max-combinators": 4,
"selector-max-compound-selectors": 4,
"selector-max-empty-lines": 1,
"selector-max-id": 0,
"selector-max-specificity": null,
"selector-max-type": 2,
"selector-max-universal": 1,
"selector-no-qualifying-type": true,
"selector-no-vendor-prefix": true,
"string-quotes": "double",
"value-keyword-case": "lower",
"value-list-comma-newline-after": "never-multi-line",
"value-list-comma-newline-before": "never-multi-line",
"value-list-comma-space-after": "always",
"value-no-vendor-prefix": true
}
}

View File

@ -11,34 +11,30 @@
/* global Set */
var fs = require('fs')
var path = require('path')
var sh = require('shelljs')
const fs = require('fs')
const path = require('path')
const sh = require('shelljs')
sh.config.fatal = true
var sed = sh.sed
const sed = sh.sed
// Blame TC39... https://github.com/benjamingr/RegExp.escape/issues/37
RegExp.quote = function (string) {
return string.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&')
}
RegExp.quoteReplacement = function (string) {
return string.replace(/[$]/g, '$$')
}
RegExp.quote = (string) => string.replace(/[-\\^$*+?.()|[\]{}]/g, '\\$&')
RegExp.quoteReplacement = (string) => string.replace(/[$]/g, '$$')
var DRY_RUN = false
const DRY_RUN = false
function walkAsync(directory, excludedDirectories, fileCallback, errback) {
if (excludedDirectories.has(path.parse(directory).base)) {
return
}
fs.readdir(directory, function (err, names) {
fs.readdir(directory, (err, names) => {
if (err) {
errback(err)
return
}
names.forEach(function (name) {
var filepath = path.join(directory, name)
fs.lstat(filepath, function (err, stats) {
names.forEach((name) => {
const filepath = path.join(directory, name)
fs.lstat(filepath, (err, stats) => {
if (err) {
process.nextTick(errback, err)
return
@ -60,19 +56,19 @@ function walkAsync(directory, excludedDirectories, fileCallback, errback) {
function replaceRecursively(directory, excludedDirectories, allowedExtensions, original, replacement) {
original = new RegExp(RegExp.quote(original), 'g')
replacement = RegExp.quoteReplacement(replacement)
var updateFile = !DRY_RUN ? function (filepath) {
const updateFile = !DRY_RUN ? (filepath) => {
if (allowedExtensions.has(path.parse(filepath).ext)) {
sed('-i', original, replacement, filepath)
}
} : function (filepath) {
} : (filepath) => {
if (allowedExtensions.has(path.parse(filepath).ext)) {
console.log('FILE: ' + filepath)
console.log(`FILE: ${filepath}`)
}
else {
console.log('EXCLUDED:' + filepath)
console.log(`EXCLUDED:${filepath}`)
}
}
walkAsync(directory, excludedDirectories, updateFile, function (err) {
walkAsync(directory, excludedDirectories, updateFile, (err) => {
console.error('ERROR while traversing directory!:')
console.error(err)
process.exit(1)
@ -85,14 +81,14 @@ function main(args) {
console.error('Got arguments:', args)
process.exit(1)
}
var oldVersion = args[0]
var newVersion = args[1]
var EXCLUDED_DIRS = new Set([
const oldVersion = args[0]
const newVersion = args[1]
const EXCLUDED_DIRS = new Set([
'.git',
'node_modules',
'vendor'
])
var INCLUDED_EXTENSIONS = new Set([
const INCLUDED_EXTENSIONS = new Set([
// This extension whitelist is how we avoid modifying binary files
'',
'.css',

View File

@ -1,3 +1,5 @@
'use strict'
module.exports = (ctx) => ({
map: ctx.file.dirname.startsWith('docs') ? false : {
inline: false,
@ -5,27 +7,6 @@ module.exports = (ctx) => ({
sourcesContent: true
},
plugins: {
autoprefixer: {
browsers: [
//
// Official browser support policy:
// https://getbootstrap.com/docs/4.0/getting-started/browsers-devices/#supported-browsers
//
'Chrome >= 45', // Exact version number here is kinda arbitrary
'Firefox ESR',
// Note: Edge versions in Autoprefixer & Can I Use refer to the EdgeHTML rendering engine version,
// NOT the Edge app version shown in Edge's "About" screen.
// For example, at the time of writing, Edge 20 on an up-to-date system uses EdgeHTML 12.
// See also https://github.com/Fyrd/caniuse/issues/1928
'Edge >= 12',
'Explorer >= 10',
// Out of leniency, we prefix these 1 version further back than the official policy.
'iOS >= 9',
'Safari >= 9',
// The following remain NOT officially supported, but we're lenient and include their prefixes to avoid severely breaking in them.
'Android >= 4.4',
'Opera >= 30'
]
}
autoprefixer: {}
}
})

View File

@ -1,3 +1,5 @@
'use strict'
const path = require('path')
const babel = require('rollup-plugin-babel')
const resolve = require('rollup-plugin-node-resolve')
@ -5,17 +7,15 @@ const pkg = require(path.resolve(__dirname, '../package.json'))
const BUNDLE = process.env.BUNDLE === 'true'
const year = new Date().getFullYear()
var fileDest = 'bootstrap.js'
var external = ['jquery', 'popper.js']
let fileDest = 'bootstrap.js'
const external = ['jquery', 'popper.js']
const plugins = [
babel({
exclude: 'node_modules/**', // only transpile our source code
externalHelpersWhitelist: [ // include only required helpers
'typeof',
'classCallCheck',
'defineProperties',
'createClass',
'inherits',
'possibleConstructorReturn'
'inheritsLoose'
]
})
]
@ -46,6 +46,5 @@ module.exports = {
* Bootstrap v${pkg.version} (${pkg.homepage})
* Copyright 2011-${year} ${pkg.author}
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
`
*/`
}

65
build/sauce_browsers.json Normal file
View File

@ -0,0 +1,65 @@
[
{
"browserName": "safari",
"platform": "OS X 10.11",
"version": "latest"
},
{
"browserName": "chrome",
"platform": "OS X 10.11",
"version": "latest"
},
{
"browserName": "firefox",
"platform": "OS X 10.11",
"version": "latest"
},
{
"browserName": "MicrosoftEdge",
"platform": "Windows 10",
"version": "latest"
},
{
"browserName": "internet explorer",
"version": "11",
"platform": "Windows 8.1"
},
{
"browserName": "internet explorer",
"version": "10",
"platform": "Windows 8"
},
{
"browserName": "chrome",
"platform": "Windows 10",
"version": "latest"
},
{
"browserName": "firefox",
"platform": "Windows 10",
"version": "latest"
},
{
"browserName": "iphone",
"deviceName": "iPhone Simulator",
"platformName": "OS X 10.11",
"version": "9.3"
},
{
"browserName": "chrome",
"platform": "Linux",
"version": "latest"
},
{
"browserName": "firefox",
"platform": "Linux",
"version": "latest"
},
{
"platform": "Linux",
"browserName": "android",
"deviceName": "Android Emulator",
"version": "latest",
"deviceType": "phone"
}
]

View File

@ -1,79 +0,0 @@
[
# Docs: https://wiki.saucelabs.com/display/DOCS/Platform+Configurator
{
browserName: "safari",
platform: "OS X 10.11"
},
{
browserName: "chrome",
platform: "OS X 10.11",
version: "latest"
},
{
browserName: "firefox",
platform: "OS X 10.11",
version: "latest"
},
# Mac Opera not currently supported by Sauce Labs
{
browserName: "MicrosoftEdge",
platform: "Windows 10",
version: "latest"
},
{
browserName: "internet explorer",
version: "11",
platform: "Windows 8.1"
},
{
browserName: "internet explorer",
version: "10",
platform: "Windows 8"
},
{
browserName: "chrome",
platform: "Windows 10",
version: "latest"
},
{
browserName: "firefox",
platform: "Windows 10",
version: "latest"
},
# Win Opera 15+ not currently supported by Sauce Labs
{
browserName: "iphone",
deviceName: "iPhone Simulator",
platformName: "OS X 10.11",
version: "9.3"
},
# iOS Chrome not currently supported by Sauce Labs
# Linux (unofficial)
{
browserName: "chrome",
platform: "Linux",
version: "latest"
},
{
browserName: "firefox",
platform: "Linux",
version: "latest"
},
# Android
{
platform: "Linux",
browserName: "android",
deviceName: "Android Emulator",
version: "latest",
deviceType: "phone"
}
]

View File

@ -0,0 +1,95 @@
'use strict'
const path = require('path')
const JSUnitSaucelabs = require('jsunitsaucelabs')
// Docs: https://wiki.saucelabs.com/display/DOCS/Platform+Configurator
// Mac Opera is not currently supported by Sauce Labs
// Win Opera 15+ is not currently supported by Sauce Labs
// iOS Chrome is not currently supported by Sauce Labs
const jsUnitSaucelabs = new JSUnitSaucelabs({
username: process.env.SAUCE_USERNAME,
password: process.env.SAUCE_ACCESS_KEY,
build: process.env.TRAVIS_JOB_ID
})
const testURL = 'http://localhost:3000/js/tests/index.html?hidepassed'
const browsersFile = require(path.resolve(__dirname, './sauce_browsers.json'))
let jobsDone = 0
let jobsSucceeded = 0
const waitingCallback = (error, body, id) => {
if (error) {
console.error(error)
process.exit(1)
}
if (typeof body !== 'undefined') {
if (!body.completed) {
setTimeout(() => {
jsUnitSaucelabs.getStatus(id, (error, body) => {
waitingCallback(error, body, id)
})
}, 2000)
} else {
const test = body['js tests'][0]
let passed = false
let errorStr = false
if (test.result !== null) {
if (typeof test.result === 'string' && test.result === 'Test exceeded maximum duration') {
errorStr = test.result
} else {
passed = test.result.total === test.result.passed
}
}
console.log(`Tested ${testURL}`)
console.log(`Platform: ${test.platform.join(',')}`)
console.log(`Passed: ${passed.toString()}`)
console.log(`Url ${test.url} \n`)
if (errorStr) {
console.error(errorStr)
}
if (passed) {
jobsSucceeded++
}
jobsDone++
// Exit
if (jobsDone === browsersFile.length - 1) {
jsUnitSaucelabs.stop()
process.exit(jobsDone === jobsSucceeded ? 0 : 1)
}
}
}
}
jsUnitSaucelabs.on('tunnelCreated', () => {
browsersFile.forEach((tmpBrowser) => {
const browsersPlatform = typeof tmpBrowser.platform === 'undefined' ? tmpBrowser.platformName : tmpBrowser.platform
const browsersArray = [browsersPlatform, tmpBrowser.browserName, tmpBrowser.version]
jsUnitSaucelabs.start([browsersArray], testURL, 'qunit', (error, success) => {
if (typeof success !== 'undefined') {
const taskIds = success['js tests']
if (!taskIds || !taskIds.length) {
throw new Error('Error starting tests through Sauce Labs API')
}
taskIds.forEach((id) => {
jsUnitSaucelabs.getStatus(id, (error, body) => {
waitingCallback(error, body, id)
})
})
} else {
console.error(error)
}
})
})
})
jsUnitSaucelabs.initTunnel()

64
build/ship.sh Executable file
View File

@ -0,0 +1,64 @@
#!/usr/bin/env bash
#
# Usage
# ---------------
# 1. Clone second version of Bootstrap in sibling directory named `bs-docs`.
# 2. Within `bs-docs` copy, switch to `gh-pages` branch.
# 3. Pull latest, re-bundle, re-npm.
# 4. Run script.
red=$'\e[1;31m'
green=$'\e[1;32m'
blue=$'\e[1;34m'
magenta=$'\e[1;35m'
cyan=$'\e[1;36m'
end=$'\e[0m'
# Get current version from package.json
current_version=$(node -p "require('./package.json').version")
if [[ $# -lt 1 ]]; then
printf "\n${red}⚠️ Shipping aborted. You must specify a version.\n${end}"
exit 1
fi
# Pulling latest changes, just to be sure
printf "\n${magenta}=======================================================${end}"
printf "\n${magenta}Pulling latest changes...${end}"
printf "\n${magenta}=======================================================\n\n${end}"
git pull origin v4-dev
# Update version number
printf "\n${magenta}=======================================================${end}"
printf "\n${magenta}Updating version number...${end}"
printf "\n${magenta}=======================================================\n${end}"
npm run release-version $current_version $1
# Compile latest CSS and JS
printf "\n${magenta}=======================================================${end}"
printf "\n${magenta}Compile latest CSS and JS...${end}"
printf "\n${magenta}=======================================================\n${end}"
npm run dist
# Compress the dist files
printf "\n${magenta}=======================================================${end}"
printf "\n${magenta}Compressing the dist files...${end}"
printf "\n${magenta}=======================================================\n${end}"
npm run release-zip
# Compile the docs
printf "\n${magenta}=======================================================${end}"
printf "\n${magenta}Compile hosted documentation...${end}"
printf "\n${magenta}=======================================================\n${end}"
npm run docs-github
# Copy the contents of the built docs site over to `bs-docs` repo
printf "\n${magenta}=======================================================${end}"
printf "\n${magenta}Copy it over...${end}"
printf "\n${magenta}=======================================================\n${end}"
cp -rf _gh_pages/. ../bs-docs/
printf "\nDone!\n"
printf "\n${green}=======================================================${end}"
printf "\n${green}Success, $1 is ready to review and publish.${end}"
printf "\n${green}=======================================================\n\n${end}"

View File

@ -1,8 +0,0 @@
{
"output": {
"comments": "/^!/"
},
"compress": {
"typeofs": false
}
}

View File

@ -0,0 +1,8 @@
{
"globDirectory": "./",
"globPatterns": [
"_gh_pages/**/*.{html,css,js,json,png,jpg}"
],
"swSrc": "./sw.js",
"swDest": "./_gh_pages/sw.js"
}

39
build/workbox.js Normal file
View File

@ -0,0 +1,39 @@
'use strict'
const fs = require('fs')
const path = require('path')
const swBuild = require('workbox-build')
const config = require('./workbox.config.json')
const buildPrefix = '_gh_pages/'
const workboxSWSrcPath = require.resolve('workbox-sw')
const wbFileName = path.basename(workboxSWSrcPath)
const workboxSWDestPath = buildPrefix + 'assets/js/vendor/' + wbFileName
const workboxSWSrcMapPath = `${workboxSWSrcPath}.map`
const workboxSWDestMapPath = `${workboxSWDestPath}.map`
fs.createReadStream(workboxSWSrcPath).pipe(fs.createWriteStream(workboxSWDestPath))
fs.createReadStream(workboxSWSrcMapPath).pipe(fs.createWriteStream(workboxSWDestMapPath))
const updateUrl = (manifestEntries) => manifestEntries.map((entry) => {
if (entry.url.startsWith(buildPrefix)) {
const regex = new RegExp(buildPrefix, 'g')
entry.url = entry.url.replace(regex, '')
}
return entry
})
config.manifestTransforms = [updateUrl]
swBuild.injectManifest(config).then(() => {
const wbSwRegex = /{fileName}/g
fs.readFile(config.swDest, 'utf8', (err, data) => {
if (err) {
throw err
}
const swFileContents = data.replace(wbSwRegex, wbFileName)
fs.writeFile(config.swDest, swFileContents, () => {
console.log('Pre-cache Manifest generated.')
})
})
})

View File

@ -15,10 +15,10 @@ html {
.container {
width: 100%;
margin-right: auto;
margin-left: auto;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
@media (min-width: 576px) {
@ -47,10 +47,10 @@ html {
.container-fluid {
width: 100%;
margin-right: auto;
margin-left: auto;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.row {
@ -173,6 +173,11 @@ html {
max-width: 100%;
}
.order-first {
-ms-flex-order: -1;
order: -1;
}
.order-1 {
-ms-flex-order: 1;
order: 1;
@ -351,6 +356,10 @@ html {
flex: 0 0 100%;
max-width: 100%;
}
.order-sm-first {
-ms-flex-order: -1;
order: -1;
}
.order-sm-1 {
-ms-flex-order: 1;
order: 1;
@ -511,6 +520,10 @@ html {
flex: 0 0 100%;
max-width: 100%;
}
.order-md-first {
-ms-flex-order: -1;
order: -1;
}
.order-md-1 {
-ms-flex-order: 1;
order: 1;
@ -671,6 +684,10 @@ html {
flex: 0 0 100%;
max-width: 100%;
}
.order-lg-first {
-ms-flex-order: -1;
order: -1;
}
.order-lg-1 {
-ms-flex-order: 1;
order: 1;
@ -831,6 +848,10 @@ html {
flex: 0 0 100%;
max-width: 100%;
}
.order-xl-first {
-ms-flex-order: -1;
order: -1;
}
.order-xl-1 {
-ms-flex-order: 1;
order: 1;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -161,6 +161,7 @@ pre {
margin-top: 0;
margin-bottom: 1rem;
overflow: auto;
-ms-overflow-style: scrollbar;
}
figure {
@ -210,6 +211,10 @@ label {
margin-bottom: .5rem;
}
button {
border-radius: 0;
}
button:focus {
outline: 1px dotted;
outline: 5px auto -webkit-focus-ring-color;

File diff suppressed because one or more lines are too long

View File

@ -1,2 +1,2 @@
*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent;-webkit-text-decoration-skip:objects}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg:not(:root){overflow:hidden}[role=button],a,area,button,input:not([type=range]),label,select,summary,textarea{-ms-touch-action:manipulation;touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#868e96;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none!important}
*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent;-webkit-text-decoration-skip:objects}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg:not(:root){overflow:hidden}[role=button],a,area,button,input:not([type=range]),label,select,summary,textarea{-ms-touch-action:manipulation;touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#868e96;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none!important}
/*# sourceMappingURL=bootstrap-reboot.min.css.map */

File diff suppressed because one or more lines are too long

View File

@ -4,6 +4,37 @@
* Copyright 2011-2017 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
:root {
--blue: #007bff;
--indigo: #6610f2;
--purple: #6f42c1;
--pink: #e83e8c;
--red: #dc3545;
--orange: #fd7e14;
--yellow: #ffc107;
--green: #28a745;
--teal: #20c997;
--cyan: #17a2b8;
--white: #fff;
--gray: #868e96;
--gray-dark: #343a40;
--primary: #007bff;
--secondary: #868e96;
--success: #28a745;
--info: #17a2b8;
--warning: #ffc107;
--danger: #dc3545;
--light: #f8f9fa;
--dark: #343a40;
--breakpoint-xs: 0;
--breakpoint-sm: 576px;
--breakpoint-md: 768px;
--breakpoint-lg: 992px;
--breakpoint-xl: 1200px;
--font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
--font-family-monospace: "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
@media print {
*,
*::before,
@ -225,6 +256,7 @@ pre {
margin-top: 0;
margin-bottom: 1rem;
overflow: auto;
-ms-overflow-style: scrollbar;
}
figure {
@ -274,6 +306,10 @@ label {
margin-bottom: .5rem;
}
button {
border-radius: 0;
}
button:focus {
outline: 1px dotted;
outline: 5px auto -webkit-focus-ring-color;
@ -598,10 +634,10 @@ pre code {
.container {
width: 100%;
margin-right: auto;
margin-left: auto;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
@media (min-width: 576px) {
@ -630,10 +666,10 @@ pre code {
.container-fluid {
width: 100%;
margin-right: auto;
margin-left: auto;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.row {
@ -756,6 +792,11 @@ pre code {
max-width: 100%;
}
.order-first {
-ms-flex-order: -1;
order: -1;
}
.order-1 {
-ms-flex-order: 1;
order: 1;
@ -934,6 +975,10 @@ pre code {
flex: 0 0 100%;
max-width: 100%;
}
.order-sm-first {
-ms-flex-order: -1;
order: -1;
}
.order-sm-1 {
-ms-flex-order: 1;
order: 1;
@ -1094,6 +1139,10 @@ pre code {
flex: 0 0 100%;
max-width: 100%;
}
.order-md-first {
-ms-flex-order: -1;
order: -1;
}
.order-md-1 {
-ms-flex-order: 1;
order: 1;
@ -1254,6 +1303,10 @@ pre code {
flex: 0 0 100%;
max-width: 100%;
}
.order-lg-first {
-ms-flex-order: -1;
order: -1;
}
.order-lg-1 {
-ms-flex-order: 1;
order: 1;
@ -1414,6 +1467,10 @@ pre code {
flex: 0 0 100%;
max-width: 100%;
}
.order-xl-first {
-ms-flex-order: -1;
order: -1;
}
.order-xl-1 {
-ms-flex-order: 1;
order: 1;
@ -1791,14 +1848,14 @@ pre code {
.form-control {
display: block;
width: 100%;
padding: 0.5rem 0.75rem;
padding: 0.375rem 0.75rem;
font-size: 1rem;
line-height: 1.25;
line-height: 1.5;
color: #495057;
background-color: #fff;
background-image: none;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
border: 1px solid #ced4da;
border-radius: 0.25rem;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
@ -1850,35 +1907,38 @@ select.form-control:focus::-ms-value {
}
.col-form-label {
padding-top: calc(0.5rem - 1px * 2);
padding-bottom: calc(0.5rem - 1px * 2);
padding-top: calc(0.375rem + 1px);
padding-bottom: calc(0.375rem + 1px);
margin-bottom: 0;
line-height: 1.5;
}
.col-form-label-lg {
padding-top: calc(0.5rem - 1px * 2);
padding-bottom: calc(0.5rem - 1px * 2);
padding-top: calc(0.5rem + 1px);
padding-bottom: calc(0.5rem + 1px);
font-size: 1.25rem;
line-height: 1.5;
}
.col-form-label-sm {
padding-top: calc(0.25rem - 1px * 2);
padding-bottom: calc(0.25rem - 1px * 2);
padding-top: calc(0.25rem + 1px);
padding-bottom: calc(0.25rem + 1px);
font-size: 0.875rem;
line-height: 1.5;
}
.col-form-legend {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
padding-top: 0.375rem;
padding-bottom: 0.375rem;
margin-bottom: 0;
font-size: 1rem;
}
.form-control-plaintext {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
padding-top: 0.375rem;
padding-bottom: 0.375rem;
margin-bottom: 0;
line-height: 1.25;
line-height: 1.5;
background-color: transparent;
border: solid transparent;
border-width: 1px 0;
@ -1977,14 +2037,14 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
vertical-align: middle;
}
.invalid-feedback {
.valid-feedback {
display: none;
margin-top: .25rem;
font-size: .875rem;
color: #dc3545;
color: #28a745;
}
.invalid-tooltip {
.valid-tooltip {
position: absolute;
top: 100%;
z-index: 5;
@ -1995,7 +2055,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
font-size: .875rem;
line-height: 1;
color: #fff;
background-color: rgba(220, 53, 69, 0.8);
background-color: rgba(40, 167, 69, 0.8);
border-radius: .2rem;
}
@ -2046,6 +2106,28 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
}
.invalid-feedback {
display: none;
margin-top: .25rem;
font-size: .875rem;
color: #dc3545;
}
.invalid-tooltip {
position: absolute;
top: 100%;
z-index: 5;
display: none;
width: 250px;
padding: .5rem;
margin-top: .1rem;
font-size: .875rem;
line-height: 1;
color: #fff;
background-color: rgba(220, 53, 69, 0.8);
border-radius: .2rem;
}
.was-validated .form-control:invalid, .form-control.is-invalid, .was-validated
.custom-select:invalid,
.custom-select.is-invalid {
@ -2193,9 +2275,9 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
-ms-user-select: none;
user-select: none;
border: 1px solid transparent;
padding: 0.5rem 0.75rem;
padding: 0.375rem 0.75rem;
font-size: 1rem;
line-height: 1.25;
line-height: 1.5;
border-radius: 0.25rem;
transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@ -2682,7 +2764,6 @@ fieldset[disabled] a.btn {
font-weight: normal;
color: #007bff;
background-color: transparent;
border-radius: 0;
}
.btn-link:hover {
@ -2776,6 +2857,7 @@ tbody.collapse.show {
content: "";
border-top: 0.3em solid;
border-right: 0.3em solid transparent;
border-bottom: 0;
border-left: 0.3em solid transparent;
}
@ -2789,8 +2871,20 @@ tbody.collapse.show {
}
.dropup .dropdown-toggle::after {
display: inline-block;
width: 0;
height: 0;
margin-left: 0.255em;
vertical-align: 0.255em;
content: "";
border-top: 0;
border-right: 0.3em solid transparent;
border-bottom: 0.3em solid;
border-left: 0.3em solid transparent;
}
.dropup .dropdown-toggle:empty::after {
margin-left: 0;
}
.dropdown-menu {
@ -2850,10 +2944,6 @@ tbody.collapse.show {
background-color: transparent;
}
.show > a {
outline: 0;
}
.dropdown-menu.show {
display: block;
}
@ -3001,12 +3091,12 @@ tbody.collapse.show {
border-radius: 0;
}
.btn-group-vertical:first-child:not(:last-child) {
.btn-group-vertical > .btn:first-child:not(:last-child) {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.btn-group-vertical:last-child:not(:first-child) {
.btn-group-vertical > .btn:last-child:not(:first-child) {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
@ -3039,8 +3129,8 @@ tbody.collapse.show {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
-ms-flex-align: stretch;
align-items: stretch;
width: 100%;
}
@ -3057,6 +3147,15 @@ tbody.collapse.show {
z-index: 3;
}
.input-group-addon,
.input-group-btn,
.input-group .form-control {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
}
.input-group-addon:not(:first-child):not(:last-child),
.input-group-btn:not(:first-child):not(:last-child),
.input-group .form-control:not(:first-child):not(:last-child) {
@ -3069,16 +3168,15 @@ tbody.collapse.show {
}
.input-group-addon {
padding: 0.5rem 0.75rem;
padding: 0.375rem 0.75rem;
margin-bottom: 0;
font-size: 1rem;
font-weight: normal;
line-height: 1.25;
line-height: 1.5;
color: #495057;
text-align: center;
background-color: #e9ecef;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
border: 1px solid #ced4da;
border-radius: 0.25rem;
}
@ -3135,14 +3233,14 @@ tbody.collapse.show {
.input-group-btn {
position: relative;
-ms-flex-align: stretch;
align-items: stretch;
font-size: 0;
white-space: nowrap;
}
.input-group-btn > .btn {
position: relative;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
}
.input-group-btn > .btn + .btn {
@ -3153,6 +3251,10 @@ tbody.collapse.show {
z-index: 3;
}
.input-group-btn:first-child > .btn + .btn {
margin-left: 0;
}
.input-group-btn:not(:last-child) > .btn,
.input-group-btn:not(:last-child) > .btn-group {
margin-right: -1px;
@ -3161,6 +3263,11 @@ tbody.collapse.show {
.input-group-btn:not(:first-child) > .btn,
.input-group-btn:not(:first-child) > .btn-group {
z-index: 2;
margin-left: 0;
}
.input-group-btn:not(:first-child) > .btn:first-child,
.input-group-btn:not(:first-child) > .btn-group:first-child {
margin-left: -1px;
}
@ -3267,13 +3374,12 @@ tbody.collapse.show {
max-width: 100%;
height: calc(2.25rem + 2px);
padding: 0.375rem 1.75rem 0.375rem 0.75rem;
line-height: 1.25;
line-height: 1.5;
color: #495057;
vertical-align: middle;
background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.75rem center;
background-clip: padding-box;
background-size: 8px 10px;
border: 1px solid rgba(0, 0, 0, 0.15);
border: 1px solid #ced4da;
border-radius: 0.25rem;
-webkit-appearance: none;
-moz-appearance: none;
@ -3290,6 +3396,11 @@ tbody.collapse.show {
background-color: #fff;
}
.custom-select[multiple] {
height: auto;
background-image: none;
}
.custom-select:disabled {
color: #868e96;
background-color: #e9ecef;
@ -3333,9 +3444,8 @@ tbody.collapse.show {
left: 0;
z-index: 5;
height: calc(2.25rem + 2px);
padding: 0.5rem 0.75rem;
overflow: hidden;
line-height: 1.25;
padding: 0.375rem 0.75rem;
line-height: 1.5;
color: #495057;
pointer-events: none;
-webkit-user-select: none;
@ -3343,8 +3453,7 @@ tbody.collapse.show {
-ms-user-select: none;
user-select: none;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.15);
border: 1px solid #ced4da;
border-radius: 0.25rem;
}
@ -3354,16 +3463,18 @@ tbody.collapse.show {
.custom-file-control::before {
position: absolute;
top: 0;
right: 0;
top: -1px;
right: -1px;
bottom: -1px;
z-index: 6;
display: block;
height: calc(2.25rem + 2px);
padding: 0.5rem 0.75rem;
line-height: 1.25;
padding: 0.375rem 0.75rem;
line-height: 1.5;
color: #495057;
background-color: #e9ecef;
border-left: 1px solid rgba(0, 0, 0, 0.15);
border: 1px solid #ced4da;
border-radius: 0 0.25rem 0.25rem 0;
}
.custom-file-control:lang(en)::before {
@ -3435,7 +3546,7 @@ tbody.collapse.show {
}
.nav-pills .nav-link.active,
.show > .nav-pills .nav-link {
.nav-pills .show > .nav-link {
color: #fff;
background-color: #007bff;
}
@ -3569,10 +3680,8 @@ tbody.collapse.show {
@media (min-width: 576px) {
.navbar-expand-sm {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-ms-flex-pack: start;
justify-content: flex-start;
}
@ -3617,10 +3726,8 @@ tbody.collapse.show {
@media (min-width: 768px) {
.navbar-expand-md {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-ms-flex-pack: start;
justify-content: flex-start;
}
@ -3665,10 +3772,8 @@ tbody.collapse.show {
@media (min-width: 992px) {
.navbar-expand-lg {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-ms-flex-pack: start;
justify-content: flex-start;
}
@ -3713,10 +3818,8 @@ tbody.collapse.show {
@media (min-width: 1200px) {
.navbar-expand-xl {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-ms-flex-pack: start;
justify-content: flex-start;
}
@ -3752,10 +3855,8 @@ tbody.collapse.show {
}
.navbar-expand {
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-ms-flex-pack: start;
justify-content: flex-start;
}
@ -3842,6 +3943,14 @@ tbody.collapse.show {
color: rgba(0, 0, 0, 0.5);
}
.navbar-light .navbar-text a {
color: rgba(0, 0, 0, 0.9);
}
.navbar-light .navbar-text a:focus, .navbar-light .navbar-text a:hover {
color: rgba(0, 0, 0, 0.9);
}
.navbar-dark .navbar-brand {
color: white;
}
@ -3882,6 +3991,14 @@ tbody.collapse.show {
color: rgba(255, 255, 255, 0.5);
}
.navbar-dark .navbar-text a {
color: white;
}
.navbar-dark .navbar-text a:focus, .navbar-dark .navbar-text a:hover {
color: white;
}
.card {
position: relative;
display: -ms-flexbox;
@ -3896,6 +4013,11 @@ tbody.collapse.show {
border-radius: 0.25rem;
}
.card > hr {
margin-right: 0;
margin-left: 0;
}
.card-body {
-ms-flex: 1 1 auto;
flex: 1 1 auto;
@ -3933,10 +4055,6 @@ tbody.collapse.show {
border-bottom-left-radius: 0.25rem;
}
.card .card-header + .list-group > .list-group-item:first-child {
border-top: 0;
}
.card-header {
padding: 0.75rem 1.25rem;
margin-bottom: 0;
@ -3948,6 +4066,10 @@ tbody.collapse.show {
border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}
.card-header + .list-group .list-group-item:first-child {
border-top: 0;
}
.card-footer {
padding: 0.75rem 1.25rem;
background-color: rgba(0, 0, 0, 0.03);
@ -4072,13 +4194,16 @@ tbody.collapse.show {
.card-group .card:last-child .card-img-bottom {
border-bottom-left-radius: 0;
}
.card-group .card:not(:first-child):not(:last-child) {
.card-group .card:not(:first-child):not(:last-child):not(:only-child) {
border-radius: 0;
}
.card-group .card:not(:first-child):not(:last-child) .card-img-top,
.card-group .card:not(:first-child):not(:last-child) .card-img-bottom {
.card-group .card:not(:first-child):not(:last-child):not(:only-child) .card-img-top,
.card-group .card:not(:first-child):not(:last-child):not(:only-child) .card-img-bottom {
border-radius: 0;
}
.card-group .card:only-child {
border-radius: 0.25rem;
}
}
.card-columns .card {
@ -4348,6 +4473,7 @@ tbody.collapse.show {
}
.alert {
position: relative;
padding: 0.75rem 1.25rem;
margin-bottom: 1rem;
border: 1px solid transparent;
@ -4363,9 +4489,9 @@ tbody.collapse.show {
}
.alert-dismissible .close {
position: relative;
top: -0.75rem;
right: -1.25rem;
position: absolute;
top: 0;
right: 0;
padding: 0.75rem 1.25rem;
color: inherit;
}
@ -4607,10 +4733,15 @@ tbody.collapse.show {
.list-group-flush .list-group-item {
border-right: 0;
border-bottom: 0;
border-left: 0;
border-radius: 0;
}
.list-group-flush .list-group-item:first-child {
border-top: 0;
}
.list-group-flush:first-child .list-group-item:first-child {
border-top: 0;
}
@ -4910,16 +5041,19 @@ button.close {
.modal-header {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 15px;
border-bottom: 1px solid #e9ecef;
border-top-left-radius: 0.3rem;
border-top-right-radius: 0.3rem;
}
.modal-header .close {
margin-left: auto;
padding: 15px;
margin: -15px -15px -15px auto;
}
.modal-title {
@ -5679,6 +5813,10 @@ a.bg-dark:focus, a.bg-dark:hover {
display: table !important;
}
.d-table-row {
display: table-row !important;
}
.d-table-cell {
display: table-cell !important;
}
@ -5709,6 +5847,9 @@ a.bg-dark:focus, a.bg-dark:hover {
.d-sm-table {
display: table !important;
}
.d-sm-table-row {
display: table-row !important;
}
.d-sm-table-cell {
display: table-cell !important;
}
@ -5738,6 +5879,9 @@ a.bg-dark:focus, a.bg-dark:hover {
.d-md-table {
display: table !important;
}
.d-md-table-row {
display: table-row !important;
}
.d-md-table-cell {
display: table-cell !important;
}
@ -5767,6 +5911,9 @@ a.bg-dark:focus, a.bg-dark:hover {
.d-lg-table {
display: table !important;
}
.d-lg-table-row {
display: table-row !important;
}
.d-lg-table-cell {
display: table-cell !important;
}
@ -5796,6 +5943,9 @@ a.bg-dark:focus, a.bg-dark:hover {
.d-xl-table {
display: table !important;
}
.d-xl-table-row {
display: table-row !important;
}
.d-xl-table-cell {
display: table-cell !important;
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -3,7 +3,6 @@
* Copyright 2011-2017 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
var bootstrap = (function (exports,$) {
'use strict';
@ -17,32 +16,25 @@ $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
*/
var Util = function () {
/**
* ------------------------------------------------------------------------
* Private TransitionEnd Helpers
* ------------------------------------------------------------------------
*/
var transition = false;
var MAX_UID = 1000000;
var TransitionEndEvent = {
WebkitTransition: 'webkitTransitionEnd',
MozTransition: 'transitionend',
OTransition: 'oTransitionEnd otransitionend',
transition: 'transitionend'
transition: 'transitionend' // shoutout AngusCroll (https://goo.gl/pxwQGp)
// shoutout AngusCroll (https://goo.gl/pxwQGp)
};function toType(obj) {
};
function toType(obj) {
return {}.toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase();
}
function isElement(obj) {
return (obj[0] || obj).nodeType;
}
function getSpecialTransitionEndEvent() {
return {
bindType: transition.end,
@ -51,6 +43,7 @@ var Util = function () {
if ($(event.target).is(this)) {
return event.handleObj.handler.apply(this, arguments); // eslint-disable-line prefer-rest-params
}
return undefined; // eslint-disable-line no-undefined
}
};
@ -78,49 +71,45 @@ var Util = function () {
var _this = this;
var called = false;
$(this).one(Util.TRANSITION_END, function () {
called = true;
});
setTimeout(function () {
if (!called) {
Util.triggerTransitionEnd(_this);
}
}, duration);
return this;
}
function setTransitionEndSupport() {
transition = transitionEndTest();
$.fn.emulateTransitionEnd = transitionEndEmulator;
if (Util.supportsTransitionEnd()) {
$.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent();
}
}
/**
* --------------------------------------------------------------------------
* Public Util Api
* --------------------------------------------------------------------------
*/
var Util = {
TRANSITION_END: 'bsTransitionEnd',
getUID: function getUID(prefix) {
do {
// eslint-disable-next-line no-bitwise
prefix += ~~(Math.random() * MAX_UID); // "~~" acts like a faster Math.floor() here
} while (document.getElementById(prefix));
return prefix;
},
getSelectorFromElement: function getSelectorFromElement(element) {
var selector = element.getAttribute('data-target');
if (!selector || selector === '#') {
selector = element.getAttribute('href') || '';
}
@ -141,82 +130,52 @@ var Util = function () {
supportsTransitionEnd: function supportsTransitionEnd() {
return Boolean(transition);
},
isElement: function isElement(obj) {
return (obj[0] || obj).nodeType;
},
typeCheckConfig: function typeCheckConfig(componentName, config, configTypes) {
for (var property in configTypes) {
if (Object.prototype.hasOwnProperty.call(configTypes, property)) {
var expectedTypes = configTypes[property];
var value = config[property];
var valueType = value && isElement(value) ? 'element' : toType(value);
var valueType = value && Util.isElement(value) ? 'element' : toType(value);
if (!new RegExp(expectedTypes).test(valueType)) {
throw new Error(componentName.toUpperCase() + ': ' + ('Option "' + property + '" provided type "' + valueType + '" ') + ('but expected type "' + expectedTypes + '".'));
throw new Error(componentName.toUpperCase() + ": " + ("Option \"" + property + "\" provided type \"" + valueType + "\" ") + ("but expected type \"" + expectedTypes + "\"."));
}
}
}
}
};
setTransitionEndSupport();
return Util;
}(jQuery);
var babelHelpers = {};
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
var classCallCheck = function (instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
};
}
var createClass = function () {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
return function (Constructor, protoProps, staticProps) {
if (protoProps) defineProperties(Constructor.prototype, protoProps);
if (staticProps) defineProperties(Constructor, staticProps);
return Constructor;
};
}();
var createClass = _createClass;
var inherits = function (subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
subClass.__proto__ = superClass;
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: false,
writable: true,
configurable: true
}
});
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
};
var possibleConstructorReturn = function (self, call) {
if (!self) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return call && (typeof call === "object" || typeof call === "function") ? call : self;
};
babelHelpers;
var inheritsLoose = _inheritsLoose;
/**
* --------------------------------------------------------------------------
@ -226,36 +185,30 @@ babelHelpers;
*/
var Alert = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'alert';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.alert';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 150;
var Selector = {
DISMISS: '[data-dismiss="alert"]'
};
var Event = {
CLOSE: 'close' + EVENT_KEY,
CLOSED: 'closed' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
CLOSE: "close" + EVENT_KEY,
CLOSED: "closed" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
ALERT: 'alert',
FADE: 'fade',
SHOW: 'show'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -263,21 +216,23 @@ var Alert = function () {
*/
};
var Alert = function () {
var Alert =
/*#__PURE__*/
function () {
function Alert(element) {
classCallCheck(this, Alert);
this._element = element;
}
} // getters
// getters
var _proto = Alert.prototype;
// public
Alert.prototype.close = function close(element) {
_proto.close = function close(element) {
element = element || this._element;
var rootElement = this._getRootElement(element);
var customEvent = this._triggerCloseEvent(rootElement);
if (customEvent.isDefaultPrevented()) {
@ -287,14 +242,13 @@ var Alert = function () {
this._removeElement(rootElement);
};
Alert.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
}; // private
// private
Alert.prototype._getRootElement = function _getRootElement(element) {
_proto._getRootElement = function _getRootElement(element) {
var selector = Util.getSelectorFromElement(element);
var parent = false;
@ -303,26 +257,26 @@ var Alert = function () {
}
if (!parent) {
parent = $(element).closest('.' + ClassName.ALERT)[0];
parent = $(element).closest("." + ClassName.ALERT)[0];
}
return parent;
};
Alert.prototype._triggerCloseEvent = function _triggerCloseEvent(element) {
_proto._triggerCloseEvent = function _triggerCloseEvent(element) {
var closeEvent = $.Event(Event.CLOSE);
$(element).trigger(closeEvent);
return closeEvent;
};
Alert.prototype._removeElement = function _removeElement(element) {
_proto._removeElement = function _removeElement(element) {
var _this = this;
$(element).removeClass(ClassName.SHOW);
if (!Util.supportsTransitionEnd() || !$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element);
return;
}
@ -331,11 +285,10 @@ var Alert = function () {
}).emulateTransitionEnd(TRANSITION_DURATION);
};
Alert.prototype._destroyElement = function _destroyElement(element) {
_proto._destroyElement = function _destroyElement(element) {
$(element).detach().trigger(Event.CLOSED).remove();
};
}; // static
// static
Alert._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
@ -364,22 +317,21 @@ var Alert = function () {
};
createClass(Alert, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}]);
return Alert;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DISMISS, Alert._handleDismiss(new Alert()));
$(document).on(Event.CLICK_DATA_API, Selector.DISMISS, Alert._handleDismiss(new Alert()));
/**
* ------------------------------------------------------------------------
* jQuery
@ -388,6 +340,7 @@ var Alert = function () {
$.fn[NAME] = Alert._jQueryInterface;
$.fn[NAME].Constructor = Alert;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Alert._jQueryInterface;
@ -404,26 +357,22 @@ var Alert = function () {
*/
var Button = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'button';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.button';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var ClassName = {
ACTIVE: 'active',
BUTTON: 'btn',
FOCUS: 'focus'
};
var Selector = {
DATA_TOGGLE_CARROT: '[data-toggle^="button"]',
DATA_TOGGLE: '[data-toggle="buttons"]',
@ -431,11 +380,9 @@ var Button = function () {
ACTIVE: '.active',
BUTTON: '.btn'
};
var Event = {
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY,
FOCUS_BLUR_DATA_API: 'focus' + EVENT_KEY + DATA_API_KEY + ' ' + ('blur' + EVENT_KEY + DATA_API_KEY)
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
FOCUS_BLUR_DATA_API: "focus" + EVENT_KEY + DATA_API_KEY + " " + ("blur" + EVENT_KEY + DATA_API_KEY)
/**
* ------------------------------------------------------------------------
* Class Definition
@ -443,18 +390,19 @@ var Button = function () {
*/
};
var Button = function () {
var Button =
/*#__PURE__*/
function () {
function Button(element) {
classCallCheck(this, Button);
this._element = element;
}
} // getters
// getters
var _proto = Button.prototype;
// public
Button.prototype.toggle = function toggle() {
_proto.toggle = function toggle() {
var triggerChangeEvent = true;
var addAriaPressed = true;
var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
@ -479,6 +427,7 @@ var Button = function () {
if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) {
return;
}
input.checked = !$(this._element).hasClass(ClassName.ACTIVE);
$(input).trigger('change');
}
@ -497,12 +446,11 @@ var Button = function () {
}
};
Button.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
}; // static
// static
Button._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
@ -520,23 +468,22 @@ var Button = function () {
};
createClass(Button, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}]);
return Button;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, function (event) {
event.preventDefault();
var button = event.target;
if (!$(button).hasClass(ClassName.BUTTON)) {
@ -548,7 +495,6 @@ var Button = function () {
var button = $(event.target).closest(Selector.BUTTON)[0];
$(button).toggleClass(ClassName.FOCUS, /^focus(in)?$/.test(event.type));
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -557,6 +503,7 @@ var Button = function () {
$.fn[NAME] = Button._jQueryInterface;
$.fn[NAME].Constructor = Button;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Button._jQueryInterface;
@ -573,22 +520,22 @@ var Button = function () {
*/
var Carousel = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'carousel';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.carousel';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 600;
var ARROW_LEFT_KEYCODE = 37; // KeyboardEvent.which value for left arrow key
var ARROW_RIGHT_KEYCODE = 39; // KeyboardEvent.which value for right arrow key
var TOUCHEVENT_COMPAT_WAIT = 500; // Time for mouse compat events to fire after touch
var Default = {
@ -598,7 +545,6 @@ var Carousel = function () {
pause: 'hover',
wrap: true
};
var DefaultType = {
interval: '(number|boolean)',
keyboard: 'boolean',
@ -606,25 +552,22 @@ var Carousel = function () {
pause: '(string|boolean)',
wrap: 'boolean'
};
var Direction = {
NEXT: 'next',
PREV: 'prev',
LEFT: 'left',
RIGHT: 'right'
};
var Event = {
SLIDE: 'slide' + EVENT_KEY,
SLID: 'slid' + EVENT_KEY,
KEYDOWN: 'keydown' + EVENT_KEY,
MOUSEENTER: 'mouseenter' + EVENT_KEY,
MOUSELEAVE: 'mouseleave' + EVENT_KEY,
TOUCHEND: 'touchend' + EVENT_KEY,
LOAD_DATA_API: 'load' + EVENT_KEY + DATA_API_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
SLIDE: "slide" + EVENT_KEY,
SLID: "slid" + EVENT_KEY,
KEYDOWN: "keydown" + EVENT_KEY,
MOUSEENTER: "mouseenter" + EVENT_KEY,
MOUSELEAVE: "mouseleave" + EVENT_KEY,
TOUCHEND: "touchend" + EVENT_KEY,
LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
CAROUSEL: 'carousel',
ACTIVE: 'active',
@ -635,7 +578,6 @@ var Carousel = function () {
PREV: 'carousel-item-prev',
ITEM: 'carousel-item'
};
var Selector = {
ACTIVE: '.active',
ACTIVE_ITEM: '.active.carousel-item',
@ -644,7 +586,6 @@ var Carousel = function () {
INDICATORS: '.carousel-indicators',
DATA_SLIDE: '[data-slide], [data-slide-to]',
DATA_RIDE: '[data-ride="carousel"]'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -652,37 +593,35 @@ var Carousel = function () {
*/
};
var Carousel = function () {
function Carousel(element, config) {
classCallCheck(this, Carousel);
var Carousel =
/*#__PURE__*/
function () {
function Carousel(element, config) {
this._items = null;
this._interval = null;
this._activeElement = null;
this._isPaused = false;
this._isSliding = false;
this.touchTimeout = null;
this._config = this._getConfig(config);
this._element = $(element)[0];
this._indicatorsElement = $(this._element).find(Selector.INDICATORS)[0];
this._addEventListeners();
}
} // getters
// getters
var _proto = Carousel.prototype;
// public
Carousel.prototype.next = function next() {
_proto.next = function next() {
if (!this._isSliding) {
this._slide(Direction.NEXT);
}
};
Carousel.prototype.nextWhenVisible = function nextWhenVisible() {
_proto.nextWhenVisible = function nextWhenVisible() {
// Don't call next when the page isn't visible
// or the carousel or its parent isn't visible
if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') {
@ -690,13 +629,13 @@ var Carousel = function () {
}
};
Carousel.prototype.prev = function prev() {
_proto.prev = function prev() {
if (!this._isSliding) {
this._slide(Direction.PREV);
}
};
Carousel.prototype.pause = function pause(event) {
_proto.pause = function pause(event) {
if (!event) {
this._isPaused = true;
}
@ -710,7 +649,7 @@ var Carousel = function () {
this._interval = null;
};
Carousel.prototype.cycle = function cycle(event) {
_proto.cycle = function cycle(event) {
if (!event) {
this._isPaused = false;
}
@ -725,7 +664,7 @@ var Carousel = function () {
}
};
Carousel.prototype.to = function to(index) {
_proto.to = function to(index) {
var _this = this;
this._activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
@ -754,10 +693,9 @@ var Carousel = function () {
this._slide(direction, this._items[index]);
};
Carousel.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$(this._element).off(EVENT_KEY);
$.removeData(this._element, DATA_KEY);
this._items = null;
this._config = null;
this._element = null;
@ -766,17 +704,16 @@ var Carousel = function () {
this._isSliding = null;
this._activeElement = null;
this._indicatorsElement = null;
};
}; // private
// private
Carousel.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Carousel.prototype._addEventListeners = function _addEventListeners() {
_proto._addEventListeners = function _addEventListeners() {
var _this2 = this;
if (this._config.keyboard) {
@ -791,6 +728,7 @@ var Carousel = function () {
}).on(Event.MOUSELEAVE, function (event) {
return _this2.cycle(event);
});
if ('ontouchstart' in document.documentElement) {
// if it's a touch-enabled device, mouseenter/leave are fired as
// part of the mouse compatibility events on first tap - the carousel
@ -801,9 +739,11 @@ var Carousel = function () {
// events to fire) we explicitly restart cycling
$(this._element).on(Event.TOUCHEND, function () {
_this2.pause();
if (_this2.touchTimeout) {
clearTimeout(_this2.touchTimeout);
}
_this2.touchTimeout = setTimeout(function (event) {
return _this2.cycle(event);
}, TOUCHEVENT_COMPAT_WAIT + _this2._config.interval);
@ -812,7 +752,7 @@ var Carousel = function () {
}
};
Carousel.prototype._keydown = function _keydown(event) {
_proto._keydown = function _keydown(event) {
if (/input|textarea/i.test(event.target.tagName)) {
return;
}
@ -822,24 +762,28 @@ var Carousel = function () {
event.preventDefault();
this.prev();
break;
case ARROW_RIGHT_KEYCODE:
event.preventDefault();
this.next();
break;
default:
return;
}
};
Carousel.prototype._getItemIndex = function _getItemIndex(element) {
_proto._getItemIndex = function _getItemIndex(element) {
this._items = $.makeArray($(element).parent().find(Selector.ITEM));
return this._items.indexOf(element);
};
Carousel.prototype._getItemByDirection = function _getItemByDirection(direction, activeElement) {
_proto._getItemByDirection = function _getItemByDirection(direction, activeElement) {
var isNextDirection = direction === Direction.NEXT;
var isPrevDirection = direction === Direction.PREV;
var activeIndex = this._getItemIndex(activeElement);
var lastItemIndex = this._items.length - 1;
var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex;
@ -849,26 +793,25 @@ var Carousel = function () {
var delta = direction === Direction.PREV ? -1 : 1;
var itemIndex = (activeIndex + delta) % this._items.length;
return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex];
};
Carousel.prototype._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
_proto._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
var targetIndex = this._getItemIndex(relatedTarget);
var fromIndex = this._getItemIndex($(this._element).find(Selector.ACTIVE_ITEM)[0]);
var slideEvent = $.Event(Event.SLIDE, {
relatedTarget: relatedTarget,
direction: eventDirectionName,
from: fromIndex,
to: targetIndex
});
$(this._element).trigger(slideEvent);
return slideEvent;
};
Carousel.prototype._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
_proto._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
if (this._indicatorsElement) {
$(this._indicatorsElement).find(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
@ -880,18 +823,21 @@ var Carousel = function () {
}
};
Carousel.prototype._slide = function _slide(direction, element) {
_proto._slide = function _slide(direction, element) {
var _this3 = this;
var activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
var activeElementIndex = this._getItemIndex(activeElement);
var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
var nextElementIndex = this._getItemIndex(nextElement);
var isCycling = Boolean(this._interval);
var directionalClassName = void 0;
var orderClassName = void 0;
var eventDirectionName = void 0;
var activeElementIndex = this._getItemIndex(activeElement);
var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
var nextElementIndex = this._getItemIndex(nextElement);
var isCycling = Boolean(this._interval);
var directionalClassName;
var orderClassName;
var eventDirectionName;
if (direction === Direction.NEXT) {
directionalClassName = ClassName.LEFT;
@ -909,6 +855,7 @@ var Carousel = function () {
}
var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName);
if (slideEvent.isDefaultPrevented()) {
return;
}
@ -934,21 +881,14 @@ var Carousel = function () {
});
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.SLIDE)) {
$(nextElement).addClass(orderClassName);
Util.reflow(nextElement);
$(activeElement).addClass(directionalClassName);
$(nextElement).addClass(directionalClassName);
$(activeElement).one(Util.TRANSITION_END, function () {
$(nextElement).removeClass(directionalClassName + ' ' + orderClassName).addClass(ClassName.ACTIVE);
$(activeElement).removeClass(ClassName.ACTIVE + ' ' + orderClassName + ' ' + directionalClassName);
$(nextElement).removeClass(directionalClassName + " " + orderClassName).addClass(ClassName.ACTIVE);
$(activeElement).removeClass(ClassName.ACTIVE + " " + orderClassName + " " + directionalClassName);
_this3._isSliding = false;
setTimeout(function () {
return $(_this3._element).trigger(slidEvent);
}, 0);
@ -956,7 +896,6 @@ var Carousel = function () {
} else {
$(activeElement).removeClass(ClassName.ACTIVE);
$(nextElement).addClass(ClassName.ACTIVE);
this._isSliding = false;
$(this._element).trigger(slidEvent);
}
@ -964,16 +903,16 @@ var Carousel = function () {
if (isCycling) {
this.cycle();
}
};
}; // static
// static
Carousel._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Default, $(this).data());
if ((typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object') {
if (typeof config === 'object') {
$.extend(_config, config);
}
@ -988,8 +927,9 @@ var Carousel = function () {
data.to(config);
} else if (typeof action === 'string') {
if (typeof data[action] === 'undefined') {
throw new Error('No method named "' + action + '"');
throw new Error("No method named \"" + action + "\"");
}
data[action]();
} else if (_config.interval) {
data.pause();
@ -1028,34 +968,33 @@ var Carousel = function () {
};
createClass(Carousel, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return Carousel;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler);
$(document).on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler);
$(window).on(Event.LOAD_DATA_API, function () {
$(Selector.DATA_RIDE).each(function () {
var $carousel = $(this);
Carousel._jQueryInterface.call($carousel, $carousel.data());
});
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -1064,6 +1003,7 @@ var Carousel = function () {
$.fn[NAME] = Carousel._jQueryInterface;
$.fn[NAME].Constructor = Carousel;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Carousel._jQueryInterface;
@ -1080,55 +1020,46 @@ var Carousel = function () {
*/
var Collapse = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'collapse';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.collapse';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 600;
var Default = {
toggle: true,
parent: ''
};
var DefaultType = {
toggle: 'boolean',
parent: 'string'
parent: '(string|element)'
};
var Event = {
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
SHOW: 'show',
COLLAPSE: 'collapse',
COLLAPSING: 'collapsing',
COLLAPSED: 'collapsed'
};
var Dimension = {
WIDTH: 'width',
HEIGHT: 'height'
};
var Selector = {
ACTIVES: '.show, .collapsing',
DATA_TOGGLE: '[data-toggle="collapse"]'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -1136,18 +1067,21 @@ var Collapse = function () {
*/
};
var Collapse = function () {
function Collapse(element, config) {
classCallCheck(this, Collapse);
var Collapse =
/*#__PURE__*/
function () {
function Collapse(element, config) {
this._isTransitioning = false;
this._element = element;
this._config = this._getConfig(config);
this._triggerArray = $.makeArray($('[data-toggle="collapse"][href="#' + element.id + '"],' + ('[data-toggle="collapse"][data-target="#' + element.id + '"]')));
this._triggerArray = $.makeArray($("[data-toggle=\"collapse\"][href=\"#" + element.id + "\"]," + ("[data-toggle=\"collapse\"][data-target=\"#" + element.id + "\"]")));
var tabToggles = $(Selector.DATA_TOGGLE);
for (var i = 0; i < tabToggles.length; i++) {
var elem = tabToggles[i];
var selector = Util.getSelectorFromElement(elem);
if (selector !== null && $(selector).filter(element).length > 0) {
this._triggerArray.push(elem);
}
@ -1162,13 +1096,13 @@ var Collapse = function () {
if (this._config.toggle) {
this.toggle();
}
}
} // getters
// getters
var _proto = Collapse.prototype;
// public
Collapse.prototype.toggle = function toggle() {
_proto.toggle = function toggle() {
if ($(this._element).hasClass(ClassName.SHOW)) {
this.hide();
} else {
@ -1176,18 +1110,19 @@ var Collapse = function () {
}
};
Collapse.prototype.show = function show() {
_proto.show = function show() {
var _this = this;
if (this._isTransitioning || $(this._element).hasClass(ClassName.SHOW)) {
return;
}
var actives = void 0;
var activesData = void 0;
var actives;
var activesData;
if (this._parent) {
actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES));
if (!actives.length) {
actives = null;
}
@ -1195,6 +1130,7 @@ var Collapse = function () {
if (actives) {
activesData = $(actives).data(DATA_KEY);
if (activesData && activesData._isTransitioning) {
return;
}
@ -1202,12 +1138,14 @@ var Collapse = function () {
var startEvent = $.Event(Event.SHOW);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
if (actives) {
Collapse._jQueryInterface.call($(actives), 'hide');
if (!activesData) {
$(actives).data(DATA_KEY, null);
}
@ -1216,7 +1154,6 @@ var Collapse = function () {
var dimension = this._getDimension();
$(this._element).removeClass(ClassName.COLLAPSE).addClass(ClassName.COLLAPSING);
this._element.style[dimension] = 0;
if (this._triggerArray.length) {
@ -1227,7 +1164,6 @@ var Collapse = function () {
var complete = function complete() {
$(_this._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).addClass(ClassName.SHOW);
_this._element.style[dimension] = '';
_this.setTransitioning(false);
@ -1241,14 +1177,12 @@ var Collapse = function () {
}
var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
var scrollSize = 'scroll' + capitalizedDimension;
var scrollSize = "scroll" + capitalizedDimension;
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
this._element.style[dimension] = this._element[scrollSize] + 'px';
this._element.style[dimension] = this._element[scrollSize] + "px";
};
Collapse.prototype.hide = function hide() {
_proto.hide = function hide() {
var _this2 = this;
if (this._isTransitioning || !$(this._element).hasClass(ClassName.SHOW)) {
@ -1257,24 +1191,25 @@ var Collapse = function () {
var startEvent = $.Event(Event.HIDE);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
var dimension = this._getDimension();
this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + 'px';
this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + "px";
Util.reflow(this._element);
$(this._element).addClass(ClassName.COLLAPSING).removeClass(ClassName.COLLAPSE).removeClass(ClassName.SHOW);
if (this._triggerArray.length) {
for (var i = 0; i < this._triggerArray.length; i++) {
var trigger = this._triggerArray[i];
var selector = Util.getSelectorFromElement(trigger);
if (selector !== null) {
var $elem = $(selector);
if (!$elem.hasClass(ClassName.SHOW)) {
$(trigger).addClass(ClassName.COLLAPSED).attr('aria-expanded', false);
}
@ -1286,6 +1221,7 @@ var Collapse = function () {
var complete = function complete() {
_this2.setTransitioning(false);
$(_this2._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).trigger(Event.HIDDEN);
};
@ -1299,48 +1235,56 @@ var Collapse = function () {
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
};
Collapse.prototype.setTransitioning = function setTransitioning(isTransitioning) {
_proto.setTransitioning = function setTransitioning(isTransitioning) {
this._isTransitioning = isTransitioning;
};
Collapse.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._config = null;
this._parent = null;
this._element = null;
this._triggerArray = null;
this._isTransitioning = null;
};
}; // private
// private
Collapse.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
config.toggle = Boolean(config.toggle); // coerce string values
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Collapse.prototype._getDimension = function _getDimension() {
_proto._getDimension = function _getDimension() {
var hasWidth = $(this._element).hasClass(Dimension.WIDTH);
return hasWidth ? Dimension.WIDTH : Dimension.HEIGHT;
};
Collapse.prototype._getParent = function _getParent() {
_proto._getParent = function _getParent() {
var _this3 = this;
var parent = $(this._config.parent)[0];
var selector = '[data-toggle="collapse"][data-parent="' + this._config.parent + '"]';
var parent = null;
if (Util.isElement(this._config.parent)) {
parent = this._config.parent; // it's a jQuery object
if (typeof this._config.parent.jquery !== 'undefined') {
parent = this._config.parent[0];
}
} else {
parent = $(this._config.parent)[0];
}
var selector = "[data-toggle=\"collapse\"][data-parent=\"" + this._config.parent + "\"]";
$(parent).find(selector).each(function (i, element) {
_this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
});
return parent;
};
Collapse.prototype._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
_proto._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
if (element) {
var isOpen = $(element).hasClass(ClassName.SHOW);
@ -1348,9 +1292,8 @@ var Collapse = function () {
$(triggerArray).toggleClass(ClassName.COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
}
}
};
}; // static
// static
Collapse._getTargetFromElement = function _getTargetFromElement(element) {
var selector = Util.getSelectorFromElement(element);
@ -1361,7 +1304,8 @@ var Collapse = function () {
return this.each(function () {
var $this = $(this);
var data = $this.data(DATA_KEY);
var _config = $.extend({}, Default, $this.data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
var _config = $.extend({}, Default, $this.data(), typeof config === 'object' && config);
if (!data && _config.toggle && /show|hide/.test(config)) {
_config.toggle = false;
@ -1374,33 +1318,34 @@ var Collapse = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Collapse, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return Collapse;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
// preventDefault only for <a> elements (which change the URL) not inside the collapsible element
if (event.currentTarget.tagName === 'A') {
@ -1413,10 +1358,10 @@ var Collapse = function () {
var $target = $(this);
var data = $target.data(DATA_KEY);
var config = data ? 'toggle' : $trigger.data();
Collapse._jQueryInterface.call($target, config);
});
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -1425,6 +1370,7 @@ var Collapse = function () {
$.fn[NAME] = Collapse._jQueryInterface;
$.fn[NAME].Constructor = Collapse;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Collapse._jQueryInterface;
@ -1790,7 +1736,7 @@ function getWindowSizes() {
};
}
var classCallCheck$1 = function (instance, Constructor) {
var classCallCheck = function (instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
@ -3731,7 +3677,7 @@ var Popper = function () {
var _this = this;
var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
classCallCheck$1(this, Popper);
classCallCheck(this, Popper);
this.scheduleUpdate = function () {
return requestAnimationFrame(_this.update);
@ -3879,7 +3825,6 @@ Popper.Defaults = Defaults;
*/
var Dropdown = function () {
/**
* Check for Popper dependency
* Popper - https://popper.js.org
@ -3887,38 +3832,42 @@ var Dropdown = function () {
if (typeof Popper === 'undefined') {
throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)');
}
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'dropdown';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.dropdown';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key
var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key
var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key
var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key
var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)
var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + '|' + ARROW_DOWN_KEYCODE + '|' + ESCAPE_KEYCODE);
var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + "|" + ARROW_DOWN_KEYCODE + "|" + ESCAPE_KEYCODE);
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
CLICK: 'click' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY,
KEYDOWN_DATA_API: 'keydown' + EVENT_KEY + DATA_API_KEY,
KEYUP_DATA_API: 'keyup' + EVENT_KEY + DATA_API_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
CLICK: "click" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
KEYDOWN_DATA_API: "keydown" + EVENT_KEY + DATA_API_KEY,
KEYUP_DATA_API: "keyup" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
DISABLED: 'disabled',
SHOW: 'show',
@ -3926,7 +3875,6 @@ var Dropdown = function () {
MENURIGHT: 'dropdown-menu-right',
MENULEFT: 'dropdown-menu-left'
};
var Selector = {
DATA_TOGGLE: '[data-toggle="dropdown"]',
FORM_CHILD: '.dropdown form',
@ -3934,23 +3882,19 @@ var Dropdown = function () {
NAVBAR_NAV: '.navbar-nav',
VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled)'
};
var AttachmentMap = {
TOP: 'top-start',
TOPEND: 'top-end',
BOTTOM: 'bottom-start',
BOTTOMEND: 'bottom-end'
};
var Default = {
offset: 0,
flip: true
};
var DefaultType = {
offset: '(number|string)',
flip: 'boolean'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -3958,10 +3902,11 @@ var Dropdown = function () {
*/
};
var Dropdown = function () {
function Dropdown(element, config) {
classCallCheck(this, Dropdown);
var Dropdown =
/*#__PURE__*/
function () {
function Dropdown(element, config) {
this._element = element;
this._popper = null;
this._config = this._getConfig(config);
@ -3969,18 +3914,19 @@ var Dropdown = function () {
this._inNavbar = this._detectNavbar();
this._addEventListeners();
}
} // getters
// getters
var _proto = Dropdown.prototype;
// public
Dropdown.prototype.toggle = function toggle() {
_proto.toggle = function toggle() {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
var parent = Dropdown._getParentFromElement(this._element);
var isActive = $(this._menu).hasClass(ClassName.SHOW);
Dropdown._clearMenus();
@ -3993,104 +3939,108 @@ var Dropdown = function () {
relatedTarget: this._element
};
var showEvent = $.Event(Event.SHOW, relatedTarget);
$(parent).trigger(showEvent);
if (showEvent.isDefaultPrevented()) {
return;
}
var element = this._element;
// for dropup with alignment we use the parent as popper container
var element = this._element; // for dropup with alignment we use the parent as popper container
if ($(parent).hasClass(ClassName.DROPUP)) {
if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
element = parent;
}
}
this._popper = new Popper(element, this._menu, this._getPopperConfig());
// if this is a touch-enabled device we add extra
this._popper = new Popper(element, this._menu, this._getPopperConfig()); // if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) {
$('body').children().on('mouseover', null, $.noop);
}
this._element.focus();
this._element.setAttribute('aria-expanded', true);
$(this._menu).toggleClass(ClassName.SHOW);
$(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
};
Dropdown.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._element).off(EVENT_KEY);
this._element = null;
this._menu = null;
if (this._popper !== null) {
this._popper.destroy();
}
this._popper = null;
};
Dropdown.prototype.update = function update() {
_proto.update = function update() {
this._inNavbar = this._detectNavbar();
if (this._popper !== null) {
this._popper.scheduleUpdate();
}
};
}; // private
// private
Dropdown.prototype._addEventListeners = function _addEventListeners() {
_proto._addEventListeners = function _addEventListeners() {
var _this = this;
$(this._element).on(Event.CLICK, function (event) {
event.preventDefault();
event.stopPropagation();
_this.toggle();
});
};
Dropdown.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, this.constructor.Default, $(this._element).data(), config);
Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
return config;
};
Dropdown.prototype._getMenuElement = function _getMenuElement() {
_proto._getMenuElement = function _getMenuElement() {
if (!this._menu) {
var parent = Dropdown._getParentFromElement(this._element);
this._menu = $(parent).find(Selector.MENU)[0];
}
return this._menu;
};
Dropdown.prototype._getPlacement = function _getPlacement() {
_proto._getPlacement = function _getPlacement() {
var $parentDropdown = $(this._element).parent();
var placement = AttachmentMap.BOTTOM;
var placement = AttachmentMap.BOTTOM; // Handle dropup
// Handle dropup
if ($parentDropdown.hasClass(ClassName.DROPUP)) {
placement = AttachmentMap.TOP;
if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.TOPEND;
}
} else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.BOTTOMEND;
}
return placement;
};
Dropdown.prototype._detectNavbar = function _detectNavbar() {
_proto._detectNavbar = function _detectNavbar() {
return $(this._element).closest('.navbar').length > 0;
};
Dropdown.prototype._getPopperConfig = function _getPopperConfig() {
_proto._getPopperConfig = function _getPopperConfig() {
var popperConfig = {
placement: this._getPlacement(),
modifiers: {
@ -4100,23 +4050,25 @@ var Dropdown = function () {
flip: {
enabled: this._config.flip
}
}
} // Disable Popper.js for Dropdown in Navbar
// Disable Popper.js for Dropdown in Navbar
};if (this._inNavbar) {
};
if (this._inNavbar) {
popperConfig.modifiers.applyStyle = {
enabled: !this._inNavbar
};
}
return popperConfig;
};
// static
return popperConfig;
}; // static
Dropdown._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
var _config = typeof config === 'object' ? config : null;
if (!data) {
data = new Dropdown(this, _config);
@ -4125,8 +4077,9 @@ var Dropdown = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
@ -4138,8 +4091,10 @@ var Dropdown = function () {
}
var toggles = $.makeArray($(Selector.DATA_TOGGLE));
for (var i = 0; i < toggles.length; i++) {
var parent = Dropdown._getParentFromElement(toggles[i]);
var context = $(toggles[i]).data(DATA_KEY);
var relatedTarget = {
relatedTarget: toggles[i]
@ -4150,6 +4105,7 @@ var Dropdown = function () {
}
var dropdownMenu = context._menu;
if (!$(parent).hasClass(ClassName.SHOW)) {
continue;
}
@ -4160,25 +4116,25 @@ var Dropdown = function () {
var hideEvent = $.Event(Event.HIDE, relatedTarget);
$(parent).trigger(hideEvent);
if (hideEvent.isDefaultPrevented()) {
continue;
}
// if this is a touch-enabled device we remove the extra
} // if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop);
}
toggles[i].setAttribute('aria-expanded', 'false');
$(dropdownMenu).removeClass(ClassName.SHOW);
$(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
}
};
Dropdown._getParentFromElement = function _getParentFromElement(element) {
var parent = void 0;
var parent;
var selector = Util.getSelectorFromElement(element);
if (selector) {
@ -4201,10 +4157,10 @@ var Dropdown = function () {
}
var parent = Dropdown._getParentFromElement(this);
var isActive = $(parent).hasClass(ClassName.SHOW);
if (!isActive && (event.which !== ESCAPE_KEYCODE || event.which !== SPACE_KEYCODE) || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
if (event.which === ESCAPE_KEYCODE) {
var toggle = $(parent).find(Selector.DATA_TOGGLE)[0];
$(toggle).trigger('focus');
@ -4240,38 +4196,38 @@ var Dropdown = function () {
};
createClass(Dropdown, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}, {
key: 'DefaultType',
key: "DefaultType",
get: function get() {
return DefaultType;
}
}]);
return Dropdown;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + ' ' + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
$(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + " " + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
event.preventDefault();
event.stopPropagation();
Dropdown._jQueryInterface.call($(this), 'toggle');
}).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) {
e.stopPropagation();
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -4280,6 +4236,7 @@ var Dropdown = function () {
$.fn[NAME] = Dropdown._jQueryInterface;
$.fn[NAME].Constructor = Dropdown;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Dropdown._jQueryInterface;
@ -4296,17 +4253,15 @@ var Dropdown = function () {
*/
var Modal = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'modal';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.modal';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 300;
@ -4319,28 +4274,25 @@ var Modal = function () {
focus: true,
show: true
};
var DefaultType = {
backdrop: '(boolean|string)',
keyboard: 'boolean',
focus: 'boolean',
show: 'boolean'
};
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
FOCUSIN: 'focusin' + EVENT_KEY,
RESIZE: 'resize' + EVENT_KEY,
CLICK_DISMISS: 'click.dismiss' + EVENT_KEY,
KEYDOWN_DISMISS: 'keydown.dismiss' + EVENT_KEY,
MOUSEUP_DISMISS: 'mouseup.dismiss' + EVENT_KEY,
MOUSEDOWN_DISMISS: 'mousedown.dismiss' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
FOCUSIN: "focusin" + EVENT_KEY,
RESIZE: "resize" + EVENT_KEY,
CLICK_DISMISS: "click.dismiss" + EVENT_KEY,
KEYDOWN_DISMISS: "keydown.dismiss" + EVENT_KEY,
MOUSEUP_DISMISS: "mouseup.dismiss" + EVENT_KEY,
MOUSEDOWN_DISMISS: "mousedown.dismiss" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
SCROLLBAR_MEASURER: 'modal-scrollbar-measure',
BACKDROP: 'modal-backdrop',
@ -4348,7 +4300,6 @@ var Modal = function () {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
DIALOG: '.modal-dialog',
DATA_TOGGLE: '[data-toggle="modal"]',
@ -4356,7 +4307,6 @@ var Modal = function () {
FIXED_CONTENT: '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top',
STICKY_CONTENT: '.sticky-top',
NAVBAR_TOGGLER: '.navbar-toggler'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -4364,10 +4314,11 @@ var Modal = function () {
*/
};
var Modal = function () {
function Modal(element, config) {
classCallCheck(this, Modal);
var Modal =
/*#__PURE__*/
function () {
function Modal(element, config) {
this._config = this._getConfig(config);
this._element = element;
this._dialog = $(element).find(Selector.DIALOG)[0];
@ -4377,17 +4328,17 @@ var Modal = function () {
this._ignoreBackdropClick = false;
this._originalBodyPadding = 0;
this._scrollbarWidth = 0;
}
} // getters
// getters
var _proto = Modal.prototype;
// public
Modal.prototype.toggle = function toggle(relatedTarget) {
_proto.toggle = function toggle(relatedTarget) {
return this._isShown ? this.hide() : this.show(relatedTarget);
};
Modal.prototype.show = function show(relatedTarget) {
_proto.show = function show(relatedTarget) {
var _this = this;
if (this._isTransitioning) {
@ -4401,7 +4352,6 @@ var Modal = function () {
var showEvent = $.Event(Event.SHOW, {
relatedTarget: relatedTarget
});
$(this._element).trigger(showEvent);
if (this._isShown || showEvent.isDefaultPrevented()) {
@ -4411,6 +4361,7 @@ var Modal = function () {
this._isShown = true;
this._checkScrollbar();
this._setScrollbar();
this._adjustDialog();
@ -4418,12 +4369,12 @@ var Modal = function () {
$(document.body).addClass(ClassName.OPEN);
this._setEscapeEvent();
this._setResizeEvent();
$(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
return _this.hide(event);
});
$(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
$(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
if ($(event.target).is(_this._element)) {
@ -4437,7 +4388,7 @@ var Modal = function () {
});
};
Modal.prototype.hide = function hide(event) {
_proto.hide = function hide(event) {
var _this2 = this;
if (event) {
@ -4455,7 +4406,6 @@ var Modal = function () {
}
var hideEvent = $.Event(Event.HIDE);
$(this._element).trigger(hideEvent);
if (!this._isShown || hideEvent.isDefaultPrevented()) {
@ -4465,17 +4415,15 @@ var Modal = function () {
this._isShown = false;
this._setEscapeEvent();
this._setResizeEvent();
$(document).off(Event.FOCUSIN);
$(this._element).removeClass(ClassName.SHOW);
$(this._element).off(Event.CLICK_DISMISS);
$(this._dialog).off(Event.MOUSEDOWN_DISMISS);
if (transition) {
$(this._element).one(Util.TRANSITION_END, function (event) {
return _this2._hideModal(event);
}).emulateTransitionEnd(TRANSITION_DURATION);
@ -4484,11 +4432,9 @@ var Modal = function () {
}
};
Modal.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(window, document, this._element, this._backdrop).off(EVENT_KEY);
this._config = null;
this._element = null;
this._dialog = null;
@ -4499,19 +4445,18 @@ var Modal = function () {
this._scrollbarWidth = null;
};
Modal.prototype.handleUpdate = function handleUpdate() {
_proto.handleUpdate = function handleUpdate() {
this._adjustDialog();
};
}; // private
// private
Modal.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Modal.prototype._showElement = function _showElement(relatedTarget) {
_proto._showElement = function _showElement(relatedTarget) {
var _this3 = this;
var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE);
@ -4522,7 +4467,9 @@ var Modal = function () {
}
this._element.style.display = 'block';
this._element.removeAttribute('aria-hidden');
this._element.scrollTop = 0;
if (transition) {
@ -4543,6 +4490,7 @@ var Modal = function () {
if (_this3._config.focus) {
_this3._element.focus();
}
_this3._isTransitioning = false;
$(_this3._element).trigger(shownEvent);
};
@ -4554,7 +4502,7 @@ var Modal = function () {
}
};
Modal.prototype._enforceFocus = function _enforceFocus() {
_proto._enforceFocus = function _enforceFocus() {
var _this4 = this;
$(document).off(Event.FOCUSIN) // guard against infinite focus loop
@ -4565,13 +4513,14 @@ var Modal = function () {
});
};
Modal.prototype._setEscapeEvent = function _setEscapeEvent() {
_proto._setEscapeEvent = function _setEscapeEvent() {
var _this5 = this;
if (this._isShown && this._config.keyboard) {
$(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
if (event.which === ESCAPE_KEYCODE) {
event.preventDefault();
_this5.hide();
}
});
@ -4580,7 +4529,7 @@ var Modal = function () {
}
};
Modal.prototype._setResizeEvent = function _setResizeEvent() {
_proto._setResizeEvent = function _setResizeEvent() {
var _this6 = this;
if (this._isShown) {
@ -4592,35 +4541,40 @@ var Modal = function () {
}
};
Modal.prototype._hideModal = function _hideModal() {
_proto._hideModal = function _hideModal() {
var _this7 = this;
this._element.style.display = 'none';
this._element.setAttribute('aria-hidden', true);
this._isTransitioning = false;
this._showBackdrop(function () {
$(document.body).removeClass(ClassName.OPEN);
_this7._resetAdjustments();
_this7._resetScrollbar();
$(_this7._element).trigger(Event.HIDDEN);
});
};
Modal.prototype._removeBackdrop = function _removeBackdrop() {
_proto._removeBackdrop = function _removeBackdrop() {
if (this._backdrop) {
$(this._backdrop).remove();
this._backdrop = null;
}
};
Modal.prototype._showBackdrop = function _showBackdrop(callback) {
_proto._showBackdrop = function _showBackdrop(callback) {
var _this8 = this;
var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
if (this._isShown && this._config.backdrop) {
var doAnimate = Util.supportsTransitionEnd() && animate;
this._backdrop = document.createElement('div');
this._backdrop.className = ClassName.BACKDROP;
@ -4629,15 +4583,16 @@ var Modal = function () {
}
$(this._backdrop).appendTo(document.body);
$(this._element).on(Event.CLICK_DISMISS, function (event) {
if (_this8._ignoreBackdropClick) {
_this8._ignoreBackdropClick = false;
return;
}
if (event.target !== event.currentTarget) {
return;
}
if (_this8._config.backdrop === 'static') {
_this8._element.focus();
} else {
@ -4666,6 +4621,7 @@ var Modal = function () {
var callbackRemove = function callbackRemove() {
_this8._removeBackdrop();
if (callback) {
callback();
}
@ -4679,96 +4635,92 @@ var Modal = function () {
} else if (callback) {
callback();
}
};
// ----------------------------------------------------------------------
}; // ----------------------------------------------------------------------
// the following methods are used to handle overflowing modals
// todo (fat): these should probably be refactored out of modal.js
// ----------------------------------------------------------------------
Modal.prototype._adjustDialog = function _adjustDialog() {
_proto._adjustDialog = function _adjustDialog() {
var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
if (!this._isBodyOverflowing && isModalOverflowing) {
this._element.style.paddingLeft = this._scrollbarWidth + 'px';
this._element.style.paddingLeft = this._scrollbarWidth + "px";
}
if (this._isBodyOverflowing && !isModalOverflowing) {
this._element.style.paddingRight = this._scrollbarWidth + 'px';
this._element.style.paddingRight = this._scrollbarWidth + "px";
}
};
Modal.prototype._resetAdjustments = function _resetAdjustments() {
_proto._resetAdjustments = function _resetAdjustments() {
this._element.style.paddingLeft = '';
this._element.style.paddingRight = '';
};
Modal.prototype._checkScrollbar = function _checkScrollbar() {
_proto._checkScrollbar = function _checkScrollbar() {
var rect = document.body.getBoundingClientRect();
this._isBodyOverflowing = rect.left + rect.right < window.innerWidth;
this._scrollbarWidth = this._getScrollbarWidth();
};
Modal.prototype._setScrollbar = function _setScrollbar() {
_proto._setScrollbar = function _setScrollbar() {
var _this9 = this;
if (this._isBodyOverflowing) {
// Note: DOMNode.style.paddingRight returns the actual value or '' if not set
// while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
// Adjust fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var actualPadding = $(element)[0].style.paddingRight;
var calculatedPadding = $(element).css('padding-right');
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + 'px');
});
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + "px");
}); // Adjust sticky content margin
// Adjust sticky content margin
$(Selector.STICKY_CONTENT).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + 'px');
});
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + "px");
}); // Adjust navbar-toggler margin
// Adjust navbar-toggler margin
$(Selector.NAVBAR_TOGGLER).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this9._scrollbarWidth + 'px');
});
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this9._scrollbarWidth + "px");
}); // Adjust body padding
// Adjust body padding
var actualPadding = document.body.style.paddingRight;
var calculatedPadding = $('body').css('padding-right');
$('body').data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + 'px');
$('body').data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + "px");
}
};
Modal.prototype._resetScrollbar = function _resetScrollbar() {
_proto._resetScrollbar = function _resetScrollbar() {
// Restore fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var padding = $(element).data('padding-right');
if (typeof padding !== 'undefined') {
$(element).css('padding-right', padding).removeData('padding-right');
}
});
}); // Restore sticky content and navbar-toggler margin
// Restore sticky content and navbar-toggler margin
$(Selector.STICKY_CONTENT + ', ' + Selector.NAVBAR_TOGGLER).each(function (index, element) {
$(Selector.STICKY_CONTENT + ", " + Selector.NAVBAR_TOGGLER).each(function (index, element) {
var margin = $(element).data('margin-right');
if (typeof margin !== 'undefined') {
$(element).css('margin-right', margin).removeData('margin-right');
}
});
}); // Restore body padding
// Restore body padding
var padding = $('body').data('padding-right');
if (typeof padding !== 'undefined') {
$('body').css('padding-right', padding).removeData('padding-right');
}
};
Modal.prototype._getScrollbarWidth = function _getScrollbarWidth() {
_proto._getScrollbarWidth = function _getScrollbarWidth() {
// thx d.walsh
var scrollDiv = document.createElement('div');
scrollDiv.className = ClassName.SCROLLBAR_MEASURER;
@ -4776,14 +4728,14 @@ var Modal = function () {
var scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
document.body.removeChild(scrollDiv);
return scrollbarWidth;
};
}; // static
// static
Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Modal.Default, $(this).data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
var _config = $.extend({}, Modal.Default, $(this).data(), typeof config === 'object' && config);
if (!data) {
data = new Modal(this, _config);
@ -4792,8 +4744,9 @@ var Modal = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config](relatedTarget);
} else if (_config.show) {
data.show(relatedTarget);
@ -4802,29 +4755,29 @@ var Modal = function () {
};
createClass(Modal, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return Modal;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
var _this10 = this;
var target = void 0;
var target;
var selector = Util.getSelectorFromElement(this);
if (selector) {
@ -4852,7 +4805,6 @@ var Modal = function () {
Modal._jQueryInterface.call($(target), config, this);
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -4861,6 +4813,7 @@ var Modal = function () {
$.fn[NAME] = Modal._jQueryInterface;
$.fn[NAME].Constructor = Modal;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Modal._jQueryInterface;
@ -4877,7 +4830,6 @@ var Modal = function () {
*/
var Tooltip = function () {
/**
* Check for Popper dependency
* Popper - https://popper.js.org
@ -4885,22 +4837,21 @@ var Tooltip = function () {
if (typeof Popper === 'undefined') {
throw new Error('Bootstrap tooltips require Popper.js (https://popper.js.org)');
}
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'tooltip';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.tooltip';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 150;
var CLASS_PREFIX = 'bs-tooltip';
var BSCLS_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g');
var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
var DefaultType = {
animation: 'boolean',
template: 'string',
@ -4914,7 +4865,6 @@ var Tooltip = function () {
container: '(string|element|boolean)',
fallbackPlacement: '(string|array)'
};
var AttachmentMap = {
AUTO: 'auto',
TOP: 'top',
@ -4922,7 +4872,6 @@ var Tooltip = function () {
BOTTOM: 'bottom',
LEFT: 'left'
};
var Default = {
animation: true,
template: '<div class="tooltip" role="tooltip">' + '<div class="arrow"></div>' + '<div class="tooltip-inner"></div></div>',
@ -4936,42 +4885,36 @@ var Tooltip = function () {
container: false,
fallbackPlacement: 'flip'
};
var HoverState = {
SHOW: 'show',
OUT: 'out'
};
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
INSERTED: 'inserted' + EVENT_KEY,
CLICK: 'click' + EVENT_KEY,
FOCUSIN: 'focusin' + EVENT_KEY,
FOCUSOUT: 'focusout' + EVENT_KEY,
MOUSEENTER: 'mouseenter' + EVENT_KEY,
MOUSELEAVE: 'mouseleave' + EVENT_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
INSERTED: "inserted" + EVENT_KEY,
CLICK: "click" + EVENT_KEY,
FOCUSIN: "focusin" + EVENT_KEY,
FOCUSOUT: "focusout" + EVENT_KEY,
MOUSEENTER: "mouseenter" + EVENT_KEY,
MOUSELEAVE: "mouseleave" + EVENT_KEY
};
var ClassName = {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
TOOLTIP: '.tooltip',
TOOLTIP_INNER: '.tooltip-inner',
ARROW: '.arrow'
};
var Trigger = {
HOVER: 'hover',
FOCUS: 'focus',
CLICK: 'click',
MANUAL: 'manual'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -4979,43 +4922,42 @@ var Tooltip = function () {
*/
};
var Tooltip = function () {
var Tooltip =
/*#__PURE__*/
function () {
function Tooltip(element, config) {
classCallCheck(this, Tooltip);
// private
this._isEnabled = true;
this._timeout = 0;
this._hoverState = '';
this._activeTrigger = {};
this._popper = null;
this._popper = null; // protected
// protected
this.element = element;
this.config = this._getConfig(config);
this.tip = null;
this._setListeners();
}
} // getters
// getters
var _proto = Tooltip.prototype;
// public
Tooltip.prototype.enable = function enable() {
_proto.enable = function enable() {
this._isEnabled = true;
};
Tooltip.prototype.disable = function disable() {
_proto.disable = function disable() {
this._isEnabled = false;
};
Tooltip.prototype.toggleEnabled = function toggleEnabled() {
_proto.toggleEnabled = function toggleEnabled() {
this._isEnabled = !this._isEnabled;
};
Tooltip.prototype.toggle = function toggle(event) {
_proto.toggle = function toggle(event) {
if (!this._isEnabled) {
return;
}
@ -5037,9 +4979,9 @@ var Tooltip = function () {
context._leave(null, context);
}
} else {
if ($(this.getTipElement()).hasClass(ClassName.SHOW)) {
this._leave(null, this);
return;
}
@ -5047,11 +4989,9 @@ var Tooltip = function () {
}
};
Tooltip.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
clearTimeout(this._timeout);
$.removeData(this.element, this.constructor.DATA_KEY);
$(this.element).off(this.constructor.EVENT_KEY);
$(this.element).closest('.modal').off('hide.bs.modal');
@ -5063,6 +5003,7 @@ var Tooltip = function () {
this._timeout = null;
this._hoverState = null;
this._activeTrigger = null;
if (this._popper !== null) {
this._popper.destroy();
}
@ -5073,7 +5014,7 @@ var Tooltip = function () {
this.tip = null;
};
Tooltip.prototype.show = function show() {
_proto.show = function show() {
var _this = this;
if ($(this.element).css('display') === 'none') {
@ -5081,9 +5022,9 @@ var Tooltip = function () {
}
var showEvent = $.Event(this.constructor.Event.SHOW);
if (this.isWithContent() && this._isEnabled) {
$(this.element).trigger(showEvent);
var isInTheDom = $.contains(this.element.ownerDocument.documentElement, this.element);
if (showEvent.isDefaultPrevented() || !isInTheDom) {
@ -5092,10 +5033,8 @@ var Tooltip = function () {
var tip = this.getTipElement();
var tipId = Util.getUID(this.constructor.NAME);
tip.setAttribute('id', tipId);
this.element.setAttribute('aria-describedby', tipId);
this.setContent();
if (this.config.animation) {
@ -5105,10 +5044,9 @@ var Tooltip = function () {
var placement = typeof this.config.placement === 'function' ? this.config.placement.call(this, tip, this.element) : this.config.placement;
var attachment = this._getAttachment(placement);
this.addAttachmentClass(attachment);
var container = this.config.container === false ? document.body : $(this.config.container);
$(tip).data(this.constructor.DATA_KEY, this);
if (!$.contains(this.element.ownerDocument.documentElement, this.tip)) {
@ -5116,7 +5054,6 @@ var Tooltip = function () {
}
$(this.element).trigger(this.constructor.Event.INSERTED);
this._popper = new Popper(this.element, tip, {
placement: attachment,
modifiers: {
@ -5139,13 +5076,11 @@ var Tooltip = function () {
_this._handlePopperPlacementChange(data);
}
});
$(tip).addClass(ClassName.SHOW);
// if this is a touch-enabled device we add extra
$(tip).addClass(ClassName.SHOW); // if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement) {
$('body').children().on('mouseover', null, $.noop);
}
@ -5154,9 +5089,9 @@ var Tooltip = function () {
if (_this.config.animation) {
_this._fixTransition();
}
var prevHoverState = _this._hoverState;
_this._hoverState = null;
$(_this.element).trigger(_this.constructor.Event.SHOWN);
if (prevHoverState === HoverState.OUT) {
@ -5172,19 +5107,23 @@ var Tooltip = function () {
}
};
Tooltip.prototype.hide = function hide(callback) {
_proto.hide = function hide(callback) {
var _this2 = this;
var tip = this.getTipElement();
var hideEvent = $.Event(this.constructor.Event.HIDE);
var complete = function complete() {
if (_this2._hoverState !== HoverState.SHOW && tip.parentNode) {
tip.parentNode.removeChild(tip);
}
_this2._cleanTipClass();
_this2.element.removeAttribute('aria-describedby');
$(_this2.element).trigger(_this2.constructor.Event.HIDDEN);
if (_this2._popper !== null) {
_this2._popper.destroy();
}
@ -5200,10 +5139,9 @@ var Tooltip = function () {
return;
}
$(tip).removeClass(ClassName.SHOW);
// if this is a touch-enabled device we remove the extra
$(tip).removeClass(ClassName.SHOW); // if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop);
}
@ -5213,7 +5151,6 @@ var Tooltip = function () {
this._activeTrigger[Trigger.HOVER] = false;
if (Util.supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) {
$(tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
} else {
complete();
@ -5222,36 +5159,36 @@ var Tooltip = function () {
this._hoverState = '';
};
Tooltip.prototype.update = function update() {
_proto.update = function update() {
if (this._popper !== null) {
this._popper.scheduleUpdate();
}
};
}; // protected
// protected
Tooltip.prototype.isWithContent = function isWithContent() {
_proto.isWithContent = function isWithContent() {
return Boolean(this.getTitle());
};
Tooltip.prototype.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment);
_proto.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
};
Tooltip.prototype.getTipElement = function getTipElement() {
_proto.getTipElement = function getTipElement() {
this.tip = this.tip || $(this.config.template)[0];
return this.tip;
};
Tooltip.prototype.setContent = function setContent() {
_proto.setContent = function setContent() {
var $tip = $(this.getTipElement());
this.setElementContent($tip.find(Selector.TOOLTIP_INNER), this.getTitle());
$tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW);
$tip.removeClass(ClassName.FADE + " " + ClassName.SHOW);
};
Tooltip.prototype.setElementContent = function setElementContent($element, content) {
_proto.setElementContent = function setElementContent($element, content) {
var html = this.config.html;
if ((typeof content === 'undefined' ? 'undefined' : _typeof(content)) === 'object' && (content.nodeType || content.jquery)) {
if (typeof content === 'object' && (content.nodeType || content.jquery)) {
// content is a DOM node or a jQuery
if (html) {
if (!$(content).parent().is($element)) {
@ -5265,7 +5202,7 @@ var Tooltip = function () {
}
};
Tooltip.prototype.getTitle = function getTitle() {
_proto.getTitle = function getTitle() {
var title = this.element.getAttribute('data-original-title');
if (!title) {
@ -5273,19 +5210,17 @@ var Tooltip = function () {
}
return title;
};
}; // private
// private
Tooltip.prototype._getAttachment = function _getAttachment(placement) {
_proto._getAttachment = function _getAttachment(placement) {
return AttachmentMap[placement.toUpperCase()];
};
Tooltip.prototype._setListeners = function _setListeners() {
_proto._setListeners = function _setListeners() {
var _this3 = this;
var triggers = this.config.trigger.split(' ');
triggers.forEach(function (trigger) {
if (trigger === 'click') {
$(_this3.element).on(_this3.constructor.Event.CLICK, _this3.config.selector, function (event) {
@ -5294,7 +5229,6 @@ var Tooltip = function () {
} else if (trigger !== Trigger.MANUAL) {
var eventIn = trigger === Trigger.HOVER ? _this3.constructor.Event.MOUSEENTER : _this3.constructor.Event.FOCUSIN;
var eventOut = trigger === Trigger.HOVER ? _this3.constructor.Event.MOUSELEAVE : _this3.constructor.Event.FOCUSOUT;
$(_this3.element).on(eventIn, _this3.config.selector, function (event) {
return _this3._enter(event);
}).on(eventOut, _this3.config.selector, function (event) {
@ -5317,17 +5251,17 @@ var Tooltip = function () {
}
};
Tooltip.prototype._fixTitle = function _fixTitle() {
var titleType = _typeof(this.element.getAttribute('data-original-title'));
_proto._fixTitle = function _fixTitle() {
var titleType = typeof this.element.getAttribute('data-original-title');
if (this.element.getAttribute('title') || titleType !== 'string') {
this.element.setAttribute('data-original-title', this.element.getAttribute('title') || '');
this.element.setAttribute('title', '');
}
};
Tooltip.prototype._enter = function _enter(event, context) {
_proto._enter = function _enter(event, context) {
var dataKey = this.constructor.DATA_KEY;
context = context || $(event.currentTarget).data(dataKey);
if (!context) {
@ -5345,7 +5279,6 @@ var Tooltip = function () {
}
clearTimeout(context._timeout);
context._hoverState = HoverState.SHOW;
if (!context.config.delay || !context.config.delay.show) {
@ -5360,9 +5293,8 @@ var Tooltip = function () {
}, context.config.delay.show);
};
Tooltip.prototype._leave = function _leave(event, context) {
_proto._leave = function _leave(event, context) {
var dataKey = this.constructor.DATA_KEY;
context = context || $(event.currentTarget).data(dataKey);
if (!context) {
@ -5379,7 +5311,6 @@ var Tooltip = function () {
}
clearTimeout(context._timeout);
context._hoverState = HoverState.OUT;
if (!context.config.delay || !context.config.delay.hide) {
@ -5394,7 +5325,7 @@ var Tooltip = function () {
}, context.config.delay.hide);
};
Tooltip.prototype._isWithActiveTrigger = function _isWithActiveTrigger() {
_proto._isWithActiveTrigger = function _isWithActiveTrigger() {
for (var trigger in this._activeTrigger) {
if (this._activeTrigger[trigger]) {
return true;
@ -5404,7 +5335,7 @@ var Tooltip = function () {
return false;
};
Tooltip.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, this.constructor.Default, $(this.element).data(), config);
if (typeof config.delay === 'number') {
@ -5423,11 +5354,10 @@ var Tooltip = function () {
}
Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
return config;
};
Tooltip.prototype._getDelegateConfig = function _getDelegateConfig() {
_proto._getDelegateConfig = function _getDelegateConfig() {
var config = {};
if (this.config) {
@ -5441,38 +5371,42 @@ var Tooltip = function () {
return config;
};
Tooltip.prototype._cleanTipClass = function _cleanTipClass() {
_proto._cleanTipClass = function _cleanTipClass() {
var $tip = $(this.getTipElement());
var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
if (tabClass !== null && tabClass.length > 0) {
$tip.removeClass(tabClass.join(''));
}
};
Tooltip.prototype._handlePopperPlacementChange = function _handlePopperPlacementChange(data) {
_proto._handlePopperPlacementChange = function _handlePopperPlacementChange(data) {
this._cleanTipClass();
this.addAttachmentClass(this._getAttachment(data.placement));
};
Tooltip.prototype._fixTransition = function _fixTransition() {
_proto._fixTransition = function _fixTransition() {
var tip = this.getTipElement();
var initConfigAnimation = this.config.animation;
if (tip.getAttribute('x-placement') !== null) {
return;
}
$(tip).removeClass(ClassName.FADE);
this.config.animation = false;
this.hide();
this.show();
this.config.animation = initConfigAnimation;
};
}; // static
// static
Tooltip._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config;
var _config = typeof config === 'object' && config;
if (!data && /dispose|hide/.test(config)) {
return;
@ -5485,60 +5419,62 @@ var Tooltip = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Tooltip, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}, {
key: 'NAME',
key: "NAME",
get: function get() {
return NAME;
}
}, {
key: 'DATA_KEY',
key: "DATA_KEY",
get: function get() {
return DATA_KEY;
}
}, {
key: 'Event',
key: "Event",
get: function get() {
return Event;
}
}, {
key: 'EVENT_KEY',
key: "EVENT_KEY",
get: function get() {
return EVENT_KEY;
}
}, {
key: 'DefaultType',
key: "DefaultType",
get: function get() {
return DefaultType;
}
}]);
return Tooltip;
}();
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
$.fn[NAME] = Tooltip._jQueryInterface;
$.fn[NAME].Constructor = Tooltip;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Tooltip._jQueryInterface;
@ -5555,54 +5491,46 @@ var Tooltip = function () {
*/
var Popover = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'popover';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.popover';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var JQUERY_NO_CONFLICT = $.fn[NAME];
var CLASS_PREFIX = 'bs-popover';
var BSCLS_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g');
var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
var Default = $.extend({}, Tooltip.Default, {
placement: 'right',
trigger: 'click',
content: '',
template: '<div class="popover" role="tooltip">' + '<div class="arrow"></div>' + '<h3 class="popover-header"></h3>' + '<div class="popover-body"></div></div>'
});
var DefaultType = $.extend({}, Tooltip.DefaultType, {
content: '(string|element|function)'
});
var ClassName = {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
TITLE: '.popover-header',
CONTENT: '.popover-body'
};
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
INSERTED: 'inserted' + EVENT_KEY,
CLICK: 'click' + EVENT_KEY,
FOCUSIN: 'focusin' + EVENT_KEY,
FOCUSOUT: 'focusout' + EVENT_KEY,
MOUSEENTER: 'mouseenter' + EVENT_KEY,
MOUSELEAVE: 'mouseleave' + EVENT_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
INSERTED: "inserted" + EVENT_KEY,
CLICK: "click" + EVENT_KEY,
FOCUSIN: "focusin" + EVENT_KEY,
FOCUSOUT: "focusout" + EVENT_KEY,
MOUSEENTER: "mouseenter" + EVENT_KEY,
MOUSELEAVE: "mouseleave" + EVENT_KEY
/**
* ------------------------------------------------------------------------
* Class Definition
@ -5610,59 +5538,60 @@ var Popover = function () {
*/
};
var Popover = function (_Tooltip) {
inherits(Popover, _Tooltip);
var Popover =
/*#__PURE__*/
function (_Tooltip) {
inheritsLoose(Popover, _Tooltip);
function Popover() {
classCallCheck(this, Popover);
return possibleConstructorReturn(this, _Tooltip.apply(this, arguments));
return _Tooltip.apply(this, arguments) || this;
}
// overrides
var _proto = Popover.prototype;
Popover.prototype.isWithContent = function isWithContent() {
// overrides
_proto.isWithContent = function isWithContent() {
return this.getTitle() || this._getContent();
};
Popover.prototype.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment);
_proto.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
};
Popover.prototype.getTipElement = function getTipElement() {
_proto.getTipElement = function getTipElement() {
this.tip = this.tip || $(this.config.template)[0];
return this.tip;
};
Popover.prototype.setContent = function setContent() {
var $tip = $(this.getTipElement());
_proto.setContent = function setContent() {
var $tip = $(this.getTipElement()); // we use append for html objects to maintain js events
// we use append for html objects to maintain js events
this.setElementContent($tip.find(Selector.TITLE), this.getTitle());
this.setElementContent($tip.find(Selector.CONTENT), this._getContent());
$tip.removeClass(ClassName.FADE + " " + ClassName.SHOW);
}; // private
$tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW);
};
// private
Popover.prototype._getContent = function _getContent() {
_proto._getContent = function _getContent() {
return this.element.getAttribute('data-content') || (typeof this.config.content === 'function' ? this.config.content.call(this.element) : this.config.content);
};
Popover.prototype._cleanTipClass = function _cleanTipClass() {
_proto._cleanTipClass = function _cleanTipClass() {
var $tip = $(this.getTipElement());
var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
if (tabClass !== null && tabClass.length > 0) {
$tip.removeClass(tabClass.join(''));
}
};
}; // static
// static
Popover._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
var _config = typeof config === 'object' ? config : null;
if (!data && /destroy|hide/.test(config)) {
return;
@ -5675,64 +5604,63 @@ var Popover = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Popover, null, [{
key: 'VERSION',
key: "VERSION",
// getters
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}, {
key: 'NAME',
key: "NAME",
get: function get() {
return NAME;
}
}, {
key: 'DATA_KEY',
key: "DATA_KEY",
get: function get() {
return DATA_KEY;
}
}, {
key: 'Event',
key: "Event",
get: function get() {
return Event;
}
}, {
key: 'EVENT_KEY',
key: "EVENT_KEY",
get: function get() {
return EVENT_KEY;
}
}, {
key: 'DefaultType',
key: "DefaultType",
get: function get() {
return DefaultType;
}
}]);
return Popover;
}(Tooltip);
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
$.fn[NAME] = Popover._jQueryInterface;
$.fn[NAME].Constructor = Popover;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Popover._jQueryInterface;
@ -5749,59 +5677,51 @@ var Popover = function () {
*/
var ScrollSpy = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'scrollspy';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.scrollspy';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var Default = {
offset: 10,
method: 'auto',
target: ''
};
var DefaultType = {
offset: 'number',
method: 'string',
target: '(string|element)'
};
var Event = {
ACTIVATE: 'activate' + EVENT_KEY,
SCROLL: 'scroll' + EVENT_KEY,
LOAD_DATA_API: 'load' + EVENT_KEY + DATA_API_KEY
ACTIVATE: "activate" + EVENT_KEY,
SCROLL: "scroll" + EVENT_KEY,
LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
NAV_LIST_GROUP: '.nav, .list-group',
NAV_LINKS: '.nav-link',
NAV_ITEMS: '.nav-item',
LIST_ITEMS: '.list-group-item',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
};
var OffsetMethod = {
OFFSET: 'offset',
POSITION: 'position'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -5809,51 +5729,45 @@ var ScrollSpy = function () {
*/
};
var ScrollSpy = function () {
var ScrollSpy =
/*#__PURE__*/
function () {
function ScrollSpy(element, config) {
var _this = this;
classCallCheck(this, ScrollSpy);
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.LIST_ITEMS + ',') + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._selector = this._config.target + " " + Selector.NAV_LINKS + "," + (this._config.target + " " + Selector.LIST_ITEMS + ",") + (this._config.target + " " + Selector.DROPDOWN_ITEMS);
this._offsets = [];
this._targets = [];
this._activeTarget = null;
this._scrollHeight = 0;
$(this._scrollElement).on(Event.SCROLL, function (event) {
return _this._process(event);
});
this.refresh();
this._process();
}
// getters
this._process();
} // getters
var _proto = ScrollSpy.prototype;
// public
ScrollSpy.prototype.refresh = function refresh() {
_proto.refresh = function refresh() {
var _this2 = this;
var autoMethod = this._scrollElement !== this._scrollElement.window ? OffsetMethod.POSITION : OffsetMethod.OFFSET;
var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
this._offsets = [];
this._targets = [];
this._scrollHeight = this._getScrollHeight();
var targets = $.makeArray($(this._selector));
targets.map(function (element) {
var target = void 0;
var target;
var targetSelector = Util.getSelectorFromElement(element);
if (targetSelector) {
@ -5862,11 +5776,13 @@ var ScrollSpy = function () {
if (target) {
var targetBCR = target.getBoundingClientRect();
if (targetBCR.width || targetBCR.height) {
// todo (fat): remove sketch reliance on jQuery position/offset
return [$(target)[offsetMethod]().top + offsetBase, targetSelector];
}
}
return null;
}).filter(function (item) {
return item;
@ -5874,14 +5790,14 @@ var ScrollSpy = function () {
return a[0] - b[0];
}).forEach(function (item) {
_this2._offsets.push(item[0]);
_this2._targets.push(item[1]);
});
};
ScrollSpy.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._scrollElement).off(EVENT_KEY);
this._element = null;
this._scrollElement = null;
this._config = null;
@ -5890,42 +5806,44 @@ var ScrollSpy = function () {
this._targets = null;
this._activeTarget = null;
this._scrollHeight = null;
};
}; // private
// private
ScrollSpy.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
if (typeof config.target !== 'string') {
var id = $(config.target).attr('id');
if (!id) {
id = Util.getUID(NAME);
$(config.target).attr('id', id);
}
config.target = '#' + id;
config.target = "#" + id;
}
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
ScrollSpy.prototype._getScrollTop = function _getScrollTop() {
_proto._getScrollTop = function _getScrollTop() {
return this._scrollElement === window ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop;
};
ScrollSpy.prototype._getScrollHeight = function _getScrollHeight() {
_proto._getScrollHeight = function _getScrollHeight() {
return this._scrollElement.scrollHeight || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
};
ScrollSpy.prototype._getOffsetHeight = function _getOffsetHeight() {
_proto._getOffsetHeight = function _getOffsetHeight() {
return this._scrollElement === window ? window.innerHeight : this._scrollElement.getBoundingClientRect().height;
};
ScrollSpy.prototype._process = function _process() {
_proto._process = function _process() {
var scrollTop = this._getScrollTop() + this._config.offset;
var scrollHeight = this._getScrollHeight();
var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight();
if (this._scrollHeight !== scrollHeight) {
@ -5938,12 +5856,15 @@ var ScrollSpy = function () {
if (this._activeTarget !== target) {
this._activate(target);
}
return;
}
if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) {
this._activeTarget = null;
this._clear();
return;
}
@ -5956,17 +5877,17 @@ var ScrollSpy = function () {
}
};
ScrollSpy.prototype._activate = function _activate(target) {
_proto._activate = function _activate(target) {
this._activeTarget = target;
this._clear();
var queries = this._selector.split(',');
// eslint-disable-next-line arrow-body-style
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var queries = this._selector.split(','); // eslint-disable-next-line arrow-body-style
queries = queries.map(function (selector) {
return selector + "[data-target=\"" + target + "\"]," + (selector + "[href=\"" + target + "\"]");
});
var $link = $(queries.join(','));
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
@ -5974,10 +5895,12 @@ var ScrollSpy = function () {
$link.addClass(ClassName.ACTIVE);
} else {
// Set triggered link as active
$link.addClass(ClassName.ACTIVE);
// Set triggered links parents as active
$link.addClass(ClassName.ACTIVE); // Set triggered links parents as active
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ', ' + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE);
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ", " + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE); // Handle special case when .nav-link is inside .nav-item
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_ITEMS).children(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
@ -5985,16 +5908,16 @@ var ScrollSpy = function () {
});
};
ScrollSpy.prototype._clear = function _clear() {
_proto._clear = function _clear() {
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
};
}; // static
// static
ScrollSpy._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config;
var _config = typeof config === 'object' && config;
if (!data) {
data = new ScrollSpy(this, _config);
@ -6003,42 +5926,43 @@ var ScrollSpy = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(ScrollSpy, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return ScrollSpy;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(window).on(Event.LOAD_DATA_API, function () {
var scrollSpys = $.makeArray($(Selector.DATA_SPY));
for (var i = scrollSpys.length; i--;) {
var $spy = $(scrollSpys[i]);
ScrollSpy._jQueryInterface.call($spy, $spy.data());
}
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -6047,6 +5971,7 @@ var ScrollSpy = function () {
$.fn[NAME] = ScrollSpy._jQueryInterface;
$.fn[NAME].Constructor = ScrollSpy;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return ScrollSpy._jQueryInterface;
@ -6063,29 +5988,25 @@ var ScrollSpy = function () {
*/
var Tab = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'tab';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.tab';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 150;
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
DROPDOWN_MENU: 'dropdown-menu',
ACTIVE: 'active',
@ -6093,7 +6014,6 @@ var Tab = function () {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
DROPDOWN: '.dropdown',
NAV_LIST_GROUP: '.nav, .list-group',
@ -6102,7 +6022,6 @@ var Tab = function () {
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]',
DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -6110,26 +6029,27 @@ var Tab = function () {
*/
};
var Tab = function () {
var Tab =
/*#__PURE__*/
function () {
function Tab(element) {
classCallCheck(this, Tab);
this._element = element;
}
} // getters
// getters
var _proto = Tab.prototype;
// public
Tab.prototype.show = function show() {
_proto.show = function show() {
var _this = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
var target = void 0;
var previous = void 0;
var target;
var previous;
var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0];
var selector = Util.getSelectorFromElement(this._element);
@ -6142,7 +6062,6 @@ var Tab = function () {
var hideEvent = $.Event(Event.HIDE, {
relatedTarget: this._element
});
var showEvent = $.Event(Event.SHOW, {
relatedTarget: previous
});
@ -6167,11 +6086,9 @@ var Tab = function () {
var hiddenEvent = $.Event(Event.HIDDEN, {
relatedTarget: _this._element
});
var shownEvent = $.Event(Event.SHOWN, {
relatedTarget: previous
});
$(previous).trigger(hiddenEvent);
$(_this._element).trigger(shownEvent);
};
@ -6183,17 +6100,17 @@ var Tab = function () {
}
};
Tab.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
}; // private
// private
Tab.prototype._activate = function _activate(element, container, callback) {
_proto._activate = function _activate(element, container, callback) {
var _this2 = this;
var activeElements = void 0;
var activeElements;
if (container.nodeName === 'UL') {
activeElements = $(container).find(Selector.ACTIVE_UL);
} else {
@ -6218,21 +6135,25 @@ var Tab = function () {
}
};
Tab.prototype._transitionComplete = function _transitionComplete(element, active, isTransitioning, callback) {
_proto._transitionComplete = function _transitionComplete(element, active, isTransitioning, callback) {
if (active) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
active.setAttribute('aria-expanded', false);
if (active.getAttribute('role') === 'tab') {
active.setAttribute('aria-selected', false);
}
}
$(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
if (element.getAttribute('role') === 'tab') {
element.setAttribute('aria-selected', true);
}
if (isTransitioning) {
Util.reflow(element);
@ -6242,8 +6163,8 @@ var Tab = function () {
}
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) {
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
@ -6254,9 +6175,8 @@ var Tab = function () {
if (callback) {
callback();
}
};
}; // static
// static
Tab._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
@ -6270,33 +6190,34 @@ var Tab = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Tab, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}]);
return Tab;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
event.preventDefault();
Tab._jQueryInterface.call($(this), 'show');
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -6305,6 +6226,7 @@ var Tab = function () {
$.fn[NAME] = Tab._jQueryInterface;
$.fn[NAME].Constructor = Tab;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Tab._jQueryInterface;
@ -6328,6 +6250,7 @@ var Tab = function () {
var version = $.fn.jquery.split(' ')[0].split('.');
var min = 3;
var max = 4;
if (version[0] < min || version[0] >= max) {
throw new Error('Bootstrap\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0');
}

File diff suppressed because one or more lines are too long

View File

@ -3,7 +3,6 @@
* Copyright 2011-2017 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
var bootstrap = (function (exports,$,Popper) {
'use strict';
@ -18,32 +17,25 @@ Popper = Popper && Popper.hasOwnProperty('default') ? Popper['default'] : Popper
*/
var Util = function () {
/**
* ------------------------------------------------------------------------
* Private TransitionEnd Helpers
* ------------------------------------------------------------------------
*/
var transition = false;
var MAX_UID = 1000000;
var TransitionEndEvent = {
WebkitTransition: 'webkitTransitionEnd',
MozTransition: 'transitionend',
OTransition: 'oTransitionEnd otransitionend',
transition: 'transitionend'
transition: 'transitionend' // shoutout AngusCroll (https://goo.gl/pxwQGp)
// shoutout AngusCroll (https://goo.gl/pxwQGp)
};function toType(obj) {
};
function toType(obj) {
return {}.toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase();
}
function isElement(obj) {
return (obj[0] || obj).nodeType;
}
function getSpecialTransitionEndEvent() {
return {
bindType: transition.end,
@ -52,6 +44,7 @@ var Util = function () {
if ($(event.target).is(this)) {
return event.handleObj.handler.apply(this, arguments); // eslint-disable-line prefer-rest-params
}
return undefined; // eslint-disable-line no-undefined
}
};
@ -79,49 +72,45 @@ var Util = function () {
var _this = this;
var called = false;
$(this).one(Util.TRANSITION_END, function () {
called = true;
});
setTimeout(function () {
if (!called) {
Util.triggerTransitionEnd(_this);
}
}, duration);
return this;
}
function setTransitionEndSupport() {
transition = transitionEndTest();
$.fn.emulateTransitionEnd = transitionEndEmulator;
if (Util.supportsTransitionEnd()) {
$.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent();
}
}
/**
* --------------------------------------------------------------------------
* Public Util Api
* --------------------------------------------------------------------------
*/
var Util = {
TRANSITION_END: 'bsTransitionEnd',
getUID: function getUID(prefix) {
do {
// eslint-disable-next-line no-bitwise
prefix += ~~(Math.random() * MAX_UID); // "~~" acts like a faster Math.floor() here
} while (document.getElementById(prefix));
return prefix;
},
getSelectorFromElement: function getSelectorFromElement(element) {
var selector = element.getAttribute('data-target');
if (!selector || selector === '#') {
selector = element.getAttribute('href') || '';
}
@ -142,82 +131,52 @@ var Util = function () {
supportsTransitionEnd: function supportsTransitionEnd() {
return Boolean(transition);
},
isElement: function isElement(obj) {
return (obj[0] || obj).nodeType;
},
typeCheckConfig: function typeCheckConfig(componentName, config, configTypes) {
for (var property in configTypes) {
if (Object.prototype.hasOwnProperty.call(configTypes, property)) {
var expectedTypes = configTypes[property];
var value = config[property];
var valueType = value && isElement(value) ? 'element' : toType(value);
var valueType = value && Util.isElement(value) ? 'element' : toType(value);
if (!new RegExp(expectedTypes).test(valueType)) {
throw new Error(componentName.toUpperCase() + ': ' + ('Option "' + property + '" provided type "' + valueType + '" ') + ('but expected type "' + expectedTypes + '".'));
throw new Error(componentName.toUpperCase() + ": " + ("Option \"" + property + "\" provided type \"" + valueType + "\" ") + ("but expected type \"" + expectedTypes + "\"."));
}
}
}
}
};
setTransitionEndSupport();
return Util;
}(jQuery);
var babelHelpers = {};
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
var classCallCheck = function (instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
};
}
var createClass = function () {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
return function (Constructor, protoProps, staticProps) {
if (protoProps) defineProperties(Constructor.prototype, protoProps);
if (staticProps) defineProperties(Constructor, staticProps);
return Constructor;
};
}();
var createClass = _createClass;
var inherits = function (subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
}
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
subClass.__proto__ = superClass;
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: false,
writable: true,
configurable: true
}
});
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
};
var possibleConstructorReturn = function (self, call) {
if (!self) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return call && (typeof call === "object" || typeof call === "function") ? call : self;
};
babelHelpers;
var inheritsLoose = _inheritsLoose;
/**
* --------------------------------------------------------------------------
@ -227,36 +186,30 @@ babelHelpers;
*/
var Alert = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'alert';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.alert';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 150;
var Selector = {
DISMISS: '[data-dismiss="alert"]'
};
var Event = {
CLOSE: 'close' + EVENT_KEY,
CLOSED: 'closed' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
CLOSE: "close" + EVENT_KEY,
CLOSED: "closed" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
ALERT: 'alert',
FADE: 'fade',
SHOW: 'show'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -264,21 +217,23 @@ var Alert = function () {
*/
};
var Alert = function () {
var Alert =
/*#__PURE__*/
function () {
function Alert(element) {
classCallCheck(this, Alert);
this._element = element;
}
} // getters
// getters
var _proto = Alert.prototype;
// public
Alert.prototype.close = function close(element) {
_proto.close = function close(element) {
element = element || this._element;
var rootElement = this._getRootElement(element);
var customEvent = this._triggerCloseEvent(rootElement);
if (customEvent.isDefaultPrevented()) {
@ -288,14 +243,13 @@ var Alert = function () {
this._removeElement(rootElement);
};
Alert.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
}; // private
// private
Alert.prototype._getRootElement = function _getRootElement(element) {
_proto._getRootElement = function _getRootElement(element) {
var selector = Util.getSelectorFromElement(element);
var parent = false;
@ -304,26 +258,26 @@ var Alert = function () {
}
if (!parent) {
parent = $(element).closest('.' + ClassName.ALERT)[0];
parent = $(element).closest("." + ClassName.ALERT)[0];
}
return parent;
};
Alert.prototype._triggerCloseEvent = function _triggerCloseEvent(element) {
_proto._triggerCloseEvent = function _triggerCloseEvent(element) {
var closeEvent = $.Event(Event.CLOSE);
$(element).trigger(closeEvent);
return closeEvent;
};
Alert.prototype._removeElement = function _removeElement(element) {
_proto._removeElement = function _removeElement(element) {
var _this = this;
$(element).removeClass(ClassName.SHOW);
if (!Util.supportsTransitionEnd() || !$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element);
return;
}
@ -332,11 +286,10 @@ var Alert = function () {
}).emulateTransitionEnd(TRANSITION_DURATION);
};
Alert.prototype._destroyElement = function _destroyElement(element) {
_proto._destroyElement = function _destroyElement(element) {
$(element).detach().trigger(Event.CLOSED).remove();
};
}; // static
// static
Alert._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
@ -365,22 +318,21 @@ var Alert = function () {
};
createClass(Alert, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}]);
return Alert;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DISMISS, Alert._handleDismiss(new Alert()));
$(document).on(Event.CLICK_DATA_API, Selector.DISMISS, Alert._handleDismiss(new Alert()));
/**
* ------------------------------------------------------------------------
* jQuery
@ -389,6 +341,7 @@ var Alert = function () {
$.fn[NAME] = Alert._jQueryInterface;
$.fn[NAME].Constructor = Alert;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Alert._jQueryInterface;
@ -405,26 +358,22 @@ var Alert = function () {
*/
var Button = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'button';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.button';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var ClassName = {
ACTIVE: 'active',
BUTTON: 'btn',
FOCUS: 'focus'
};
var Selector = {
DATA_TOGGLE_CARROT: '[data-toggle^="button"]',
DATA_TOGGLE: '[data-toggle="buttons"]',
@ -432,11 +381,9 @@ var Button = function () {
ACTIVE: '.active',
BUTTON: '.btn'
};
var Event = {
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY,
FOCUS_BLUR_DATA_API: 'focus' + EVENT_KEY + DATA_API_KEY + ' ' + ('blur' + EVENT_KEY + DATA_API_KEY)
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
FOCUS_BLUR_DATA_API: "focus" + EVENT_KEY + DATA_API_KEY + " " + ("blur" + EVENT_KEY + DATA_API_KEY)
/**
* ------------------------------------------------------------------------
* Class Definition
@ -444,18 +391,19 @@ var Button = function () {
*/
};
var Button = function () {
var Button =
/*#__PURE__*/
function () {
function Button(element) {
classCallCheck(this, Button);
this._element = element;
}
} // getters
// getters
var _proto = Button.prototype;
// public
Button.prototype.toggle = function toggle() {
_proto.toggle = function toggle() {
var triggerChangeEvent = true;
var addAriaPressed = true;
var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
@ -480,6 +428,7 @@ var Button = function () {
if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) {
return;
}
input.checked = !$(this._element).hasClass(ClassName.ACTIVE);
$(input).trigger('change');
}
@ -498,12 +447,11 @@ var Button = function () {
}
};
Button.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
}; // static
// static
Button._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
@ -521,23 +469,22 @@ var Button = function () {
};
createClass(Button, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}]);
return Button;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, function (event) {
event.preventDefault();
var button = event.target;
if (!$(button).hasClass(ClassName.BUTTON)) {
@ -549,7 +496,6 @@ var Button = function () {
var button = $(event.target).closest(Selector.BUTTON)[0];
$(button).toggleClass(ClassName.FOCUS, /^focus(in)?$/.test(event.type));
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -558,6 +504,7 @@ var Button = function () {
$.fn[NAME] = Button._jQueryInterface;
$.fn[NAME].Constructor = Button;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Button._jQueryInterface;
@ -574,22 +521,22 @@ var Button = function () {
*/
var Carousel = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'carousel';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.carousel';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 600;
var ARROW_LEFT_KEYCODE = 37; // KeyboardEvent.which value for left arrow key
var ARROW_RIGHT_KEYCODE = 39; // KeyboardEvent.which value for right arrow key
var TOUCHEVENT_COMPAT_WAIT = 500; // Time for mouse compat events to fire after touch
var Default = {
@ -599,7 +546,6 @@ var Carousel = function () {
pause: 'hover',
wrap: true
};
var DefaultType = {
interval: '(number|boolean)',
keyboard: 'boolean',
@ -607,25 +553,22 @@ var Carousel = function () {
pause: '(string|boolean)',
wrap: 'boolean'
};
var Direction = {
NEXT: 'next',
PREV: 'prev',
LEFT: 'left',
RIGHT: 'right'
};
var Event = {
SLIDE: 'slide' + EVENT_KEY,
SLID: 'slid' + EVENT_KEY,
KEYDOWN: 'keydown' + EVENT_KEY,
MOUSEENTER: 'mouseenter' + EVENT_KEY,
MOUSELEAVE: 'mouseleave' + EVENT_KEY,
TOUCHEND: 'touchend' + EVENT_KEY,
LOAD_DATA_API: 'load' + EVENT_KEY + DATA_API_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
SLIDE: "slide" + EVENT_KEY,
SLID: "slid" + EVENT_KEY,
KEYDOWN: "keydown" + EVENT_KEY,
MOUSEENTER: "mouseenter" + EVENT_KEY,
MOUSELEAVE: "mouseleave" + EVENT_KEY,
TOUCHEND: "touchend" + EVENT_KEY,
LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
CAROUSEL: 'carousel',
ACTIVE: 'active',
@ -636,7 +579,6 @@ var Carousel = function () {
PREV: 'carousel-item-prev',
ITEM: 'carousel-item'
};
var Selector = {
ACTIVE: '.active',
ACTIVE_ITEM: '.active.carousel-item',
@ -645,7 +587,6 @@ var Carousel = function () {
INDICATORS: '.carousel-indicators',
DATA_SLIDE: '[data-slide], [data-slide-to]',
DATA_RIDE: '[data-ride="carousel"]'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -653,37 +594,35 @@ var Carousel = function () {
*/
};
var Carousel = function () {
function Carousel(element, config) {
classCallCheck(this, Carousel);
var Carousel =
/*#__PURE__*/
function () {
function Carousel(element, config) {
this._items = null;
this._interval = null;
this._activeElement = null;
this._isPaused = false;
this._isSliding = false;
this.touchTimeout = null;
this._config = this._getConfig(config);
this._element = $(element)[0];
this._indicatorsElement = $(this._element).find(Selector.INDICATORS)[0];
this._addEventListeners();
}
} // getters
// getters
var _proto = Carousel.prototype;
// public
Carousel.prototype.next = function next() {
_proto.next = function next() {
if (!this._isSliding) {
this._slide(Direction.NEXT);
}
};
Carousel.prototype.nextWhenVisible = function nextWhenVisible() {
_proto.nextWhenVisible = function nextWhenVisible() {
// Don't call next when the page isn't visible
// or the carousel or its parent isn't visible
if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') {
@ -691,13 +630,13 @@ var Carousel = function () {
}
};
Carousel.prototype.prev = function prev() {
_proto.prev = function prev() {
if (!this._isSliding) {
this._slide(Direction.PREV);
}
};
Carousel.prototype.pause = function pause(event) {
_proto.pause = function pause(event) {
if (!event) {
this._isPaused = true;
}
@ -711,7 +650,7 @@ var Carousel = function () {
this._interval = null;
};
Carousel.prototype.cycle = function cycle(event) {
_proto.cycle = function cycle(event) {
if (!event) {
this._isPaused = false;
}
@ -726,7 +665,7 @@ var Carousel = function () {
}
};
Carousel.prototype.to = function to(index) {
_proto.to = function to(index) {
var _this = this;
this._activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
@ -755,10 +694,9 @@ var Carousel = function () {
this._slide(direction, this._items[index]);
};
Carousel.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$(this._element).off(EVENT_KEY);
$.removeData(this._element, DATA_KEY);
this._items = null;
this._config = null;
this._element = null;
@ -767,17 +705,16 @@ var Carousel = function () {
this._isSliding = null;
this._activeElement = null;
this._indicatorsElement = null;
};
}; // private
// private
Carousel.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Carousel.prototype._addEventListeners = function _addEventListeners() {
_proto._addEventListeners = function _addEventListeners() {
var _this2 = this;
if (this._config.keyboard) {
@ -792,6 +729,7 @@ var Carousel = function () {
}).on(Event.MOUSELEAVE, function (event) {
return _this2.cycle(event);
});
if ('ontouchstart' in document.documentElement) {
// if it's a touch-enabled device, mouseenter/leave are fired as
// part of the mouse compatibility events on first tap - the carousel
@ -802,9 +740,11 @@ var Carousel = function () {
// events to fire) we explicitly restart cycling
$(this._element).on(Event.TOUCHEND, function () {
_this2.pause();
if (_this2.touchTimeout) {
clearTimeout(_this2.touchTimeout);
}
_this2.touchTimeout = setTimeout(function (event) {
return _this2.cycle(event);
}, TOUCHEVENT_COMPAT_WAIT + _this2._config.interval);
@ -813,7 +753,7 @@ var Carousel = function () {
}
};
Carousel.prototype._keydown = function _keydown(event) {
_proto._keydown = function _keydown(event) {
if (/input|textarea/i.test(event.target.tagName)) {
return;
}
@ -823,24 +763,28 @@ var Carousel = function () {
event.preventDefault();
this.prev();
break;
case ARROW_RIGHT_KEYCODE:
event.preventDefault();
this.next();
break;
default:
return;
}
};
Carousel.prototype._getItemIndex = function _getItemIndex(element) {
_proto._getItemIndex = function _getItemIndex(element) {
this._items = $.makeArray($(element).parent().find(Selector.ITEM));
return this._items.indexOf(element);
};
Carousel.prototype._getItemByDirection = function _getItemByDirection(direction, activeElement) {
_proto._getItemByDirection = function _getItemByDirection(direction, activeElement) {
var isNextDirection = direction === Direction.NEXT;
var isPrevDirection = direction === Direction.PREV;
var activeIndex = this._getItemIndex(activeElement);
var lastItemIndex = this._items.length - 1;
var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex;
@ -850,26 +794,25 @@ var Carousel = function () {
var delta = direction === Direction.PREV ? -1 : 1;
var itemIndex = (activeIndex + delta) % this._items.length;
return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex];
};
Carousel.prototype._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
_proto._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
var targetIndex = this._getItemIndex(relatedTarget);
var fromIndex = this._getItemIndex($(this._element).find(Selector.ACTIVE_ITEM)[0]);
var slideEvent = $.Event(Event.SLIDE, {
relatedTarget: relatedTarget,
direction: eventDirectionName,
from: fromIndex,
to: targetIndex
});
$(this._element).trigger(slideEvent);
return slideEvent;
};
Carousel.prototype._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
_proto._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
if (this._indicatorsElement) {
$(this._indicatorsElement).find(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
@ -881,18 +824,21 @@ var Carousel = function () {
}
};
Carousel.prototype._slide = function _slide(direction, element) {
_proto._slide = function _slide(direction, element) {
var _this3 = this;
var activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
var activeElementIndex = this._getItemIndex(activeElement);
var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
var nextElementIndex = this._getItemIndex(nextElement);
var isCycling = Boolean(this._interval);
var directionalClassName = void 0;
var orderClassName = void 0;
var eventDirectionName = void 0;
var activeElementIndex = this._getItemIndex(activeElement);
var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
var nextElementIndex = this._getItemIndex(nextElement);
var isCycling = Boolean(this._interval);
var directionalClassName;
var orderClassName;
var eventDirectionName;
if (direction === Direction.NEXT) {
directionalClassName = ClassName.LEFT;
@ -910,6 +856,7 @@ var Carousel = function () {
}
var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName);
if (slideEvent.isDefaultPrevented()) {
return;
}
@ -935,21 +882,14 @@ var Carousel = function () {
});
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.SLIDE)) {
$(nextElement).addClass(orderClassName);
Util.reflow(nextElement);
$(activeElement).addClass(directionalClassName);
$(nextElement).addClass(directionalClassName);
$(activeElement).one(Util.TRANSITION_END, function () {
$(nextElement).removeClass(directionalClassName + ' ' + orderClassName).addClass(ClassName.ACTIVE);
$(activeElement).removeClass(ClassName.ACTIVE + ' ' + orderClassName + ' ' + directionalClassName);
$(nextElement).removeClass(directionalClassName + " " + orderClassName).addClass(ClassName.ACTIVE);
$(activeElement).removeClass(ClassName.ACTIVE + " " + orderClassName + " " + directionalClassName);
_this3._isSliding = false;
setTimeout(function () {
return $(_this3._element).trigger(slidEvent);
}, 0);
@ -957,7 +897,6 @@ var Carousel = function () {
} else {
$(activeElement).removeClass(ClassName.ACTIVE);
$(nextElement).addClass(ClassName.ACTIVE);
this._isSliding = false;
$(this._element).trigger(slidEvent);
}
@ -965,16 +904,16 @@ var Carousel = function () {
if (isCycling) {
this.cycle();
}
};
}; // static
// static
Carousel._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Default, $(this).data());
if ((typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object') {
if (typeof config === 'object') {
$.extend(_config, config);
}
@ -989,8 +928,9 @@ var Carousel = function () {
data.to(config);
} else if (typeof action === 'string') {
if (typeof data[action] === 'undefined') {
throw new Error('No method named "' + action + '"');
throw new Error("No method named \"" + action + "\"");
}
data[action]();
} else if (_config.interval) {
data.pause();
@ -1029,34 +969,33 @@ var Carousel = function () {
};
createClass(Carousel, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return Carousel;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler);
$(document).on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler);
$(window).on(Event.LOAD_DATA_API, function () {
$(Selector.DATA_RIDE).each(function () {
var $carousel = $(this);
Carousel._jQueryInterface.call($carousel, $carousel.data());
});
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -1065,6 +1004,7 @@ var Carousel = function () {
$.fn[NAME] = Carousel._jQueryInterface;
$.fn[NAME].Constructor = Carousel;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Carousel._jQueryInterface;
@ -1081,55 +1021,46 @@ var Carousel = function () {
*/
var Collapse = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'collapse';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.collapse';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 600;
var Default = {
toggle: true,
parent: ''
};
var DefaultType = {
toggle: 'boolean',
parent: 'string'
parent: '(string|element)'
};
var Event = {
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
SHOW: 'show',
COLLAPSE: 'collapse',
COLLAPSING: 'collapsing',
COLLAPSED: 'collapsed'
};
var Dimension = {
WIDTH: 'width',
HEIGHT: 'height'
};
var Selector = {
ACTIVES: '.show, .collapsing',
DATA_TOGGLE: '[data-toggle="collapse"]'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -1137,18 +1068,21 @@ var Collapse = function () {
*/
};
var Collapse = function () {
function Collapse(element, config) {
classCallCheck(this, Collapse);
var Collapse =
/*#__PURE__*/
function () {
function Collapse(element, config) {
this._isTransitioning = false;
this._element = element;
this._config = this._getConfig(config);
this._triggerArray = $.makeArray($('[data-toggle="collapse"][href="#' + element.id + '"],' + ('[data-toggle="collapse"][data-target="#' + element.id + '"]')));
this._triggerArray = $.makeArray($("[data-toggle=\"collapse\"][href=\"#" + element.id + "\"]," + ("[data-toggle=\"collapse\"][data-target=\"#" + element.id + "\"]")));
var tabToggles = $(Selector.DATA_TOGGLE);
for (var i = 0; i < tabToggles.length; i++) {
var elem = tabToggles[i];
var selector = Util.getSelectorFromElement(elem);
if (selector !== null && $(selector).filter(element).length > 0) {
this._triggerArray.push(elem);
}
@ -1163,13 +1097,13 @@ var Collapse = function () {
if (this._config.toggle) {
this.toggle();
}
}
} // getters
// getters
var _proto = Collapse.prototype;
// public
Collapse.prototype.toggle = function toggle() {
_proto.toggle = function toggle() {
if ($(this._element).hasClass(ClassName.SHOW)) {
this.hide();
} else {
@ -1177,18 +1111,19 @@ var Collapse = function () {
}
};
Collapse.prototype.show = function show() {
_proto.show = function show() {
var _this = this;
if (this._isTransitioning || $(this._element).hasClass(ClassName.SHOW)) {
return;
}
var actives = void 0;
var activesData = void 0;
var actives;
var activesData;
if (this._parent) {
actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES));
if (!actives.length) {
actives = null;
}
@ -1196,6 +1131,7 @@ var Collapse = function () {
if (actives) {
activesData = $(actives).data(DATA_KEY);
if (activesData && activesData._isTransitioning) {
return;
}
@ -1203,12 +1139,14 @@ var Collapse = function () {
var startEvent = $.Event(Event.SHOW);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
if (actives) {
Collapse._jQueryInterface.call($(actives), 'hide');
if (!activesData) {
$(actives).data(DATA_KEY, null);
}
@ -1217,7 +1155,6 @@ var Collapse = function () {
var dimension = this._getDimension();
$(this._element).removeClass(ClassName.COLLAPSE).addClass(ClassName.COLLAPSING);
this._element.style[dimension] = 0;
if (this._triggerArray.length) {
@ -1228,7 +1165,6 @@ var Collapse = function () {
var complete = function complete() {
$(_this._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).addClass(ClassName.SHOW);
_this._element.style[dimension] = '';
_this.setTransitioning(false);
@ -1242,14 +1178,12 @@ var Collapse = function () {
}
var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
var scrollSize = 'scroll' + capitalizedDimension;
var scrollSize = "scroll" + capitalizedDimension;
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
this._element.style[dimension] = this._element[scrollSize] + 'px';
this._element.style[dimension] = this._element[scrollSize] + "px";
};
Collapse.prototype.hide = function hide() {
_proto.hide = function hide() {
var _this2 = this;
if (this._isTransitioning || !$(this._element).hasClass(ClassName.SHOW)) {
@ -1258,24 +1192,25 @@ var Collapse = function () {
var startEvent = $.Event(Event.HIDE);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
var dimension = this._getDimension();
this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + 'px';
this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + "px";
Util.reflow(this._element);
$(this._element).addClass(ClassName.COLLAPSING).removeClass(ClassName.COLLAPSE).removeClass(ClassName.SHOW);
if (this._triggerArray.length) {
for (var i = 0; i < this._triggerArray.length; i++) {
var trigger = this._triggerArray[i];
var selector = Util.getSelectorFromElement(trigger);
if (selector !== null) {
var $elem = $(selector);
if (!$elem.hasClass(ClassName.SHOW)) {
$(trigger).addClass(ClassName.COLLAPSED).attr('aria-expanded', false);
}
@ -1287,6 +1222,7 @@ var Collapse = function () {
var complete = function complete() {
_this2.setTransitioning(false);
$(_this2._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).trigger(Event.HIDDEN);
};
@ -1300,48 +1236,56 @@ var Collapse = function () {
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
};
Collapse.prototype.setTransitioning = function setTransitioning(isTransitioning) {
_proto.setTransitioning = function setTransitioning(isTransitioning) {
this._isTransitioning = isTransitioning;
};
Collapse.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._config = null;
this._parent = null;
this._element = null;
this._triggerArray = null;
this._isTransitioning = null;
};
}; // private
// private
Collapse.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
config.toggle = Boolean(config.toggle); // coerce string values
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Collapse.prototype._getDimension = function _getDimension() {
_proto._getDimension = function _getDimension() {
var hasWidth = $(this._element).hasClass(Dimension.WIDTH);
return hasWidth ? Dimension.WIDTH : Dimension.HEIGHT;
};
Collapse.prototype._getParent = function _getParent() {
_proto._getParent = function _getParent() {
var _this3 = this;
var parent = $(this._config.parent)[0];
var selector = '[data-toggle="collapse"][data-parent="' + this._config.parent + '"]';
var parent = null;
if (Util.isElement(this._config.parent)) {
parent = this._config.parent; // it's a jQuery object
if (typeof this._config.parent.jquery !== 'undefined') {
parent = this._config.parent[0];
}
} else {
parent = $(this._config.parent)[0];
}
var selector = "[data-toggle=\"collapse\"][data-parent=\"" + this._config.parent + "\"]";
$(parent).find(selector).each(function (i, element) {
_this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
});
return parent;
};
Collapse.prototype._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
_proto._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
if (element) {
var isOpen = $(element).hasClass(ClassName.SHOW);
@ -1349,9 +1293,8 @@ var Collapse = function () {
$(triggerArray).toggleClass(ClassName.COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
}
}
};
}; // static
// static
Collapse._getTargetFromElement = function _getTargetFromElement(element) {
var selector = Util.getSelectorFromElement(element);
@ -1362,7 +1305,8 @@ var Collapse = function () {
return this.each(function () {
var $this = $(this);
var data = $this.data(DATA_KEY);
var _config = $.extend({}, Default, $this.data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
var _config = $.extend({}, Default, $this.data(), typeof config === 'object' && config);
if (!data && _config.toggle && /show|hide/.test(config)) {
_config.toggle = false;
@ -1375,33 +1319,34 @@ var Collapse = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Collapse, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return Collapse;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
// preventDefault only for <a> elements (which change the URL) not inside the collapsible element
if (event.currentTarget.tagName === 'A') {
@ -1414,10 +1359,10 @@ var Collapse = function () {
var $target = $(this);
var data = $target.data(DATA_KEY);
var config = data ? 'toggle' : $trigger.data();
Collapse._jQueryInterface.call($target, config);
});
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -1426,6 +1371,7 @@ var Collapse = function () {
$.fn[NAME] = Collapse._jQueryInterface;
$.fn[NAME].Constructor = Collapse;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Collapse._jQueryInterface;
@ -1442,7 +1388,6 @@ var Collapse = function () {
*/
var Dropdown = function () {
/**
* Check for Popper dependency
* Popper - https://popper.js.org
@ -1450,38 +1395,42 @@ var Dropdown = function () {
if (typeof Popper === 'undefined') {
throw new Error('Bootstrap dropdown require Popper.js (https://popper.js.org)');
}
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'dropdown';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.dropdown';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key
var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key
var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key
var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key
var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)
var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + '|' + ARROW_DOWN_KEYCODE + '|' + ESCAPE_KEYCODE);
var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + "|" + ARROW_DOWN_KEYCODE + "|" + ESCAPE_KEYCODE);
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
CLICK: 'click' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY,
KEYDOWN_DATA_API: 'keydown' + EVENT_KEY + DATA_API_KEY,
KEYUP_DATA_API: 'keyup' + EVENT_KEY + DATA_API_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
CLICK: "click" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
KEYDOWN_DATA_API: "keydown" + EVENT_KEY + DATA_API_KEY,
KEYUP_DATA_API: "keyup" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
DISABLED: 'disabled',
SHOW: 'show',
@ -1489,7 +1438,6 @@ var Dropdown = function () {
MENURIGHT: 'dropdown-menu-right',
MENULEFT: 'dropdown-menu-left'
};
var Selector = {
DATA_TOGGLE: '[data-toggle="dropdown"]',
FORM_CHILD: '.dropdown form',
@ -1497,23 +1445,19 @@ var Dropdown = function () {
NAVBAR_NAV: '.navbar-nav',
VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled)'
};
var AttachmentMap = {
TOP: 'top-start',
TOPEND: 'top-end',
BOTTOM: 'bottom-start',
BOTTOMEND: 'bottom-end'
};
var Default = {
offset: 0,
flip: true
};
var DefaultType = {
offset: '(number|string)',
flip: 'boolean'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -1521,10 +1465,11 @@ var Dropdown = function () {
*/
};
var Dropdown = function () {
function Dropdown(element, config) {
classCallCheck(this, Dropdown);
var Dropdown =
/*#__PURE__*/
function () {
function Dropdown(element, config) {
this._element = element;
this._popper = null;
this._config = this._getConfig(config);
@ -1532,18 +1477,19 @@ var Dropdown = function () {
this._inNavbar = this._detectNavbar();
this._addEventListeners();
}
} // getters
// getters
var _proto = Dropdown.prototype;
// public
Dropdown.prototype.toggle = function toggle() {
_proto.toggle = function toggle() {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
var parent = Dropdown._getParentFromElement(this._element);
var isActive = $(this._menu).hasClass(ClassName.SHOW);
Dropdown._clearMenus();
@ -1556,104 +1502,108 @@ var Dropdown = function () {
relatedTarget: this._element
};
var showEvent = $.Event(Event.SHOW, relatedTarget);
$(parent).trigger(showEvent);
if (showEvent.isDefaultPrevented()) {
return;
}
var element = this._element;
// for dropup with alignment we use the parent as popper container
var element = this._element; // for dropup with alignment we use the parent as popper container
if ($(parent).hasClass(ClassName.DROPUP)) {
if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
element = parent;
}
}
this._popper = new Popper(element, this._menu, this._getPopperConfig());
// if this is a touch-enabled device we add extra
this._popper = new Popper(element, this._menu, this._getPopperConfig()); // if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) {
$('body').children().on('mouseover', null, $.noop);
}
this._element.focus();
this._element.setAttribute('aria-expanded', true);
$(this._menu).toggleClass(ClassName.SHOW);
$(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
};
Dropdown.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._element).off(EVENT_KEY);
this._element = null;
this._menu = null;
if (this._popper !== null) {
this._popper.destroy();
}
this._popper = null;
};
Dropdown.prototype.update = function update() {
_proto.update = function update() {
this._inNavbar = this._detectNavbar();
if (this._popper !== null) {
this._popper.scheduleUpdate();
}
};
}; // private
// private
Dropdown.prototype._addEventListeners = function _addEventListeners() {
_proto._addEventListeners = function _addEventListeners() {
var _this = this;
$(this._element).on(Event.CLICK, function (event) {
event.preventDefault();
event.stopPropagation();
_this.toggle();
});
};
Dropdown.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, this.constructor.Default, $(this._element).data(), config);
Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
return config;
};
Dropdown.prototype._getMenuElement = function _getMenuElement() {
_proto._getMenuElement = function _getMenuElement() {
if (!this._menu) {
var parent = Dropdown._getParentFromElement(this._element);
this._menu = $(parent).find(Selector.MENU)[0];
}
return this._menu;
};
Dropdown.prototype._getPlacement = function _getPlacement() {
_proto._getPlacement = function _getPlacement() {
var $parentDropdown = $(this._element).parent();
var placement = AttachmentMap.BOTTOM;
var placement = AttachmentMap.BOTTOM; // Handle dropup
// Handle dropup
if ($parentDropdown.hasClass(ClassName.DROPUP)) {
placement = AttachmentMap.TOP;
if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.TOPEND;
}
} else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.BOTTOMEND;
}
return placement;
};
Dropdown.prototype._detectNavbar = function _detectNavbar() {
_proto._detectNavbar = function _detectNavbar() {
return $(this._element).closest('.navbar').length > 0;
};
Dropdown.prototype._getPopperConfig = function _getPopperConfig() {
_proto._getPopperConfig = function _getPopperConfig() {
var popperConfig = {
placement: this._getPlacement(),
modifiers: {
@ -1663,23 +1613,25 @@ var Dropdown = function () {
flip: {
enabled: this._config.flip
}
}
} // Disable Popper.js for Dropdown in Navbar
// Disable Popper.js for Dropdown in Navbar
};if (this._inNavbar) {
};
if (this._inNavbar) {
popperConfig.modifiers.applyStyle = {
enabled: !this._inNavbar
};
}
return popperConfig;
};
// static
return popperConfig;
}; // static
Dropdown._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
var _config = typeof config === 'object' ? config : null;
if (!data) {
data = new Dropdown(this, _config);
@ -1688,8 +1640,9 @@ var Dropdown = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
@ -1701,8 +1654,10 @@ var Dropdown = function () {
}
var toggles = $.makeArray($(Selector.DATA_TOGGLE));
for (var i = 0; i < toggles.length; i++) {
var parent = Dropdown._getParentFromElement(toggles[i]);
var context = $(toggles[i]).data(DATA_KEY);
var relatedTarget = {
relatedTarget: toggles[i]
@ -1713,6 +1668,7 @@ var Dropdown = function () {
}
var dropdownMenu = context._menu;
if (!$(parent).hasClass(ClassName.SHOW)) {
continue;
}
@ -1723,25 +1679,25 @@ var Dropdown = function () {
var hideEvent = $.Event(Event.HIDE, relatedTarget);
$(parent).trigger(hideEvent);
if (hideEvent.isDefaultPrevented()) {
continue;
}
// if this is a touch-enabled device we remove the extra
} // if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop);
}
toggles[i].setAttribute('aria-expanded', 'false');
$(dropdownMenu).removeClass(ClassName.SHOW);
$(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
}
};
Dropdown._getParentFromElement = function _getParentFromElement(element) {
var parent = void 0;
var parent;
var selector = Util.getSelectorFromElement(element);
if (selector) {
@ -1764,10 +1720,10 @@ var Dropdown = function () {
}
var parent = Dropdown._getParentFromElement(this);
var isActive = $(parent).hasClass(ClassName.SHOW);
if (!isActive && (event.which !== ESCAPE_KEYCODE || event.which !== SPACE_KEYCODE) || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
if (event.which === ESCAPE_KEYCODE) {
var toggle = $(parent).find(Selector.DATA_TOGGLE)[0];
$(toggle).trigger('focus');
@ -1803,38 +1759,38 @@ var Dropdown = function () {
};
createClass(Dropdown, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}, {
key: 'DefaultType',
key: "DefaultType",
get: function get() {
return DefaultType;
}
}]);
return Dropdown;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + ' ' + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
$(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + " " + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
event.preventDefault();
event.stopPropagation();
Dropdown._jQueryInterface.call($(this), 'toggle');
}).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) {
e.stopPropagation();
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -1843,6 +1799,7 @@ var Dropdown = function () {
$.fn[NAME] = Dropdown._jQueryInterface;
$.fn[NAME].Constructor = Dropdown;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Dropdown._jQueryInterface;
@ -1859,17 +1816,15 @@ var Dropdown = function () {
*/
var Modal = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'modal';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.modal';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 300;
@ -1882,28 +1837,25 @@ var Modal = function () {
focus: true,
show: true
};
var DefaultType = {
backdrop: '(boolean|string)',
keyboard: 'boolean',
focus: 'boolean',
show: 'boolean'
};
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
FOCUSIN: 'focusin' + EVENT_KEY,
RESIZE: 'resize' + EVENT_KEY,
CLICK_DISMISS: 'click.dismiss' + EVENT_KEY,
KEYDOWN_DISMISS: 'keydown.dismiss' + EVENT_KEY,
MOUSEUP_DISMISS: 'mouseup.dismiss' + EVENT_KEY,
MOUSEDOWN_DISMISS: 'mousedown.dismiss' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
FOCUSIN: "focusin" + EVENT_KEY,
RESIZE: "resize" + EVENT_KEY,
CLICK_DISMISS: "click.dismiss" + EVENT_KEY,
KEYDOWN_DISMISS: "keydown.dismiss" + EVENT_KEY,
MOUSEUP_DISMISS: "mouseup.dismiss" + EVENT_KEY,
MOUSEDOWN_DISMISS: "mousedown.dismiss" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
SCROLLBAR_MEASURER: 'modal-scrollbar-measure',
BACKDROP: 'modal-backdrop',
@ -1911,7 +1863,6 @@ var Modal = function () {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
DIALOG: '.modal-dialog',
DATA_TOGGLE: '[data-toggle="modal"]',
@ -1919,7 +1870,6 @@ var Modal = function () {
FIXED_CONTENT: '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top',
STICKY_CONTENT: '.sticky-top',
NAVBAR_TOGGLER: '.navbar-toggler'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -1927,10 +1877,11 @@ var Modal = function () {
*/
};
var Modal = function () {
function Modal(element, config) {
classCallCheck(this, Modal);
var Modal =
/*#__PURE__*/
function () {
function Modal(element, config) {
this._config = this._getConfig(config);
this._element = element;
this._dialog = $(element).find(Selector.DIALOG)[0];
@ -1940,17 +1891,17 @@ var Modal = function () {
this._ignoreBackdropClick = false;
this._originalBodyPadding = 0;
this._scrollbarWidth = 0;
}
} // getters
// getters
var _proto = Modal.prototype;
// public
Modal.prototype.toggle = function toggle(relatedTarget) {
_proto.toggle = function toggle(relatedTarget) {
return this._isShown ? this.hide() : this.show(relatedTarget);
};
Modal.prototype.show = function show(relatedTarget) {
_proto.show = function show(relatedTarget) {
var _this = this;
if (this._isTransitioning) {
@ -1964,7 +1915,6 @@ var Modal = function () {
var showEvent = $.Event(Event.SHOW, {
relatedTarget: relatedTarget
});
$(this._element).trigger(showEvent);
if (this._isShown || showEvent.isDefaultPrevented()) {
@ -1974,6 +1924,7 @@ var Modal = function () {
this._isShown = true;
this._checkScrollbar();
this._setScrollbar();
this._adjustDialog();
@ -1981,12 +1932,12 @@ var Modal = function () {
$(document.body).addClass(ClassName.OPEN);
this._setEscapeEvent();
this._setResizeEvent();
$(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
return _this.hide(event);
});
$(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
$(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
if ($(event.target).is(_this._element)) {
@ -2000,7 +1951,7 @@ var Modal = function () {
});
};
Modal.prototype.hide = function hide(event) {
_proto.hide = function hide(event) {
var _this2 = this;
if (event) {
@ -2018,7 +1969,6 @@ var Modal = function () {
}
var hideEvent = $.Event(Event.HIDE);
$(this._element).trigger(hideEvent);
if (!this._isShown || hideEvent.isDefaultPrevented()) {
@ -2028,17 +1978,15 @@ var Modal = function () {
this._isShown = false;
this._setEscapeEvent();
this._setResizeEvent();
$(document).off(Event.FOCUSIN);
$(this._element).removeClass(ClassName.SHOW);
$(this._element).off(Event.CLICK_DISMISS);
$(this._dialog).off(Event.MOUSEDOWN_DISMISS);
if (transition) {
$(this._element).one(Util.TRANSITION_END, function (event) {
return _this2._hideModal(event);
}).emulateTransitionEnd(TRANSITION_DURATION);
@ -2047,11 +1995,9 @@ var Modal = function () {
}
};
Modal.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(window, document, this._element, this._backdrop).off(EVENT_KEY);
this._config = null;
this._element = null;
this._dialog = null;
@ -2062,19 +2008,18 @@ var Modal = function () {
this._scrollbarWidth = null;
};
Modal.prototype.handleUpdate = function handleUpdate() {
_proto.handleUpdate = function handleUpdate() {
this._adjustDialog();
};
}; // private
// private
Modal.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Modal.prototype._showElement = function _showElement(relatedTarget) {
_proto._showElement = function _showElement(relatedTarget) {
var _this3 = this;
var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE);
@ -2085,7 +2030,9 @@ var Modal = function () {
}
this._element.style.display = 'block';
this._element.removeAttribute('aria-hidden');
this._element.scrollTop = 0;
if (transition) {
@ -2106,6 +2053,7 @@ var Modal = function () {
if (_this3._config.focus) {
_this3._element.focus();
}
_this3._isTransitioning = false;
$(_this3._element).trigger(shownEvent);
};
@ -2117,7 +2065,7 @@ var Modal = function () {
}
};
Modal.prototype._enforceFocus = function _enforceFocus() {
_proto._enforceFocus = function _enforceFocus() {
var _this4 = this;
$(document).off(Event.FOCUSIN) // guard against infinite focus loop
@ -2128,13 +2076,14 @@ var Modal = function () {
});
};
Modal.prototype._setEscapeEvent = function _setEscapeEvent() {
_proto._setEscapeEvent = function _setEscapeEvent() {
var _this5 = this;
if (this._isShown && this._config.keyboard) {
$(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
if (event.which === ESCAPE_KEYCODE) {
event.preventDefault();
_this5.hide();
}
});
@ -2143,7 +2092,7 @@ var Modal = function () {
}
};
Modal.prototype._setResizeEvent = function _setResizeEvent() {
_proto._setResizeEvent = function _setResizeEvent() {
var _this6 = this;
if (this._isShown) {
@ -2155,35 +2104,40 @@ var Modal = function () {
}
};
Modal.prototype._hideModal = function _hideModal() {
_proto._hideModal = function _hideModal() {
var _this7 = this;
this._element.style.display = 'none';
this._element.setAttribute('aria-hidden', true);
this._isTransitioning = false;
this._showBackdrop(function () {
$(document.body).removeClass(ClassName.OPEN);
_this7._resetAdjustments();
_this7._resetScrollbar();
$(_this7._element).trigger(Event.HIDDEN);
});
};
Modal.prototype._removeBackdrop = function _removeBackdrop() {
_proto._removeBackdrop = function _removeBackdrop() {
if (this._backdrop) {
$(this._backdrop).remove();
this._backdrop = null;
}
};
Modal.prototype._showBackdrop = function _showBackdrop(callback) {
_proto._showBackdrop = function _showBackdrop(callback) {
var _this8 = this;
var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
if (this._isShown && this._config.backdrop) {
var doAnimate = Util.supportsTransitionEnd() && animate;
this._backdrop = document.createElement('div');
this._backdrop.className = ClassName.BACKDROP;
@ -2192,15 +2146,16 @@ var Modal = function () {
}
$(this._backdrop).appendTo(document.body);
$(this._element).on(Event.CLICK_DISMISS, function (event) {
if (_this8._ignoreBackdropClick) {
_this8._ignoreBackdropClick = false;
return;
}
if (event.target !== event.currentTarget) {
return;
}
if (_this8._config.backdrop === 'static') {
_this8._element.focus();
} else {
@ -2229,6 +2184,7 @@ var Modal = function () {
var callbackRemove = function callbackRemove() {
_this8._removeBackdrop();
if (callback) {
callback();
}
@ -2242,96 +2198,92 @@ var Modal = function () {
} else if (callback) {
callback();
}
};
// ----------------------------------------------------------------------
}; // ----------------------------------------------------------------------
// the following methods are used to handle overflowing modals
// todo (fat): these should probably be refactored out of modal.js
// ----------------------------------------------------------------------
Modal.prototype._adjustDialog = function _adjustDialog() {
_proto._adjustDialog = function _adjustDialog() {
var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
if (!this._isBodyOverflowing && isModalOverflowing) {
this._element.style.paddingLeft = this._scrollbarWidth + 'px';
this._element.style.paddingLeft = this._scrollbarWidth + "px";
}
if (this._isBodyOverflowing && !isModalOverflowing) {
this._element.style.paddingRight = this._scrollbarWidth + 'px';
this._element.style.paddingRight = this._scrollbarWidth + "px";
}
};
Modal.prototype._resetAdjustments = function _resetAdjustments() {
_proto._resetAdjustments = function _resetAdjustments() {
this._element.style.paddingLeft = '';
this._element.style.paddingRight = '';
};
Modal.prototype._checkScrollbar = function _checkScrollbar() {
_proto._checkScrollbar = function _checkScrollbar() {
var rect = document.body.getBoundingClientRect();
this._isBodyOverflowing = rect.left + rect.right < window.innerWidth;
this._scrollbarWidth = this._getScrollbarWidth();
};
Modal.prototype._setScrollbar = function _setScrollbar() {
_proto._setScrollbar = function _setScrollbar() {
var _this9 = this;
if (this._isBodyOverflowing) {
// Note: DOMNode.style.paddingRight returns the actual value or '' if not set
// while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
// Adjust fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var actualPadding = $(element)[0].style.paddingRight;
var calculatedPadding = $(element).css('padding-right');
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + 'px');
});
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + "px");
}); // Adjust sticky content margin
// Adjust sticky content margin
$(Selector.STICKY_CONTENT).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + 'px');
});
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + "px");
}); // Adjust navbar-toggler margin
// Adjust navbar-toggler margin
$(Selector.NAVBAR_TOGGLER).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this9._scrollbarWidth + 'px');
});
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this9._scrollbarWidth + "px");
}); // Adjust body padding
// Adjust body padding
var actualPadding = document.body.style.paddingRight;
var calculatedPadding = $('body').css('padding-right');
$('body').data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + 'px');
$('body').data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + "px");
}
};
Modal.prototype._resetScrollbar = function _resetScrollbar() {
_proto._resetScrollbar = function _resetScrollbar() {
// Restore fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var padding = $(element).data('padding-right');
if (typeof padding !== 'undefined') {
$(element).css('padding-right', padding).removeData('padding-right');
}
});
}); // Restore sticky content and navbar-toggler margin
// Restore sticky content and navbar-toggler margin
$(Selector.STICKY_CONTENT + ', ' + Selector.NAVBAR_TOGGLER).each(function (index, element) {
$(Selector.STICKY_CONTENT + ", " + Selector.NAVBAR_TOGGLER).each(function (index, element) {
var margin = $(element).data('margin-right');
if (typeof margin !== 'undefined') {
$(element).css('margin-right', margin).removeData('margin-right');
}
});
}); // Restore body padding
// Restore body padding
var padding = $('body').data('padding-right');
if (typeof padding !== 'undefined') {
$('body').css('padding-right', padding).removeData('padding-right');
}
};
Modal.prototype._getScrollbarWidth = function _getScrollbarWidth() {
_proto._getScrollbarWidth = function _getScrollbarWidth() {
// thx d.walsh
var scrollDiv = document.createElement('div');
scrollDiv.className = ClassName.SCROLLBAR_MEASURER;
@ -2339,14 +2291,14 @@ var Modal = function () {
var scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
document.body.removeChild(scrollDiv);
return scrollbarWidth;
};
}; // static
// static
Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Modal.Default, $(this).data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
var _config = $.extend({}, Modal.Default, $(this).data(), typeof config === 'object' && config);
if (!data) {
data = new Modal(this, _config);
@ -2355,8 +2307,9 @@ var Modal = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config](relatedTarget);
} else if (_config.show) {
data.show(relatedTarget);
@ -2365,29 +2318,29 @@ var Modal = function () {
};
createClass(Modal, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return Modal;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
var _this10 = this;
var target = void 0;
var target;
var selector = Util.getSelectorFromElement(this);
if (selector) {
@ -2415,7 +2368,6 @@ var Modal = function () {
Modal._jQueryInterface.call($(target), config, this);
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -2424,6 +2376,7 @@ var Modal = function () {
$.fn[NAME] = Modal._jQueryInterface;
$.fn[NAME].Constructor = Modal;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Modal._jQueryInterface;
@ -2440,7 +2393,6 @@ var Modal = function () {
*/
var Tooltip = function () {
/**
* Check for Popper dependency
* Popper - https://popper.js.org
@ -2448,22 +2400,21 @@ var Tooltip = function () {
if (typeof Popper === 'undefined') {
throw new Error('Bootstrap tooltips require Popper.js (https://popper.js.org)');
}
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'tooltip';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.tooltip';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 150;
var CLASS_PREFIX = 'bs-tooltip';
var BSCLS_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g');
var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
var DefaultType = {
animation: 'boolean',
template: 'string',
@ -2477,7 +2428,6 @@ var Tooltip = function () {
container: '(string|element|boolean)',
fallbackPlacement: '(string|array)'
};
var AttachmentMap = {
AUTO: 'auto',
TOP: 'top',
@ -2485,7 +2435,6 @@ var Tooltip = function () {
BOTTOM: 'bottom',
LEFT: 'left'
};
var Default = {
animation: true,
template: '<div class="tooltip" role="tooltip">' + '<div class="arrow"></div>' + '<div class="tooltip-inner"></div></div>',
@ -2499,42 +2448,36 @@ var Tooltip = function () {
container: false,
fallbackPlacement: 'flip'
};
var HoverState = {
SHOW: 'show',
OUT: 'out'
};
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
INSERTED: 'inserted' + EVENT_KEY,
CLICK: 'click' + EVENT_KEY,
FOCUSIN: 'focusin' + EVENT_KEY,
FOCUSOUT: 'focusout' + EVENT_KEY,
MOUSEENTER: 'mouseenter' + EVENT_KEY,
MOUSELEAVE: 'mouseleave' + EVENT_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
INSERTED: "inserted" + EVENT_KEY,
CLICK: "click" + EVENT_KEY,
FOCUSIN: "focusin" + EVENT_KEY,
FOCUSOUT: "focusout" + EVENT_KEY,
MOUSEENTER: "mouseenter" + EVENT_KEY,
MOUSELEAVE: "mouseleave" + EVENT_KEY
};
var ClassName = {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
TOOLTIP: '.tooltip',
TOOLTIP_INNER: '.tooltip-inner',
ARROW: '.arrow'
};
var Trigger = {
HOVER: 'hover',
FOCUS: 'focus',
CLICK: 'click',
MANUAL: 'manual'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -2542,43 +2485,42 @@ var Tooltip = function () {
*/
};
var Tooltip = function () {
var Tooltip =
/*#__PURE__*/
function () {
function Tooltip(element, config) {
classCallCheck(this, Tooltip);
// private
this._isEnabled = true;
this._timeout = 0;
this._hoverState = '';
this._activeTrigger = {};
this._popper = null;
this._popper = null; // protected
// protected
this.element = element;
this.config = this._getConfig(config);
this.tip = null;
this._setListeners();
}
} // getters
// getters
var _proto = Tooltip.prototype;
// public
Tooltip.prototype.enable = function enable() {
_proto.enable = function enable() {
this._isEnabled = true;
};
Tooltip.prototype.disable = function disable() {
_proto.disable = function disable() {
this._isEnabled = false;
};
Tooltip.prototype.toggleEnabled = function toggleEnabled() {
_proto.toggleEnabled = function toggleEnabled() {
this._isEnabled = !this._isEnabled;
};
Tooltip.prototype.toggle = function toggle(event) {
_proto.toggle = function toggle(event) {
if (!this._isEnabled) {
return;
}
@ -2600,9 +2542,9 @@ var Tooltip = function () {
context._leave(null, context);
}
} else {
if ($(this.getTipElement()).hasClass(ClassName.SHOW)) {
this._leave(null, this);
return;
}
@ -2610,11 +2552,9 @@ var Tooltip = function () {
}
};
Tooltip.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
clearTimeout(this._timeout);
$.removeData(this.element, this.constructor.DATA_KEY);
$(this.element).off(this.constructor.EVENT_KEY);
$(this.element).closest('.modal').off('hide.bs.modal');
@ -2626,6 +2566,7 @@ var Tooltip = function () {
this._timeout = null;
this._hoverState = null;
this._activeTrigger = null;
if (this._popper !== null) {
this._popper.destroy();
}
@ -2636,7 +2577,7 @@ var Tooltip = function () {
this.tip = null;
};
Tooltip.prototype.show = function show() {
_proto.show = function show() {
var _this = this;
if ($(this.element).css('display') === 'none') {
@ -2644,9 +2585,9 @@ var Tooltip = function () {
}
var showEvent = $.Event(this.constructor.Event.SHOW);
if (this.isWithContent() && this._isEnabled) {
$(this.element).trigger(showEvent);
var isInTheDom = $.contains(this.element.ownerDocument.documentElement, this.element);
if (showEvent.isDefaultPrevented() || !isInTheDom) {
@ -2655,10 +2596,8 @@ var Tooltip = function () {
var tip = this.getTipElement();
var tipId = Util.getUID(this.constructor.NAME);
tip.setAttribute('id', tipId);
this.element.setAttribute('aria-describedby', tipId);
this.setContent();
if (this.config.animation) {
@ -2668,10 +2607,9 @@ var Tooltip = function () {
var placement = typeof this.config.placement === 'function' ? this.config.placement.call(this, tip, this.element) : this.config.placement;
var attachment = this._getAttachment(placement);
this.addAttachmentClass(attachment);
var container = this.config.container === false ? document.body : $(this.config.container);
$(tip).data(this.constructor.DATA_KEY, this);
if (!$.contains(this.element.ownerDocument.documentElement, this.tip)) {
@ -2679,7 +2617,6 @@ var Tooltip = function () {
}
$(this.element).trigger(this.constructor.Event.INSERTED);
this._popper = new Popper(this.element, tip, {
placement: attachment,
modifiers: {
@ -2702,13 +2639,11 @@ var Tooltip = function () {
_this._handlePopperPlacementChange(data);
}
});
$(tip).addClass(ClassName.SHOW);
// if this is a touch-enabled device we add extra
$(tip).addClass(ClassName.SHOW); // if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement) {
$('body').children().on('mouseover', null, $.noop);
}
@ -2717,9 +2652,9 @@ var Tooltip = function () {
if (_this.config.animation) {
_this._fixTransition();
}
var prevHoverState = _this._hoverState;
_this._hoverState = null;
$(_this.element).trigger(_this.constructor.Event.SHOWN);
if (prevHoverState === HoverState.OUT) {
@ -2735,19 +2670,23 @@ var Tooltip = function () {
}
};
Tooltip.prototype.hide = function hide(callback) {
_proto.hide = function hide(callback) {
var _this2 = this;
var tip = this.getTipElement();
var hideEvent = $.Event(this.constructor.Event.HIDE);
var complete = function complete() {
if (_this2._hoverState !== HoverState.SHOW && tip.parentNode) {
tip.parentNode.removeChild(tip);
}
_this2._cleanTipClass();
_this2.element.removeAttribute('aria-describedby');
$(_this2.element).trigger(_this2.constructor.Event.HIDDEN);
if (_this2._popper !== null) {
_this2._popper.destroy();
}
@ -2763,10 +2702,9 @@ var Tooltip = function () {
return;
}
$(tip).removeClass(ClassName.SHOW);
// if this is a touch-enabled device we remove the extra
$(tip).removeClass(ClassName.SHOW); // if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop);
}
@ -2776,7 +2714,6 @@ var Tooltip = function () {
this._activeTrigger[Trigger.HOVER] = false;
if (Util.supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) {
$(tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
} else {
complete();
@ -2785,36 +2722,36 @@ var Tooltip = function () {
this._hoverState = '';
};
Tooltip.prototype.update = function update() {
_proto.update = function update() {
if (this._popper !== null) {
this._popper.scheduleUpdate();
}
};
}; // protected
// protected
Tooltip.prototype.isWithContent = function isWithContent() {
_proto.isWithContent = function isWithContent() {
return Boolean(this.getTitle());
};
Tooltip.prototype.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment);
_proto.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
};
Tooltip.prototype.getTipElement = function getTipElement() {
_proto.getTipElement = function getTipElement() {
this.tip = this.tip || $(this.config.template)[0];
return this.tip;
};
Tooltip.prototype.setContent = function setContent() {
_proto.setContent = function setContent() {
var $tip = $(this.getTipElement());
this.setElementContent($tip.find(Selector.TOOLTIP_INNER), this.getTitle());
$tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW);
$tip.removeClass(ClassName.FADE + " " + ClassName.SHOW);
};
Tooltip.prototype.setElementContent = function setElementContent($element, content) {
_proto.setElementContent = function setElementContent($element, content) {
var html = this.config.html;
if ((typeof content === 'undefined' ? 'undefined' : _typeof(content)) === 'object' && (content.nodeType || content.jquery)) {
if (typeof content === 'object' && (content.nodeType || content.jquery)) {
// content is a DOM node or a jQuery
if (html) {
if (!$(content).parent().is($element)) {
@ -2828,7 +2765,7 @@ var Tooltip = function () {
}
};
Tooltip.prototype.getTitle = function getTitle() {
_proto.getTitle = function getTitle() {
var title = this.element.getAttribute('data-original-title');
if (!title) {
@ -2836,19 +2773,17 @@ var Tooltip = function () {
}
return title;
};
}; // private
// private
Tooltip.prototype._getAttachment = function _getAttachment(placement) {
_proto._getAttachment = function _getAttachment(placement) {
return AttachmentMap[placement.toUpperCase()];
};
Tooltip.prototype._setListeners = function _setListeners() {
_proto._setListeners = function _setListeners() {
var _this3 = this;
var triggers = this.config.trigger.split(' ');
triggers.forEach(function (trigger) {
if (trigger === 'click') {
$(_this3.element).on(_this3.constructor.Event.CLICK, _this3.config.selector, function (event) {
@ -2857,7 +2792,6 @@ var Tooltip = function () {
} else if (trigger !== Trigger.MANUAL) {
var eventIn = trigger === Trigger.HOVER ? _this3.constructor.Event.MOUSEENTER : _this3.constructor.Event.FOCUSIN;
var eventOut = trigger === Trigger.HOVER ? _this3.constructor.Event.MOUSELEAVE : _this3.constructor.Event.FOCUSOUT;
$(_this3.element).on(eventIn, _this3.config.selector, function (event) {
return _this3._enter(event);
}).on(eventOut, _this3.config.selector, function (event) {
@ -2880,17 +2814,17 @@ var Tooltip = function () {
}
};
Tooltip.prototype._fixTitle = function _fixTitle() {
var titleType = _typeof(this.element.getAttribute('data-original-title'));
_proto._fixTitle = function _fixTitle() {
var titleType = typeof this.element.getAttribute('data-original-title');
if (this.element.getAttribute('title') || titleType !== 'string') {
this.element.setAttribute('data-original-title', this.element.getAttribute('title') || '');
this.element.setAttribute('title', '');
}
};
Tooltip.prototype._enter = function _enter(event, context) {
_proto._enter = function _enter(event, context) {
var dataKey = this.constructor.DATA_KEY;
context = context || $(event.currentTarget).data(dataKey);
if (!context) {
@ -2908,7 +2842,6 @@ var Tooltip = function () {
}
clearTimeout(context._timeout);
context._hoverState = HoverState.SHOW;
if (!context.config.delay || !context.config.delay.show) {
@ -2923,9 +2856,8 @@ var Tooltip = function () {
}, context.config.delay.show);
};
Tooltip.prototype._leave = function _leave(event, context) {
_proto._leave = function _leave(event, context) {
var dataKey = this.constructor.DATA_KEY;
context = context || $(event.currentTarget).data(dataKey);
if (!context) {
@ -2942,7 +2874,6 @@ var Tooltip = function () {
}
clearTimeout(context._timeout);
context._hoverState = HoverState.OUT;
if (!context.config.delay || !context.config.delay.hide) {
@ -2957,7 +2888,7 @@ var Tooltip = function () {
}, context.config.delay.hide);
};
Tooltip.prototype._isWithActiveTrigger = function _isWithActiveTrigger() {
_proto._isWithActiveTrigger = function _isWithActiveTrigger() {
for (var trigger in this._activeTrigger) {
if (this._activeTrigger[trigger]) {
return true;
@ -2967,7 +2898,7 @@ var Tooltip = function () {
return false;
};
Tooltip.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, this.constructor.Default, $(this.element).data(), config);
if (typeof config.delay === 'number') {
@ -2986,11 +2917,10 @@ var Tooltip = function () {
}
Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
return config;
};
Tooltip.prototype._getDelegateConfig = function _getDelegateConfig() {
_proto._getDelegateConfig = function _getDelegateConfig() {
var config = {};
if (this.config) {
@ -3004,38 +2934,42 @@ var Tooltip = function () {
return config;
};
Tooltip.prototype._cleanTipClass = function _cleanTipClass() {
_proto._cleanTipClass = function _cleanTipClass() {
var $tip = $(this.getTipElement());
var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
if (tabClass !== null && tabClass.length > 0) {
$tip.removeClass(tabClass.join(''));
}
};
Tooltip.prototype._handlePopperPlacementChange = function _handlePopperPlacementChange(data) {
_proto._handlePopperPlacementChange = function _handlePopperPlacementChange(data) {
this._cleanTipClass();
this.addAttachmentClass(this._getAttachment(data.placement));
};
Tooltip.prototype._fixTransition = function _fixTransition() {
_proto._fixTransition = function _fixTransition() {
var tip = this.getTipElement();
var initConfigAnimation = this.config.animation;
if (tip.getAttribute('x-placement') !== null) {
return;
}
$(tip).removeClass(ClassName.FADE);
this.config.animation = false;
this.hide();
this.show();
this.config.animation = initConfigAnimation;
};
}; // static
// static
Tooltip._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config;
var _config = typeof config === 'object' && config;
if (!data && /dispose|hide/.test(config)) {
return;
@ -3048,60 +2982,62 @@ var Tooltip = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Tooltip, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}, {
key: 'NAME',
key: "NAME",
get: function get() {
return NAME;
}
}, {
key: 'DATA_KEY',
key: "DATA_KEY",
get: function get() {
return DATA_KEY;
}
}, {
key: 'Event',
key: "Event",
get: function get() {
return Event;
}
}, {
key: 'EVENT_KEY',
key: "EVENT_KEY",
get: function get() {
return EVENT_KEY;
}
}, {
key: 'DefaultType',
key: "DefaultType",
get: function get() {
return DefaultType;
}
}]);
return Tooltip;
}();
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
$.fn[NAME] = Tooltip._jQueryInterface;
$.fn[NAME].Constructor = Tooltip;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Tooltip._jQueryInterface;
@ -3118,54 +3054,46 @@ var Tooltip = function () {
*/
var Popover = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'popover';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.popover';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var JQUERY_NO_CONFLICT = $.fn[NAME];
var CLASS_PREFIX = 'bs-popover';
var BSCLS_PREFIX_REGEX = new RegExp('(^|\\s)' + CLASS_PREFIX + '\\S+', 'g');
var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
var Default = $.extend({}, Tooltip.Default, {
placement: 'right',
trigger: 'click',
content: '',
template: '<div class="popover" role="tooltip">' + '<div class="arrow"></div>' + '<h3 class="popover-header"></h3>' + '<div class="popover-body"></div></div>'
});
var DefaultType = $.extend({}, Tooltip.DefaultType, {
content: '(string|element|function)'
});
var ClassName = {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
TITLE: '.popover-header',
CONTENT: '.popover-body'
};
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
INSERTED: 'inserted' + EVENT_KEY,
CLICK: 'click' + EVENT_KEY,
FOCUSIN: 'focusin' + EVENT_KEY,
FOCUSOUT: 'focusout' + EVENT_KEY,
MOUSEENTER: 'mouseenter' + EVENT_KEY,
MOUSELEAVE: 'mouseleave' + EVENT_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
INSERTED: "inserted" + EVENT_KEY,
CLICK: "click" + EVENT_KEY,
FOCUSIN: "focusin" + EVENT_KEY,
FOCUSOUT: "focusout" + EVENT_KEY,
MOUSEENTER: "mouseenter" + EVENT_KEY,
MOUSELEAVE: "mouseleave" + EVENT_KEY
/**
* ------------------------------------------------------------------------
* Class Definition
@ -3173,59 +3101,60 @@ var Popover = function () {
*/
};
var Popover = function (_Tooltip) {
inherits(Popover, _Tooltip);
var Popover =
/*#__PURE__*/
function (_Tooltip) {
inheritsLoose(Popover, _Tooltip);
function Popover() {
classCallCheck(this, Popover);
return possibleConstructorReturn(this, _Tooltip.apply(this, arguments));
return _Tooltip.apply(this, arguments) || this;
}
// overrides
var _proto = Popover.prototype;
Popover.prototype.isWithContent = function isWithContent() {
// overrides
_proto.isWithContent = function isWithContent() {
return this.getTitle() || this._getContent();
};
Popover.prototype.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment);
_proto.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
};
Popover.prototype.getTipElement = function getTipElement() {
_proto.getTipElement = function getTipElement() {
this.tip = this.tip || $(this.config.template)[0];
return this.tip;
};
Popover.prototype.setContent = function setContent() {
var $tip = $(this.getTipElement());
_proto.setContent = function setContent() {
var $tip = $(this.getTipElement()); // we use append for html objects to maintain js events
// we use append for html objects to maintain js events
this.setElementContent($tip.find(Selector.TITLE), this.getTitle());
this.setElementContent($tip.find(Selector.CONTENT), this._getContent());
$tip.removeClass(ClassName.FADE + " " + ClassName.SHOW);
}; // private
$tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW);
};
// private
Popover.prototype._getContent = function _getContent() {
_proto._getContent = function _getContent() {
return this.element.getAttribute('data-content') || (typeof this.config.content === 'function' ? this.config.content.call(this.element) : this.config.content);
};
Popover.prototype._cleanTipClass = function _cleanTipClass() {
_proto._cleanTipClass = function _cleanTipClass() {
var $tip = $(this.getTipElement());
var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
if (tabClass !== null && tabClass.length > 0) {
$tip.removeClass(tabClass.join(''));
}
};
}; // static
// static
Popover._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
var _config = typeof config === 'object' ? config : null;
if (!data && /destroy|hide/.test(config)) {
return;
@ -3238,64 +3167,63 @@ var Popover = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Popover, null, [{
key: 'VERSION',
key: "VERSION",
// getters
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}, {
key: 'NAME',
key: "NAME",
get: function get() {
return NAME;
}
}, {
key: 'DATA_KEY',
key: "DATA_KEY",
get: function get() {
return DATA_KEY;
}
}, {
key: 'Event',
key: "Event",
get: function get() {
return Event;
}
}, {
key: 'EVENT_KEY',
key: "EVENT_KEY",
get: function get() {
return EVENT_KEY;
}
}, {
key: 'DefaultType',
key: "DefaultType",
get: function get() {
return DefaultType;
}
}]);
return Popover;
}(Tooltip);
/**
* ------------------------------------------------------------------------
* jQuery
* ------------------------------------------------------------------------
*/
$.fn[NAME] = Popover._jQueryInterface;
$.fn[NAME].Constructor = Popover;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Popover._jQueryInterface;
@ -3312,59 +3240,51 @@ var Popover = function () {
*/
var ScrollSpy = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'scrollspy';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.scrollspy';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var Default = {
offset: 10,
method: 'auto',
target: ''
};
var DefaultType = {
offset: 'number',
method: 'string',
target: '(string|element)'
};
var Event = {
ACTIVATE: 'activate' + EVENT_KEY,
SCROLL: 'scroll' + EVENT_KEY,
LOAD_DATA_API: 'load' + EVENT_KEY + DATA_API_KEY
ACTIVATE: "activate" + EVENT_KEY,
SCROLL: "scroll" + EVENT_KEY,
LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
DROPDOWN_ITEM: 'dropdown-item',
DROPDOWN_MENU: 'dropdown-menu',
ACTIVE: 'active'
};
var Selector = {
DATA_SPY: '[data-spy="scroll"]',
ACTIVE: '.active',
NAV_LIST_GROUP: '.nav, .list-group',
NAV_LINKS: '.nav-link',
NAV_ITEMS: '.nav-item',
LIST_ITEMS: '.list-group-item',
DROPDOWN: '.dropdown',
DROPDOWN_ITEMS: '.dropdown-item',
DROPDOWN_TOGGLE: '.dropdown-toggle'
};
var OffsetMethod = {
OFFSET: 'offset',
POSITION: 'position'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -3372,51 +3292,45 @@ var ScrollSpy = function () {
*/
};
var ScrollSpy = function () {
var ScrollSpy =
/*#__PURE__*/
function () {
function ScrollSpy(element, config) {
var _this = this;
classCallCheck(this, ScrollSpy);
this._element = element;
this._scrollElement = element.tagName === 'BODY' ? window : element;
this._config = this._getConfig(config);
this._selector = this._config.target + ' ' + Selector.NAV_LINKS + ',' + (this._config.target + ' ' + Selector.LIST_ITEMS + ',') + (this._config.target + ' ' + Selector.DROPDOWN_ITEMS);
this._selector = this._config.target + " " + Selector.NAV_LINKS + "," + (this._config.target + " " + Selector.LIST_ITEMS + ",") + (this._config.target + " " + Selector.DROPDOWN_ITEMS);
this._offsets = [];
this._targets = [];
this._activeTarget = null;
this._scrollHeight = 0;
$(this._scrollElement).on(Event.SCROLL, function (event) {
return _this._process(event);
});
this.refresh();
this._process();
}
// getters
this._process();
} // getters
var _proto = ScrollSpy.prototype;
// public
ScrollSpy.prototype.refresh = function refresh() {
_proto.refresh = function refresh() {
var _this2 = this;
var autoMethod = this._scrollElement !== this._scrollElement.window ? OffsetMethod.POSITION : OffsetMethod.OFFSET;
var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
this._offsets = [];
this._targets = [];
this._scrollHeight = this._getScrollHeight();
var targets = $.makeArray($(this._selector));
targets.map(function (element) {
var target = void 0;
var target;
var targetSelector = Util.getSelectorFromElement(element);
if (targetSelector) {
@ -3425,11 +3339,13 @@ var ScrollSpy = function () {
if (target) {
var targetBCR = target.getBoundingClientRect();
if (targetBCR.width || targetBCR.height) {
// todo (fat): remove sketch reliance on jQuery position/offset
return [$(target)[offsetMethod]().top + offsetBase, targetSelector];
}
}
return null;
}).filter(function (item) {
return item;
@ -3437,14 +3353,14 @@ var ScrollSpy = function () {
return a[0] - b[0];
}).forEach(function (item) {
_this2._offsets.push(item[0]);
_this2._targets.push(item[1]);
});
};
ScrollSpy.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._scrollElement).off(EVENT_KEY);
this._element = null;
this._scrollElement = null;
this._config = null;
@ -3453,42 +3369,44 @@ var ScrollSpy = function () {
this._targets = null;
this._activeTarget = null;
this._scrollHeight = null;
};
}; // private
// private
ScrollSpy.prototype._getConfig = function _getConfig(config) {
_proto._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
if (typeof config.target !== 'string') {
var id = $(config.target).attr('id');
if (!id) {
id = Util.getUID(NAME);
$(config.target).attr('id', id);
}
config.target = '#' + id;
config.target = "#" + id;
}
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
ScrollSpy.prototype._getScrollTop = function _getScrollTop() {
_proto._getScrollTop = function _getScrollTop() {
return this._scrollElement === window ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop;
};
ScrollSpy.prototype._getScrollHeight = function _getScrollHeight() {
_proto._getScrollHeight = function _getScrollHeight() {
return this._scrollElement.scrollHeight || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
};
ScrollSpy.prototype._getOffsetHeight = function _getOffsetHeight() {
_proto._getOffsetHeight = function _getOffsetHeight() {
return this._scrollElement === window ? window.innerHeight : this._scrollElement.getBoundingClientRect().height;
};
ScrollSpy.prototype._process = function _process() {
_proto._process = function _process() {
var scrollTop = this._getScrollTop() + this._config.offset;
var scrollHeight = this._getScrollHeight();
var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight();
if (this._scrollHeight !== scrollHeight) {
@ -3501,12 +3419,15 @@ var ScrollSpy = function () {
if (this._activeTarget !== target) {
this._activate(target);
}
return;
}
if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) {
this._activeTarget = null;
this._clear();
return;
}
@ -3519,17 +3440,17 @@ var ScrollSpy = function () {
}
};
ScrollSpy.prototype._activate = function _activate(target) {
_proto._activate = function _activate(target) {
this._activeTarget = target;
this._clear();
var queries = this._selector.split(',');
// eslint-disable-next-line arrow-body-style
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var queries = this._selector.split(','); // eslint-disable-next-line arrow-body-style
queries = queries.map(function (selector) {
return selector + "[data-target=\"" + target + "\"]," + (selector + "[href=\"" + target + "\"]");
});
var $link = $(queries.join(','));
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
@ -3537,10 +3458,12 @@ var ScrollSpy = function () {
$link.addClass(ClassName.ACTIVE);
} else {
// Set triggered link as active
$link.addClass(ClassName.ACTIVE);
// Set triggered links parents as active
$link.addClass(ClassName.ACTIVE); // Set triggered links parents as active
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ', ' + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE);
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ", " + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE); // Handle special case when .nav-link is inside .nav-item
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_ITEMS).children(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
@ -3548,16 +3471,16 @@ var ScrollSpy = function () {
});
};
ScrollSpy.prototype._clear = function _clear() {
_proto._clear = function _clear() {
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
};
}; // static
// static
ScrollSpy._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config;
var _config = typeof config === 'object' && config;
if (!data) {
data = new ScrollSpy(this, _config);
@ -3566,42 +3489,43 @@ var ScrollSpy = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(ScrollSpy, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}, {
key: 'Default',
key: "Default",
get: function get() {
return Default;
}
}]);
return ScrollSpy;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(window).on(Event.LOAD_DATA_API, function () {
var scrollSpys = $.makeArray($(Selector.DATA_SPY));
for (var i = scrollSpys.length; i--;) {
var $spy = $(scrollSpys[i]);
ScrollSpy._jQueryInterface.call($spy, $spy.data());
}
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -3610,6 +3534,7 @@ var ScrollSpy = function () {
$.fn[NAME] = ScrollSpy._jQueryInterface;
$.fn[NAME].Constructor = ScrollSpy;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return ScrollSpy._jQueryInterface;
@ -3626,29 +3551,25 @@ var ScrollSpy = function () {
*/
var Tab = function () {
/**
* ------------------------------------------------------------------------
* Constants
* ------------------------------------------------------------------------
*/
var NAME = 'tab';
var VERSION = '4.0.0-beta';
var DATA_KEY = 'bs.tab';
var EVENT_KEY = '.' + DATA_KEY;
var EVENT_KEY = "." + DATA_KEY;
var DATA_API_KEY = '.data-api';
var JQUERY_NO_CONFLICT = $.fn[NAME];
var TRANSITION_DURATION = 150;
var Event = {
HIDE: 'hide' + EVENT_KEY,
HIDDEN: 'hidden' + EVENT_KEY,
SHOW: 'show' + EVENT_KEY,
SHOWN: 'shown' + EVENT_KEY,
CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY
HIDE: "hide" + EVENT_KEY,
HIDDEN: "hidden" + EVENT_KEY,
SHOW: "show" + EVENT_KEY,
SHOWN: "shown" + EVENT_KEY,
CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
};
var ClassName = {
DROPDOWN_MENU: 'dropdown-menu',
ACTIVE: 'active',
@ -3656,7 +3577,6 @@ var Tab = function () {
FADE: 'fade',
SHOW: 'show'
};
var Selector = {
DROPDOWN: '.dropdown',
NAV_LIST_GROUP: '.nav, .list-group',
@ -3665,7 +3585,6 @@ var Tab = function () {
DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]',
DROPDOWN_TOGGLE: '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
/**
* ------------------------------------------------------------------------
* Class Definition
@ -3673,26 +3592,27 @@ var Tab = function () {
*/
};
var Tab = function () {
var Tab =
/*#__PURE__*/
function () {
function Tab(element) {
classCallCheck(this, Tab);
this._element = element;
}
} // getters
// getters
var _proto = Tab.prototype;
// public
Tab.prototype.show = function show() {
_proto.show = function show() {
var _this = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
var target = void 0;
var previous = void 0;
var target;
var previous;
var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0];
var selector = Util.getSelectorFromElement(this._element);
@ -3705,7 +3625,6 @@ var Tab = function () {
var hideEvent = $.Event(Event.HIDE, {
relatedTarget: this._element
});
var showEvent = $.Event(Event.SHOW, {
relatedTarget: previous
});
@ -3730,11 +3649,9 @@ var Tab = function () {
var hiddenEvent = $.Event(Event.HIDDEN, {
relatedTarget: _this._element
});
var shownEvent = $.Event(Event.SHOWN, {
relatedTarget: previous
});
$(previous).trigger(hiddenEvent);
$(_this._element).trigger(shownEvent);
};
@ -3746,17 +3663,17 @@ var Tab = function () {
}
};
Tab.prototype.dispose = function dispose() {
_proto.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
}; // private
// private
Tab.prototype._activate = function _activate(element, container, callback) {
_proto._activate = function _activate(element, container, callback) {
var _this2 = this;
var activeElements = void 0;
var activeElements;
if (container.nodeName === 'UL') {
activeElements = $(container).find(Selector.ACTIVE_UL);
} else {
@ -3781,21 +3698,25 @@ var Tab = function () {
}
};
Tab.prototype._transitionComplete = function _transitionComplete(element, active, isTransitioning, callback) {
_proto._transitionComplete = function _transitionComplete(element, active, isTransitioning, callback) {
if (active) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
active.setAttribute('aria-expanded', false);
if (active.getAttribute('role') === 'tab') {
active.setAttribute('aria-selected', false);
}
}
$(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
if (element.getAttribute('role') === 'tab') {
element.setAttribute('aria-selected', true);
}
if (isTransitioning) {
Util.reflow(element);
@ -3805,8 +3726,8 @@ var Tab = function () {
}
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) {
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
@ -3817,9 +3738,8 @@ var Tab = function () {
if (callback) {
callback();
}
};
}; // static
// static
Tab._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
@ -3833,33 +3753,34 @@ var Tab = function () {
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
throw new Error("No method named \"" + config + "\"");
}
data[config]();
}
});
};
createClass(Tab, null, [{
key: 'VERSION',
key: "VERSION",
get: function get() {
return VERSION;
}
}]);
return Tab;
}();
/**
* ------------------------------------------------------------------------
* Data Api implementation
* ------------------------------------------------------------------------
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
event.preventDefault();
Tab._jQueryInterface.call($(this), 'show');
});
/**
* ------------------------------------------------------------------------
* jQuery
@ -3868,6 +3789,7 @@ var Tab = function () {
$.fn[NAME] = Tab._jQueryInterface;
$.fn[NAME].Constructor = Tab;
$.fn[NAME].noConflict = function () {
$.fn[NAME] = JQUERY_NO_CONFLICT;
return Tab._jQueryInterface;
@ -3891,6 +3813,7 @@ var Tab = function () {
var version = $.fn.jquery.split(' ')[0].split('.');
var min = 3;
var max = 4;
if (version[0] < min || version[0] >= max) {
throw new Error('Bootstrap\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0');
}

File diff suppressed because one or more lines are too long

View File

@ -2,8 +2,7 @@
layout: docs
title: History
description: A brief overview of the history of Bootstrap.
redirect_from:
- /docs/4.0/about/
redirect_from: "/docs/4.0/about/"
group: about
---

View File

@ -59,10 +59,10 @@ You can see this in action with a live demo:
{% example html %}
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>Holy guacamole!</strong> You should check in on some of those fields below.
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<strong>Holy guacamole!</strong> You should check in on some of those fields below.
</div>
{% endexample %}

View File

@ -31,7 +31,7 @@ Badges scale to match the size of the immediate parent element by using relative
Badges can be used as part of links or buttons to provide a counter.
{% example html %}
<button class="btn btn-primary">
<button type="button" class="btn btn-primary">
Notifications <span class="badge badge-light">4</span>
</button>
{% endexample %}
@ -41,7 +41,7 @@ Note that depending on how they are used, badges may be confusing for users of s
Unless the context is clear (as with the "Notifications" example, where it is understood that the "4" is the number of notifications), consider including additional context with a visually hidden piece of additional text.
{% example html %}
<button class="btn btn-primary">
<button type="button" class="btn btn-primary">
Profile <span class="badge badge-light">9</span>
<span class="sr-only">unread messages</span>
</button>

View File

@ -4,6 +4,7 @@ title: Breadcrumb
description: Indicate the current page's location within a navigational hierarchy that automatically adds separators via CSS.
group: components
---
## Overview
Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content).

View File

@ -25,6 +25,7 @@ In order for assistive technologies (such as screen readers) to convey that a se
In addition, groups and toolbars should be given an explicit label, as most assistive technologies will otherwise not announce them, despite the presence of the correct role attribute. In the examples provided here, we use `aria-label`, but alternatives such as `aria-labelledby` can also be used.
{% endcallout %}
## Button toolbar
Combine sets of button groups into button toolbars for more complex components. Use utility classes as needed to space out groups, buttons, and more.

View File

@ -560,7 +560,7 @@ Just like with card groups, card footers in decks will automatically line up.
### Card columns
Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns with just CSS by wrapping them in `.card-columns`. Cards are built with CSS `column` properties instead of flexbox for easier alignment. Cards are ordered from top to bottom and left to right.
Cards can be organized into [Masonry](https://masonry.desandro.com/)-like columns with just CSS by wrapping them in `.card-columns`. Cards are built with CSS `column` properties instead of flexbox for easier alignment. Cards are ordered from top to bottom and left to right.
**Heads up!** Your mileage with card columns may vary. To prevent cards breaking across columns, we must set them to `display: inline-block` as `column-break-inside: avoid` isn't a bulletproof solution yet.
@ -591,7 +591,7 @@ Cards can be organized into [Masonry](http://masonry.desandro.com)-like columns
<p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
</div>
</div>
<div class="card bg-primary p-3 text-center">
<div class="card bg-primary text-white text-center p-3">
<blockquote class="blockquote mb-0">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat.</p>
<footer class="blockquote-footer">

View File

@ -186,9 +186,9 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
<tbody>
<tr>
<td>parent</td>
<td>selector</td>
<td>selector | jQuery object | DOM element </td>
<td>false</td>
<td>If a selector is provided, then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior - this is dependent on the <code>card</code> class). The attribute has to be set on the target collapsible area.</td>
<td>If parent is provided, then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior - this is dependent on the <code>card</code> class). The attribute has to be set on the target collapsible area.</td>
</tr>
<tr>
<td>toggle</td>

View File

@ -10,7 +10,7 @@ toc: true
Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They're made interactive with the included Bootstrap dropdown JavaScript plugin. They're toggled by clicking, not by hovering; this is [an intentional design decision.](http://markdotto.com/2012/02/27/bootstrap-explained-dropdowns/)
Dropdowns are built on a third party library, [Popper.js](https://popper.js.org), which provides dynamic positioning and viewport detection. Be sure to include [popper.min.js]({{ site.cdn.popper }}) before Bootstrap's JavaScript or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js.
Dropdowns are built on a third party library, [Popper.js](https://popper.js.org/), which provides dynamic positioning and viewport detection. Be sure to include [popper.min.js]({{ site.cdn.popper }}) before Bootstrap's JavaScript or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js.
If you're building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
@ -588,7 +588,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
<tbody>
<tr>
<td>offset</td>
<td>number | string</td>
<td>number | string | function</td>
<td>0</td>
<td>Offset of the dropdown relative to its target. For more information refer to Popper.js's <a href="https://popper.js.org/popper-documentation.html#modifiers..offset.offset">offset docs</a>.</td>
</tr>

View File

@ -672,7 +672,7 @@ While Bootstrap will apply these styles in all browsers, Internet Explorer 11 an
## Validation
Provide valuable, actionable feedback to your users with HTML5 form validation[available in all our supported browsers](http://caniuse.com/#feat=form-validation). Choose from the browser default validation feedback, or implement custom messages with our built-in classes and starter JavaScript.
Provide valuable, actionable feedback to your users with HTML5 form validation[available in all our supported browsers](https://caniuse.com/#feat=form-validation). Choose from the browser default validation feedback, or implement custom messages with our built-in classes and starter JavaScript.
{% callout warning %}
We **highly recommend** custom validation styles as native browser defaults are not announced to screen readers.
@ -739,18 +739,19 @@ When attempting to submit, you'll see the `:invalid` and `:valid` styles applied
<script>
// Example starter JavaScript for disabling form submissions if there are invalid fields
(function() {
"use strict";
window.addEventListener("load", function() {
var form = document.getElementById("needs-validation");
form.addEventListener("submit", function(event) {
if (form.checkValidity() == false) {
'use strict';
window.addEventListener('load', function() {
var form = document.getElementById('needs-validation');
form.addEventListener('submit', function(event) {
if (form.checkValidity() === false) {
event.preventDefault();
event.stopPropagation();
}
form.classList.add("was-validated");
form.classList.add('was-validated');
}, false);
}, false);
}());
})();
</script>
{% endexample %}

View File

@ -132,7 +132,7 @@ Buttons in input groups must wrapped in a `.input-group-btn` for proper alignmen
</div>
<br>
<div class="row">
<div class="col-lg-offset-3 col-lg-6">
<div class="col-lg-6 offset-lg-3">
<div class="input-group">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Hate it</button>

View File

@ -32,7 +32,7 @@ Keep reading for demos and usage guidelines.
Below is a _static_ modal example (meaning its `position` and `display` have been overridden). Included are the modal header, modal body (required for `padding`), and modal footer (optional). We ask that you include modal headers with dismiss actions whenever possible, or provide another explicit dismiss action.
<div class="bd-example bd-example-modal">
<div class="modal">
<div class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
@ -54,7 +54,7 @@ Below is a _static_ modal example (meaning its `position` and `display` have bee
</div>
{% highlight html %}
<div class="modal">
<div class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
@ -422,7 +422,7 @@ Modals have two optional sizes, available via modifier classes to be placed on a
{% highlight html %}
<!-- Large modal -->
<button class="btn btn-primary" data-toggle="modal" data-target=".bd-example-modal-lg">Large modal</button>
<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bd-example-modal-lg">Large modal</button>
<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">

View File

@ -323,7 +323,7 @@ Theming the navbar has never been easier thanks to the combination of theming cl
</ul>
<form class="form-inline">
<input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-secondary my-2 my-sm-0" type="submit">Search</button>
<button class="btn btn-outline-light my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
@ -395,7 +395,7 @@ When the container is within your navbar, its horizontal padding is removed at b
## Placement
Use our position utilities to place navbars in non-static positions. Choose from fixed to the top, fixed to the bottom, or stickied to the top. **Note that `position: sticky`, used for `.sticky-top`, [isn't fully supported in every browser](http://caniuse.com/#feat=css-sticky).**
Use our position utilities to place navbars in non-static positions. Choose from fixed to the top, fixed to the bottom, or stickied to the top. **Note that `position: sticky`, used for `.sticky-top`, [isn't fully supported in every browser](https://caniuse.com/#feat=css-sticky).**
{% example html %}
<nav class="navbar navbar-light bg-light">

View File

@ -301,22 +301,18 @@ If you're building our JS from source, it [requires `util.js`]({{ site.baseurl }
Dynamic tabbed interfaces, as described in the [<abbr title="Web Accessibility Initiative">WAI</abbr> <abbr title="Accessible Rich Internet Applications">ARIA</abbr> Authoring Practices](https://www.w3.org/TR/wai-aria-practices/#tabpanel), require `role="tablist"`, `role="tab"`, `role="tabpanel"`, and additional `aria-` attributes in order to convey their structure, functionality and current state to users of assistive technologies (such as screen readers).
Note that dynamic tabbed interfaces should <em>not</em> contain dropdown menus, as this causes both usability and accessibility issues. From a usability perspective, the fact that the currently displayed tab's trigger element is not immediately visible (as it's inside the closed dropdown menu) can cause confusion. From an accessibility point of view, there is currently no sensible way to map this sort of construct to a standard WAI ARIA pattern, meaning that it cannot be easily made understandable to users of assistive technologies.
<div class="bd-example bd-example-tabs">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-expanded="true">Home</a>
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile">Profile</a>
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
Dropdown
</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="dropdown1-tab" href="#dropdown1" role="tab" data-toggle="tab" aria-controls="dropdown1">@fat</a>
<a class="dropdown-item" id="dropdown2-tab" href="#dropdown2" role="tab" data-toggle="tab" aria-controls="dropdown2">@mdo</a>
</div>
<li class="nav-item">
<a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Contact</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
@ -326,38 +322,28 @@ Dynamic tabbed interfaces, as described in the [<abbr title="Web Accessibility I
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
<p>Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. Exercitation +1 labore velit, blog sartorial PBR leggings next level wes anderson artisan four loko farm-to-table craft beer twee. Qui photo booth letterpress, commodo enim craft beer mlkshk aliquip jean shorts ullamco ad vinyl cillum PBR. Homo nostrud organic, assumenda labore aesthetic magna delectus mollit. Keytar helvetica VHS salvia yr, vero magna velit sapiente labore stumptown. Vegan fanny pack odio cillum wes anderson 8-bit, sustainable jean shorts beard ut DIY ethical culpa terry richardson biodiesel. Art party scenester stumptown, tumblr butcher vero sint qui sapiente accusamus tattooed echo park.</p>
</div>
<div class="tab-pane fade" id="dropdown1" role="tabpanel" aria-labelledby="dropdown1-tab">
<div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">
<p>Etsy mixtape wayfarers, ethical wes anderson tofu before they sold out mcsweeney's organic lomo retro fanny pack lo-fi farm-to-table readymade. Messenger bag gentrify pitchfork tattooed craft beer, iphone skateboard locavore carles etsy salvia banksy hoodie helvetica. DIY synth PBR banksy irony. Leggings gentrify squid 8-bit cred pitchfork. Williamsburg banh mi whatever gluten-free, carles pitchfork biodiesel fixie etsy retro mlkshk vice blog. Scenester cred you probably haven't heard of them, vinyl craft beer blog stumptown. Pitchfork sustainable tofu synth chambray yr.</p>
</div>
<div class="tab-pane fade" id="dropdown2" role="tabpanel" aria-labelledby="dropdown2-tab">
<p>Trust fund seitan letterpress, keytar raw denim keffiyeh etsy art party before they sold out master cleanse gluten-free squid scenester freegan cosby sweater. Fanny pack portland seitan DIY, art party locavore wolf cliche high life echo park Austin. Cred vinyl keffiyeh DIY salvia PBR, banh mi before they sold out farm-to-table VHS viral locavore cosby sweater. Lomo wolf viral, mustache readymade thundercats keffiyeh craft beer marfa ethical. Wolf salvia freegan, sartorial keffiyeh echo park vegan.</p>
</div>
</div>
</div>
{% highlight html %}
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-expanded="true">Home</a>
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile">Profile</a>
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
Dropdown
</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="dropdown1-tab" href="#dropdown1" role="tab" data-toggle="tab" aria-controls="dropdown1">@fat</a>
<a class="dropdown-item" id="dropdown2-tab" href="#dropdown2" role="tab" data-toggle="tab" aria-controls="dropdown2">@mdo</a>
</div>
<li class="nav-item">
<a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Contact</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
<div class="tab-pane fade" id="dropdown1" role="tabpanel" aria-labelledby="dropdown1-tab">...</div>
<div class="tab-pane fade" id="dropdown2" role="tabpanel" aria-labelledby="dropdown2-tab">...</div>
<div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">...</div>
</div>
{% endhighlight %}
@ -365,17 +351,9 @@ To help fit your needs, this works with `<ul>`-based markup, as shown above, as
<div class="bd-example bd-example-tabs">
<nav class="nav nav-tabs" id="nav-tab" role="tablist">
<a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="home" aria-expanded="true">Home</a>
<a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="profile">Profile</a>
<div class="dropdown">
<a class="nav-item nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
Dropdown
</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="nav-dropdown1-tab" href="#nav-dropdown1" role="tab" data-toggle="tab" aria-controls="dropdown1">@fat</a>
<a class="dropdown-item" id="nav-dropdown2-tab" href="#nav-dropdown2" role="tab" data-toggle="tab" aria-controls="dropdown2">@mdo</a>
</div>
</div>
<a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-home" aria-selected="true">Home</a>
<a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-profile" aria-selected="false">Profile</a>
<a class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact" role="tab" aria-controls="nav-contact" aria-selected="false">Contact</a>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
@ -384,34 +362,22 @@ To help fit your needs, this works with `<ul>`-based markup, as shown above, as
<div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
<p>Nulla est ullamco ut irure incididunt nulla Lorem Lorem minim irure officia enim reprehenderit. Magna duis labore cillum sint adipisicing exercitation ipsum. Nostrud ut anim non exercitation velit laboris fugiat cupidatat. Commodo esse dolore fugiat sint velit ullamco magna consequat voluptate minim amet aliquip ipsum aute laboris nisi. Labore labore veniam irure irure ipsum pariatur mollit magna in cupidatat dolore magna irure esse tempor ad mollit. Dolore commodo nulla minim amet ipsum officia consectetur amet ullamco voluptate nisi commodo ea sit eu.</p>
</div>
<div class="tab-pane fade" id="nav-dropdown1" role="tabpanel" aria-labelledby="nav-dropdown1-tab">
<div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
<p>Sint sit mollit irure quis est nostrud cillum consequat Lorem esse do quis dolor esse fugiat sunt do. Eu ex commodo veniam Lorem aliquip laborum occaecat qui Lorem esse mollit dolore anim cupidatat. Deserunt officia id Lorem nostrud aute id commodo elit eiusmod enim irure amet eiusmod qui reprehenderit nostrud tempor. Fugiat ipsum excepteur in aliqua non et quis aliquip ad irure in labore cillum elit enim. Consequat aliquip incididunt ipsum et minim laborum laborum laborum et cillum labore. Deserunt adipisicing cillum id nulla minim nostrud labore eiusmod et amet. Laboris consequat consequat commodo non ut non aliquip reprehenderit nulla anim occaecat. Sunt sit ullamco reprehenderit irure ea ullamco Lorem aute nostrud magna.</p>
</div>
<div class="tab-pane fade" id="nav-dropdown2" role="tabpanel" aria-labelledby="nav-dropdown2-tab">
<p>Proident incididunt esse qui ea nisi ullamco aliquip nostrud velit sint duis. Aute culpa aute cillum sit consectetur mollit minim non reprehenderit tempor. Occaecat amet consectetur aute esse ad ullamco ad commodo mollit reprehenderit esse in consequat. Mollit minim do consectetur pariatur irure non id ea dolore occaecat adipisicing consectetur est aute magna non.</p>
</div>
</div>
</div>
{% highlight html %}
<nav class="nav nav-tabs" id="myTab" role="tablist">
<a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-home" aria-expanded="true">Home</a>
<a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-profile">Profile</a>
<div class="dropdown">
<a class="nav-item nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
Dropdown
</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="nav-dropdown1-tab" href="#nav-dropdown1" role="tab" data-toggle="tab" aria-controls="nav-dropdown1">@fat</a>
<a class="dropdown-item" id="nav-dropdown2-tab" href="#nav-dropdown2" role="tab" data-toggle="tab" aria-controls="nav-dropdown2">@mdo</a>
</div>
</div>
<a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-home" aria-selected="true">Home</a>
<a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-profile" aria-selected="false">Profile</a>
<a class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact" role="tab" aria-controls="nav-contact" aria-selected="false">Contact</a>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">...</div>
<div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">...</div>
<div class="tab-pane fade" id="nav-dropdown1" role="tabpanel" aria-labelledby="nav-dropdown1-tab">...</div>
<div class="tab-pane fade" id="nav-dropdown2" role="tabpanel" aria-labelledby="nav-dropdown2-tab">...</div>
<div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">...</div>
</div>
{% endhighlight %}
@ -420,17 +386,13 @@ The tabs plugin also works with pills.
<div class="bd-example bd-example-tabs">
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-expanded="true">Home</a>
<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-expanded="true">Profile</a>
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="pills-dropdown1-tab" href="#pills-dropdown1" role="tab" data-toggle="pill" aria-controls="pills-dropdown1">@fat</a>
<a class="dropdown-item" id="pills-dropdown2-tab" href="#pills-dropdown2" role="tab" data-toggle="pill" aria-controls="pills-dropdown2">@mdo</a>
</div>
<li class="nav-item">
<a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#pills-contact" role="tab" aria-controls="pills-contact" aria-selected="false">Contact</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
@ -440,36 +402,28 @@ The tabs plugin also works with pills.
<div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">
<p>Ad pariatur nostrud pariatur exercitation ipsum ipsum culpa mollit commodo mollit ex. Aute sunt incididunt amet commodo est sint nisi deserunt pariatur do. Aliquip ex eiusmod voluptate exercitation cillum id incididunt elit sunt. Qui minim sit magna Lorem id et dolore velit Lorem amet exercitation duis deserunt. Anim id labore elit adipisicing ut in id occaecat pariatur ut ullamco ea tempor duis.</p>
</div>
<div class="tab-pane fade" id="pills-dropdown1" role="tabpanel" aria-labelledby="pills-dropdown1-tab">
<div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">
<p>Est quis nulla laborum officia ad nisi ex nostrud culpa Lorem excepteur aliquip dolor aliqua irure ex. Nulla ut duis ipsum nisi elit fugiat commodo sunt reprehenderit laborum veniam eu veniam. Eiusmod minim exercitation fugiat irure ex labore incididunt do fugiat commodo aliquip sit id deserunt reprehenderit aliquip nostrud. Amet ex cupidatat excepteur aute veniam incididunt mollit cupidatat esse irure officia elit do ipsum ullamco Lorem. Ullamco ut ad minim do mollit labore ipsum laboris ipsum commodo sunt tempor enim incididunt. Commodo quis sunt dolore aliquip aute tempor irure magna enim minim reprehenderit. Ullamco consectetur culpa veniam sint cillum aliqua incididunt velit ullamco sunt ullamco quis quis commodo voluptate. Mollit nulla nostrud adipisicing aliqua cupidatat aliqua pariatur mollit voluptate voluptate consequat non.</p>
</div>
<div class="tab-pane fade" id="pills-dropdown2" role="tabpanel" aria-labelledby="nav-dropdown2-tab">
<p>Tempor anim aliquip qui nisi sit minim ex in cupidatat ipsum adipisicing. Ad non magna anim id ullamco do dolor sit adipisicing nulla exercitation. Qui Lorem eiusmod sint in laboris pariatur est adipisicing non sunt occaecat in mollit culpa sit. Aliquip id duis do do quis mollit ut duis. Non dolor reprehenderit do esse nostrud deserunt non eiusmod minim anim sit voluptate ipsum. Nulla elit aliqua do sunt labore velit anim nisi dolor nostrud consectetur fugiat ex qui velit ex tempor. Do cillum qui anim aliquip id cillum duis ex laboris tempor incididunt sint dolor ullamco tempor. Fugiat laboris enim anim veniam aliquip cillum irure.</p>
</div>
</div>
</div>
{% highlight html %}
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-expanded="true">Home</a>
<a class="nav-link active" id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-expanded="true">Profile</a>
<a class="nav-link" id="pills-profile-tab" data-toggle="pill" href="#pills-profile" role="tab" aria-controls="pills-profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
<div class="dropdown-menu">
<a class="dropdown-item" id="pills-dropdown1-tab" href="#pills-dropdown1" role="tab" data-toggle="pill" aria-controls="pills-dropdown1">@fat</a>
<a class="dropdown-item" id="pills-dropdown2-tab" href="#pills-dropdown2" role="tab" data-toggle="pill" aria-controls="pills-dropdown2">@mdo</a>
</div>
<li class="nav-item">
<a class="nav-link" id="pills-contact-tab" data-toggle="pill" href="#pills-contact" role="tab" aria-controls="pills-contact" aria-selected="false">Contact</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade show active" id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab">...</div>
<div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab">...</div>
<div class="tab-pane fade" id="pills-dropdown1" role="tabpanel" aria-labelledby="pills-dropdown1-tab">...</div>
<div class="tab-pane fade" id="pills-dropdown2" role="tabpanel" aria-labelledby="pills-dropdown2-tab">...</div>
<div class="tab-pane fade" id="pills-contact" role="tabpanel" aria-labelledby="pills-contact-tab">...</div>
</div>
{% endhighlight %}
@ -478,11 +432,11 @@ And with vertical pills.
<div class="bd-example bd-example-tabs">
<div class="row">
<div class="col-3">
<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist">
<a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" aria-expanded="true">Home</a>
<a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-expanded="true">Profile</a>
<a class="nav-link" id="v-pills-messages-tab" data-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-expanded="true">Messages</a>
<a class="nav-link" id="v-pills-settings-tab" data-toggle="pill" href="#v-pills-settings" role="tab" aria-controls="v-pills-settings" aria-expanded="true">Settings</a>
<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
<a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" aria-selected="true">Home</a>
<a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-selected="false">Profile</a>
<a class="nav-link" id="v-pills-messages-tab" data-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-selected="false">Messages</a>
<a class="nav-link" id="v-pills-settings-tab" data-toggle="pill" href="#v-pills-settings" role="tab" aria-controls="v-pills-settings" aria-selected="false">Settings</a>
</div>
</div>
<div class="col-9">
@ -505,11 +459,11 @@ And with vertical pills.
</div>
{% highlight html %}
<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist">
<a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" aria-expanded="true">Home</a>
<a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-expanded="true">Profile</a>
<a class="nav-link" id="v-pills-messages-tab" data-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-expanded="true">Messages</a>
<a class="nav-link" id="v-pills-settings-tab" data-toggle="pill" href="#v-pills-settings" role="tab" aria-controls="v-pills-settings" aria-expanded="true">Settings</a>
<div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
<a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" aria-selected="true">Home</a>
<a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-selected="false">Profile</a>
<a class="nav-link" id="v-pills-messages-tab" data-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-selected="false">Messages</a>
<a class="nav-link" id="v-pills-settings-tab" data-toggle="pill" href="#v-pills-settings" role="tab" aria-controls="v-pills-settings" aria-selected="false">Settings</a>
</div>
<div class="tab-content" id="v-pills-tabContent">
<div class="tab-pane fade show active" id="v-pills-home" role="tabpanel" aria-labelledby="v-pills-home-tab">...</div>
@ -527,25 +481,25 @@ You can activate a tab or pill navigation without writing any JavaScript by simp
<!-- Nav tabs -->
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#home" role="tab">Home</a>
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#profile" role="tab">Profile</a>
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#messages" role="tab">Messages</a>
<a class="nav-link" id="messages-tab" data-toggle="tab" href="#messages" role="tab" aria-controls="messages" aria-selected="false">Messages</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#settings" role="tab">Settings</a>
<a class="nav-link" id="settings-tab" data-toggle="tab" href="#settings" role="tab" aria-controls="settings" aria-selected="false">Settings</a>
</li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div class="tab-pane active" id="home" role="tabpanel">...</div>
<div class="tab-pane" id="profile" role="tabpanel">...</div>
<div class="tab-pane" id="messages" role="tabpanel">...</div>
<div class="tab-pane" id="settings" role="tabpanel">...</div>
<div class="tab-pane active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
<div class="tab-pane" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
<div class="tab-pane" id="messages" role="tabpanel" aria-labelledby="messages-tab">...</div>
<div class="tab-pane" id="settings" role="tabpanel" aria-labelledby="settings-tab">...</div>
</div>
{% endhighlight %}
@ -575,10 +529,10 @@ To make tabs fade in, add `.fade` to each `.tab-pane`. The first tab pane must a
{% highlight html %}
<div class="tab-content">
<div class="tab-pane fade show active" id="home" role="tabpanel">...</div>
<div class="tab-pane fade" id="profile" role="tabpanel">...</div>
<div class="tab-pane fade" id="messages" role="tabpanel">...</div>
<div class="tab-pane fade" id="settings" role="tabpanel">...</div>
<div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
<div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
<div class="tab-pane fade" id="messages" role="tabpanel" aria-labelledby="messages-tab">...</div>
<div class="tab-pane fade" id="settings" role="tabpanel" aria-labelledby="settings-tab">...</div>
</div>
{% endhighlight %}
@ -594,24 +548,24 @@ Activates a tab element and content container. Tab should have either a `data-ta
{% highlight html %}
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#home" role="tab" aria-controls="home">Home</a>
<a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#profile" role="tab" aria-controls="profile">Profile</a>
<a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#messages" role="tab" aria-controls="messages">Messages</a>
<a class="nav-link" id="messages-tab" data-toggle="tab" href="#messages" role="tab" aria-controls="messages" aria-selected="false">Messages</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#settings" role="tab" aria-controls="settings">Settings</a>
<a class="nav-link" id="settings-tab" data-toggle="tab" href="#settings" role="tab" aria-controls="settings" aria-selected="false">Settings</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="home" role="tabpanel">...</div>
<div class="tab-pane" id="profile" role="tabpanel">...</div>
<div class="tab-pane" id="messages" role="tabpanel">...</div>
<div class="tab-pane" id="settings" role="tabpanel">...</div>
<div class="tab-pane active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
<div class="tab-pane" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
<div class="tab-pane" id="messages" role="tabpanel" aria-labelledby="messages-tab">...</div>
<div class="tab-pane" id="settings" role="tabpanel" aria-labelledby="settings-tab">...</div>
</div>
<script>

View File

@ -11,7 +11,7 @@ toc: true
Things to know when using the popover plugin:
- Popovers rely on the 3rd party library [Popper.js](https://popper.js.org) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for popovers to work!
- Popovers rely on the 3rd party library [Popper.js](https://popper.js.org/) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for popovers to work!
- Popovers require the [tooltip plugin]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/tooltips/) as a dependency.
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
- Popovers are opt-in for performance reasons, so **you must initialize them yourself**.
@ -151,7 +151,6 @@ $('.popover-dismiss').popover({
{% endhighlight %}
## Usage
Enable popovers via JavaScript:
@ -180,7 +179,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
</tr>
<tr>
<td>container</td>
<td>string | false</td>
<td>string | element | false</td>
<td>false</td>
<td>
<p>Appends the popover to a specific element. Example: <code>container: 'body'</code>. This option is particularly useful in that it allows you to position the popover in the flow of the document near the triggering element - which will prevent the popover from floating away from the triggering element during a window resize.</p>
@ -222,7 +221,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
</tr>
<tr>
<td>selector</td>
<td>string</td>
<td>string | false</td>
<td>false</td>
<td>If a selector is provided, popover objects will be delegated to the specified targets. In practice, this is used to enable dynamic HTML content to have popovers added. See <a href="https://github.com/twbs/bootstrap/issues/4215">this</a> and <a href="https://jsbin.com/zopod/1/edit">an informative example</a>.</td>
</tr>
@ -306,7 +305,6 @@ Toggles an element's popover. **Returns to the caller before the popover has act
Hides and destroys an element's popover. Popovers that use delegation (which are created using [the `selector` option](#options)) cannot be individually destroyed on descendant trigger elements.
{% highlight js %}$('#element').popover('dispose'){% endhighlight %}
#### `.popover('enable')`

View File

@ -316,13 +316,13 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
<tbody>
<tr>
<td>activate.bs.scrollspy</td>
<td>This event fires whenever a new item becomes activated by the scrollspy.</td>
<td>This event fires on the scroll element whenever a new item becomes activated by the scrollspy.</td>
</tr>
</tbody>
</table>
{% highlight js %}
$('#myScrollspy').on('activate.bs.scrollspy', function () {
$('[data-spy="scroll"]').on('activate.bs.scrollspy', function () {
// do something…
})
{% endhighlight %}

View File

@ -10,7 +10,7 @@ toc: true
Things to know when using the tooltip plugin:
- Tooltips rely on the 3rd party library [Popper.js](https://popper.js.org) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for tooltips to work!
- Tooltips rely on the 3rd party library [Popper.js](https://popper.js.org/) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for tooltips to work!
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
- Tooltips are opt-in for performance reasons, so **you must initialize them yourself**.
- Tooltips with zero-length titles are never displayed.
@ -201,7 +201,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
</tr>
<tr>
<td>selector</td>
<td>string</td>
<td>string | false</td>
<td>false</td>
<td>If a selector is provided, tooltip objects will be delegated to the specified targets. In practice, this is used to enable dynamic HTML content to have popovers added. See <a href="https://github.com/twbs/bootstrap/issues/4215">this</a> and <a href="https://jsbin.com/zopod/1/edit">an informative example</a>.</td>
</tr>

View File

@ -69,3 +69,15 @@ Align images with the [helper float classes]({{ site.baseurl }}/docs/{{ site.doc
<img src="..." class="rounded" alt="...">
</div>
{% endhighlight %}
## Picture
If you are using the `<picture>` element to specify multiple `<source>` elements for a specific `<img>`, make sure to add the `.img-*` classes to the `<img>` and not to the `<picture>` tag.
{% highlight html %}
<picture>
<source srcset="..." type="image/svg+xml">
<img src="..." class="img-fluid img-thumbnail" alt="...">
</picture>
{% endhighlight %}

View File

@ -330,7 +330,7 @@ The `<abbr>` element receives basic styling to make it stand out amongst paragra
## HTML5 `[hidden]` attribute
HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden), which is styled as `display: none` by default. Borrowing an idea from [PureCSS](https://purecss.io), we improve upon this default by making `[hidden] { display: none !important; }` to help prevent its `display` from getting accidentally overridden. While `[hidden]` isn't natively supported by IE10, the explicit declaration in our CSS gets around that problem.
HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden), which is styled as `display: none` by default. Borrowing an idea from [PureCSS](https://purecss.io/), we improve upon this default by making `[hidden] { display: none !important; }` to help prevent its `display` from getting accidentally overridden. While `[hidden]` isn't natively supported by IE10, the explicit declaration in our CSS gets around that problem.
{% highlight html %}
<input type="text" hidden>

View File

@ -16,7 +16,7 @@ Bootstrap sets basic global display, typography, and link styles. When more cont
- Set the global link color via `$link-color` and apply link underlines only on `:hover`.
- Use `$body-bg` to set a `background-color` on the `<body>` (`#fff` by default).
These styles can be found within `_reboot.scss`, and the global variables are defined in `_variables.scss`.
These styles can be found within `_reboot.scss`, and the global variables are defined in `_variables.scss`. Make sure to set `$font-size-base` in `rem`.
## Headings
@ -297,24 +297,24 @@ Here's an example of it in practice. Choose whatever `font-size`s and media quer
{% highlight scss %}
html {
font-size: 14px;
font-size: 1rem;
}
@include media-breakpoint-up(sm) {
html {
font-size: 16px;
font-size: 1.2rem;
}
}
@include media-breakpoint-up(md) {
html {
font-size: 20px;
font-size: 1.4rem;
}
}
@include media-breakpoint-up(lg) {
html {
font-size: 28px;
font-size: 1.6rem;
}
}
{% endhighlight %}

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
@ -18,90 +18,96 @@
<body>
<div class="collapse bg-dark" id="navbarHeader">
<div class="container">
<div class="row">
<div class="col-sm-8 py-4">
<h4 class="text-white">About</h4>
<p class="text-muted">Add some information about the album below, the author, or any other background context. Make it a few sentences long so folks can pick up some informative tidbits. Then, link them off to some social networking sites or contact information.</p>
</div>
<div class="col-sm-4 py-4">
<h4 class="text-white">Contact</h4>
<ul class="list-unstyled">
<li><a href="#" class="text-white">Follow on Twitter</a></li>
<li><a href="#" class="text-white">Like on Facebook</a></li>
<li><a href="#" class="text-white">Email me</a></li>
</ul>
<header>
<div class="collapse bg-dark" id="navbarHeader">
<div class="container">
<div class="row">
<div class="col-sm-8 py-4">
<h4 class="text-white">About</h4>
<p class="text-muted">Add some information about the album below, the author, or any other background context. Make it a few sentences long so folks can pick up some informative tidbits. Then, link them off to some social networking sites or contact information.</p>
</div>
<div class="col-sm-4 py-4">
<h4 class="text-white">Contact</h4>
<ul class="list-unstyled">
<li><a href="#" class="text-white">Follow on Twitter</a></li>
<li><a href="#" class="text-white">Like on Facebook</a></li>
<li><a href="#" class="text-white">Email me</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="navbar navbar-dark bg-dark">
<div class="container d-flex justify-content-between">
<a href="#" class="navbar-brand">Album</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarHeader" aria-controls="navbarHeader" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</div>
<section class="jumbotron text-center">
<div class="container">
<h1 class="jumbotron-heading">Album example</h1>
<p class="lead text-muted">Something short and leading about the collection below—its contents, the creator, etc. Make it short and sweet, but not too short so folks don't simply skip over it entirely.</p>
<p>
<a href="#" class="btn btn-primary">Main call to action</a>
<a href="#" class="btn btn-secondary">Secondary action</a>
</p>
</div>
</section>
<div class="album text-muted">
<div class="container">
<div class="row">
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280/thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="navbar navbar-dark bg-dark">
<div class="container d-flex justify-content-between">
<a href="#" class="navbar-brand">Album</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarHeader" aria-controls="navbarHeader" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</div>
</div>
</header>
<main role="main">
<section class="jumbotron text-center">
<div class="container">
<h1 class="jumbotron-heading">Album example</h1>
<p class="lead text-muted">Something short and leading about the collection below—its contents, the creator, etc. Make it short and sweet, but not too short so folks don't simply skip over it entirely.</p>
<p>
<a href="#" class="btn btn-primary">Main call to action</a>
<a href="#" class="btn btn-secondary">Secondary action</a>
</p>
</div>
</section>
<div class="album text-muted">
<div class="container">
<div class="row">
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
<div class="card">
<img data-src="holder.js/100px280?theme=thumb" alt="Card image cap">
<p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
</div>
</div>
</div>
</div>
</main>
<footer class="text-muted">
<div class="container">
@ -119,12 +125,14 @@
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="../../../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="../../../../assets/js/vendor/popper.min.js"></script>
<script src="../../../../dist/js/bootstrap.min.js"></script>
<script src="../../../../assets/js/vendor/holder.min.js"></script>
<script>
$(function () {
Holder.addTheme("thumb", { background: "#55595c", foreground: "#eceeef", text: "Thumbnail" });
Holder.addTheme('thumb', {
bg: '#55595c',
fg: '#eceeef',
text: 'Thumbnail'
});
</script>
<script src="../../../../dist/js/bootstrap.min.js"></script>
</body>
</html>

View File

@ -20,7 +20,7 @@ h4, .h4,
h5, .h5,
h6, .h6 {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: normal;
font-weight: 400;
color: #333;
}
@ -41,8 +41,7 @@ h6, .h6 {
.blog-masthead {
margin-bottom: 3rem;
background-color: #428bca;
-webkit-box-shadow: inset 0 -.1rem .25rem rgba(0,0,0,.1);
box-shadow: inset 0 -.1rem .25rem rgba(0,0,0,.1);
box-shadow: inset 0 -.1rem .25rem rgba(0,0,0,.1);
}
/* Nav links */
@ -89,7 +88,7 @@ h6, .h6 {
.blog-title {
margin-bottom: 0;
font-size: 2rem;
font-weight: normal;
font-weight: 400;
}
.blog-description {
font-size: 1.1rem;
@ -110,7 +109,6 @@ h6, .h6 {
/* Sidebar modules for boxing content */
.sidebar-module {
padding: 1rem;
/*margin: 0 -1rem 1rem;*/
}
.sidebar-module-inset {
padding: 1rem;

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
@ -18,26 +18,28 @@
<body>
<div class="blog-masthead">
<div class="container">
<nav class="nav">
<a class="nav-link active" href="#">Home</a>
<a class="nav-link" href="#">New features</a>
<a class="nav-link" href="#">Press</a>
<a class="nav-link" href="#">New hires</a>
<a class="nav-link" href="#">About</a>
</nav>
<header>
<div class="blog-masthead">
<div class="container">
<nav class="nav">
<a class="nav-link active" href="#">Home</a>
<a class="nav-link" href="#">New features</a>
<a class="nav-link" href="#">Press</a>
<a class="nav-link" href="#">New hires</a>
<a class="nav-link" href="#">About</a>
</nav>
</div>
</div>
</div>
<div class="blog-header">
<div class="container">
<h1 class="blog-title">The Bootstrap Blog</h1>
<p class="lead blog-description">An example blog template built with Bootstrap.</p>
<div class="blog-header">
<div class="container">
<h1 class="blog-title">The Bootstrap Blog</h1>
<p class="lead blog-description">An example blog template built with Bootstrap.</p>
</div>
</div>
</div>
</header>
<div class="container">
<main role="main" class="container">
<div class="row">
@ -109,7 +111,7 @@
</div><!-- /.blog-main -->
<div class="col-sm-3 ml-sm-auto blog-sidebar">
<aside class="col-sm-3 ml-sm-auto blog-sidebar">
<div class="sidebar-module sidebar-module-inset">
<h4>About</h4>
<p>Etiam porta <em>sem malesuada magna</em> mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.</p>
@ -139,14 +141,14 @@
<li><a href="#">Facebook</a></li>
</ol>
</div>
</div><!-- /.blog-sidebar -->
</aside><!-- /.blog-sidebar -->
</div><!-- /.row -->
</div><!-- /.container -->
</main><!-- /.container -->
<footer class="blog-footer">
<p>Blog template built for <a href="https://getbootstrap.com">Bootstrap</a> by <a href="https://twitter.com/mdo">@mdo</a>.</p>
<p>Blog template built for <a href="https://getbootstrap.com/">Bootstrap</a> by <a href="https://twitter.com/mdo">@mdo</a>.</p>
<p>
<a href="#">Back to top</a>
</p>

View File

@ -18,8 +18,8 @@ body {
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
z-index: 10;
bottom: 3rem;
z-index: 10;
}
/* Declare heights because of positioning of img element */
@ -45,7 +45,7 @@ body {
text-align: center;
}
.marketing h2 {
font-weight: normal;
font-weight: 400;
}
.marketing .col-lg-4 p {
margin-right: .75rem;

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
@ -17,158 +17,164 @@
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Carousel</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<form class="form-inline mt-2 mt-md-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
<header>
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Carousel</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<form class="form-inline mt-2 mt-md-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
</header>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="first-slide" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="First slide">
<div class="container">
<div class="carousel-caption text-left">
<h1>Example headline.</h1>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-lg btn-primary" href="#" role="button">Sign up today</a></p>
<main role="main">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="first-slide" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="First slide">
<div class="container">
<div class="carousel-caption text-left">
<h1>Example headline.</h1>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-lg btn-primary" href="#" role="button">Sign up today</a></p>
</div>
</div>
</div>
<div class="carousel-item">
<img class="second-slide" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Second slide">
<div class="container">
<div class="carousel-caption">
<h1>Another example headline.</h1>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
</div>
</div>
</div>
<div class="carousel-item">
<img class="third-slide" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Third slide">
<div class="container">
<div class="carousel-caption text-right">
<h1>One more for good measure.</h1>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-lg btn-primary" href="#" role="button">Browse gallery</a></p>
</div>
</div>
</div>
</div>
<div class="carousel-item">
<img class="second-slide" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Second slide">
<div class="container">
<div class="carousel-caption">
<h1>Another example headline.</h1>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a></p>
</div>
<a class="carousel-control-prev" href="#myCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<!-- Marketing messaging and featurettes
================================================== -->
<!-- Wrap the rest of the page in another container to center all the content. -->
<div class="container marketing">
<!-- Three columns of text below the carousel -->
<div class="row">
<div class="col-lg-4">
<img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
<h2>Heading</h2>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
<p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
<h2>Heading</h2>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
<p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
<h2>Heading</h2>
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
<p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 -->
</div><!-- /.row -->
<!-- START THE FEATURETTES -->
<hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7">
<h2 class="featurette-heading">First featurette heading. <span class="text-muted">It'll blow your mind.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
</div>
<div class="col-md-5">
<img class="featurette-image img-fluid mx-auto" data-src="holder.js/500x500/auto" alt="Generic placeholder image">
</div>
</div>
<div class="carousel-item">
<img class="third-slide" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Third slide">
<div class="container">
<div class="carousel-caption text-right">
<h1>One more for good measure.</h1>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-lg btn-primary" href="#" role="button">Browse gallery</a></p>
</div>
<hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7 order-md-2">
<h2 class="featurette-heading">Oh yeah, it's that good. <span class="text-muted">See for yourself.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
</div>
<div class="col-md-5 order-md-1">
<img class="featurette-image img-fluid mx-auto" data-src="holder.js/500x500/auto" alt="Generic placeholder image">
</div>
</div>
</div>
<a class="carousel-control-prev" href="#myCarousel" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#myCarousel" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<hr class="featurette-divider">
<!-- Marketing messaging and featurettes
================================================== -->
<!-- Wrap the rest of the page in another container to center all the content. -->
<div class="container marketing">
<!-- Three columns of text below the carousel -->
<div class="row">
<div class="col-lg-4">
<img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
<h2>Heading</h2>
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
<p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
<h2>Heading</h2>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
<p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 -->
<div class="col-lg-4">
<img class="rounded-circle" src="data:image/gif;base64,R0lGODlhAQABAIAAAHd3dwAAACH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==" alt="Generic placeholder image" width="140" height="140">
<h2>Heading</h2>
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
<p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
</div><!-- /.col-lg-4 -->
</div><!-- /.row -->
<!-- START THE FEATURETTES -->
<hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7">
<h2 class="featurette-heading">First featurette heading. <span class="text-muted">It'll blow your mind.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
<div class="row featurette">
<div class="col-md-7">
<h2 class="featurette-heading">And lastly, this one. <span class="text-muted">Checkmate.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
</div>
<div class="col-md-5">
<img class="featurette-image img-fluid mx-auto" data-src="holder.js/500x500/auto" alt="Generic placeholder image">
</div>
</div>
<div class="col-md-5">
<img class="featurette-image img-fluid mx-auto" data-src="holder.js/500x500/auto" alt="Generic placeholder image">
</div>
</div>
<hr class="featurette-divider">
<hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7 order-md-2">
<h2 class="featurette-heading">Oh yeah, it's that good. <span class="text-muted">See for yourself.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
</div>
<div class="col-md-5 order-md-1">
<img class="featurette-image img-fluid mx-auto" data-src="holder.js/500x500/auto" alt="Generic placeholder image">
</div>
</div>
<!-- /END THE FEATURETTES -->
<hr class="featurette-divider">
<div class="row featurette">
<div class="col-md-7">
<h2 class="featurette-heading">And lastly, this one. <span class="text-muted">Checkmate.</span></h2>
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
</div>
<div class="col-md-5">
<img class="featurette-image img-fluid mx-auto" data-src="holder.js/500x500/auto" alt="Generic placeholder image">
</div>
</div>
<hr class="featurette-divider">
<!-- /END THE FEATURETTES -->
</div><!-- /.container -->
<!-- FOOTER -->
<footer>
<footer class="container">
<p class="float-right"><a href="#">Back to top</a></p>
<p>&copy; 2017 Company, Inc. &middot; <a href="#">Privacy</a> &middot; <a href="#">Terms</a></p>
</footer>
</div><!-- /.container -->
</main>
<!-- Bootstrap core JavaScript

View File

@ -41,8 +41,7 @@ body {
width: 100%;
height: 100%; /* For at least Firefox */
min-height: 100%;
-webkit-box-shadow: inset 0 0 5rem rgba(0,0,0,.5);
box-shadow: inset 0 0 5rem rgba(0,0,0,.5);
box-shadow: inset 0 0 5rem rgba(0,0,0,.5);
}
.site-wrapper-inner {
display: table-cell;
@ -73,7 +72,7 @@ body {
.nav-masthead .nav-link {
padding: .25rem 0;
font-weight: bold;
font-weight: 700;
color: rgba(255,255,255,.5);
background-color: transparent;
border-bottom: .25rem solid transparent;
@ -112,7 +111,7 @@ body {
}
.cover .btn-lg {
padding: .75rem 1.25rem;
font-weight: bold;
font-weight: 700;
}
@ -139,10 +138,12 @@ body {
position: fixed;
bottom: 0;
}
/* Start the vertical centering */
.site-wrapper-inner {
vertical-align: middle;
}
/* Handle the widths */
.masthead,
.mastfoot,

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
@ -24,7 +24,7 @@
<div class="cover-container">
<div class="masthead clearfix">
<header class="masthead clearfix">
<div class="inner">
<h3 class="masthead-brand">Cover</h3>
<nav class="nav nav-masthead">
@ -33,21 +33,21 @@
<a class="nav-link" href="#">Contact</a>
</nav>
</div>
</div>
</header>
<div class="inner cover">
<main role="main" class="inner cover">
<h1 class="cover-heading">Cover your page.</h1>
<p class="lead">Cover is a one-page template for building simple and beautiful home pages. Download, edit the text, and add your own fullscreen background photo to make it your own.</p>
<p class="lead">
<a href="#" class="btn btn-lg btn-secondary">Learn more</a>
</p>
</div>
</main>
<div class="mastfoot">
<footer class="mastfoot">
<div class="inner">
<p>Cover template for <a href="https://getbootstrap.com">Bootstrap</a>, by <a href="https://twitter.com/mdo">@mdo</a>.</p>
<p>Cover template for <a href="https://getbootstrap.com/">Bootstrap</a>, by <a href="https://twitter.com/mdo">@mdo</a>.</p>
</div>
</div>
</footer>
</div>

View File

@ -12,8 +12,8 @@ body {
*/
h1 {
margin-bottom: 20px;
padding-bottom: 9px;
margin-bottom: 20px;
border-bottom: 1px solid #eee;
}
@ -35,8 +35,8 @@ h1 {
/* Sidebar navigation */
.sidebar {
padding-left: 0;
padding-right: 0;
padding-left: 0;
}
.sidebar .nav {
@ -59,7 +59,7 @@ h1 {
* Dashboard
*/
/* Placeholders */
/* Placeholders */
.placeholders {
padding-bottom: 3rem;
}

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
@ -17,33 +17,35 @@
</head>
<body>
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Dashboard</a>
<button class="navbar-toggler d-lg-none" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<header>
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Dashboard</a>
<button class="navbar-toggler d-lg-none" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Settings</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Help</a>
</li>
</ul>
<form class="form-inline mt-2 mt-md-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
<div class="collapse navbar-collapse" id="navbarsExampleDefault">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Settings</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Help</a>
</li>
</ul>
<form class="form-inline mt-2 mt-md-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
</header>
<div class="container-fluid">
<div class="row">
@ -91,7 +93,7 @@
</ul>
</nav>
<main class="col-sm-9 ml-sm-auto col-md-10 pt-3" role="main">
<main role="main" class="col-sm-9 ml-sm-auto col-md-10 pt-3">
<h1>Dashboard</h1>
<section class="row text-center placeholders">

Some files were not shown because too many files have changed in this diff Show More