root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 13 Packages Projects Releases Wiki Activity

Merge branch 'master' into document_popover_focus 

Conflicts:
	docs/assets/js/docs.min.js
This commit is contained in:
Mark Otto 2014-03-07 01:30:28 -08:00
parent 642fd51002 1f148427de
commit 0143e38a67
125 changed files with 12970 additions and 6441 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitattributes vendored
View File

@ -5,4 +5,5 @@
*.json text eol=lf
*.less text eol=lf
*.md text eol=lf
*.svg text eol=lf
*.yml text eol=lf

3
.travis.yml
View File

@ -20,12 +20,9 @@ env:
- secure: "gqjqISbxBJK6byFbsmr1AyP1qoWH+rap06A2gI7v72+Tn2PU2nYkIMUkCvhZw6K889jv+LhQ/ybcBxDOXHpNCExCnSgB4dcnmYp+9oeNZb37jSP0rQ+Ib4OTLjzc3/FawE/fUq5kukZTC7porzc/k0qJNLAZRx3YLALmK1GIdUY="
- secure: "Gghh/e3Gsbj1+4RR9Lh2aR/xJl35HWiHqlPIeSUqE9D7uDCVTAwNce/dGL3Ew7uJPfJ6Pgr70wD3zgu3stw0Zmzayax0hiDtGwcQCxVIER08wqGANK9C2Q7PYJkNTNtiTo6ehKWbdV4Z+/U+TEYyQfpQTDbAFYk/vVpsdjp0Lmc="
- secure: "RTbRdx4G/2OTLfrZtP1VbRljxEmd6A1F3GqXboeQTldsnAlwpsES65es5CE3ub/rmixLApOY9ot7OPmNixFgC2Y8xOsV7lNCC62QVpmqQEDyGFFQKb3yO6/dmwQxdsCqGfzf9Np6Wh5V22QFvr50ZLKLd7Uhd9oXMDIk/z1MJ3o="
- secure: "Besg41eyU+2mfxrywQ4ydOShMdc34ImaO0S0ENP+aCOBuyNBIgP59wy5tBMmyai2/8eInYeVps4Td96mWInMMxzTe3Bar7eTLG5tWVKRSr/wc4NBPZ/ppoPAmCEsz9Y+VptRH9/FO8n7hsL9EFZ+xBKbG+C0SccGoyBDpA5j7/w="
- secure: "Ptiv7phCImFP3ALIz+sMQzrZg8k7C1gLZbFBhWxjnQr3g06wIfX3Ls5y9OHvxid+lOZZjISui3wzBVgpVHqwHUYf96+r0mo6/mJ+F4ffUmShZANVaIMD/JRTnXhUQJbvntGLvxn1EYWPdNM+2IHJrMipnjHxU9tkgAnlel4Zdew="
matrix:
- TWBS_TEST=core
- TWBS_TEST=validate-html
- TWBS_TEST=sauce-js-unit
# - TWBS_TEST=browserstack-js-unit
matrix:
fast_finish: true

1
CONTRIBUTING.md
View File

@ -169,6 +169,7 @@ license your work under the terms of the [MIT License](LICENSE.md).
- Always a space after a property's colon (e.g., `display: block;` and not `display:block;`).
- End all lines with a semi-colon.
- For multiple, comma-separated selectors, place each selector on its own line.
- Don't add vendor prefixed properties to their unprefixed counterparts (e.g., only `box-sizing` and not also include `-webkit-box-sizing`), as this is done automagically at build time.
- Attribute selectors, like `input[type="text"]` should always wrap the attribute's value in double quotes, for consistency and safety (see this [blog post on unquoted attribute values](http://mathiasbynens.be/notes/unquoted-attribute-values) that can lead to XSS attacks).
- Attribute selectors should only be used where absolutely necessary (e.g., form controls) and should be avoided on custom components for performance and explicitness.
- Series of classes for a component should include a base class (e.g., `.component`) and use the base class as a prefix for modifier and sub-components (e.g., `.component-lg`).

87
Gruntfile.js
View File

@ -62,19 +62,23 @@ module.exports = function (grunt) {
jscs: {
options: {
config: 'js/.jscs.json',
config: 'js/.jscsrc'
},
grunt: {
src: ['Gruntfile.js', 'grunt/*.js']
options: {
'requireCamelCaseOrUpperCaseIdentifiers': null,
'requireParenthesesAroundIIFE': true
},
src: '<%= jshint.grunt.src %>'
},
src: {
src: 'js/*.js'
src: '<%= jshint.src.src %>'
},
test: {
src: 'js/tests/unit/*.js'
src: '<%= jshint.test.src %>'
},
assets: {
src: ['docs/assets/js/application.js', 'docs/assets/js/customizer.js']
src: '<%= jshint.assets.src %>'
}
},
@ -84,10 +88,18 @@ module.exports = function (grunt) {
},
src: [
'dist/css/bootstrap.css',
'dist/css/bootstrap-theme.css',
'docs/assets/css/docs.css',
'dist/css/bootstrap-theme.css'
],
examples: [
'docs/examples/**/*.css'
]
],
docs: {
options: {
'ids': false,
'overqualified-elements': false
},
src: ['docs/assets/css/docs.css']
}
},
concat: {
@ -131,7 +143,7 @@ module.exports = function (grunt) {
},
src: [
'docs/assets/js/vendor/less.min.js',
'docs/assets/js/vendor/jszip.js',
'docs/assets/js/vendor/jszip.min.js',
'docs/assets/js/vendor/uglify.min.js',
'docs/assets/js/vendor/blob.js',
'docs/assets/js/vendor/filesaver.js',
@ -184,18 +196,54 @@ module.exports = function (grunt) {
},
files: {
'dist/css/<%= pkg.name %>.min.css': 'dist/css/<%= pkg.name %>.css',
'dist/css/<%= pkg.name %>-rtl.min.css': 'dist/css/<%= pkg.name %>-rtl.css',
'dist/css/<%= pkg.name %>-theme.min.css': 'dist/css/<%= pkg.name %>-theme.css'
}
}
},
autoprefixer: {
options: {
browsers: ['last 2 versions', 'ie 8', 'ie 9', 'android 2.3', 'android 4', 'opera 12']
},
core: {
options: {
map: true
},
src: 'dist/css/<%= pkg.name %>.css'
},
theme: {
options: {
map: true
},
src: 'dist/css/<%= pkg.name %>-theme.css'
},
docs: {
src: 'docs/assets/css/docs.css'
},
examples: {
expand: true,
cwd: 'docs/examples/',
src: ['**/*.css'],
dest: 'docs/examples/'
}
},
css_flip: {
rtl: {
files: {
'dist/css/<%= pkg.name %>-rtl.css': 'dist/css/<%= pkg.name %>.css'
}
}
},
cssmin: {
compress: {
options: {
keepSpecialComments: '*',
noAdvanced: true, // turn advanced optimizations off until the issue is fixed in clean-css
report: 'min',
selectorsMergeMode: 'ie8'
compatibility: 'ie8'
},
src: [
'docs/assets/css/docs.css',
@ -214,7 +262,9 @@ module.exports = function (grunt) {
files: {
src: [
'dist/css/<%= pkg.name %>.css',
'dist/css/<%= pkg.name %>-rtl.css',
'dist/css/<%= pkg.name %>.min.css',
'dist/css/<%= pkg.name %>-rtl.min.css',
'dist/css/<%= pkg.name %>-theme.css',
'dist/css/<%= pkg.name %>-theme.min.css'
]
@ -229,6 +279,7 @@ module.exports = function (grunt) {
dist: {
files: {
'dist/css/<%= pkg.name %>.css': 'dist/css/<%= pkg.name %>.css',
'dist/css/<%= pkg.name %>-rtl.css': 'dist/css/<%= pkg.name %>-rtl.css',
'dist/css/<%= pkg.name %>-theme.css': 'dist/css/<%= pkg.name %>-theme.css'
}
},
@ -237,6 +288,11 @@ module.exports = function (grunt) {
cwd: 'docs/examples/',
src: ['**/*.css'],
dest: 'docs/examples/'
},
docs: {
files: {
'docs/assets/css/docs.css': 'docs/assets/css/docs.css'
}
}
},
@ -362,7 +418,7 @@ module.exports = function (grunt) {
// These plugins provide necessary tasks.
require('load-grunt-tasks')(grunt, {scope: 'devDependencies'});
grunt.loadNpmTasks('browserstack-runner');
require('time-grunt')(grunt);
// Docs HTML validation task
grunt.registerTask('validate-html', ['jekyll', 'validation']);
@ -384,19 +440,14 @@ module.exports = function (grunt) {
testSubtasks.push('connect');
testSubtasks.push('saucelabs-qunit');
}
// Only run BrowserStack tests if there's a BrowserStack access key
if (typeof process.env.BROWSERSTACK_KEY !== 'undefined' &&
// Skip BrowserStack if running a different subset of the test suite
(!process.env.TWBS_TEST || process.env.TWBS_TEST === 'browserstack-js-unit')) {
testSubtasks.push('browserstack_runner');
}
grunt.registerTask('test', testSubtasks);
// JS distribution task.
grunt.registerTask('dist-js', ['concat', 'uglify']);
// CSS distribution task.
grunt.registerTask('dist-css', ['less', 'cssmin', 'csscomb', 'usebanner']);
grunt.registerTask('less-compile', ['less:compileCore', 'less:compileTheme']);
grunt.registerTask('dist-css', ['less-compile', 'autoprefixer', 'css_flip', 'less:minify', 'cssmin', 'csscomb', 'usebanner']);
// Docs distribution task.
grunt.registerTask('dist-docs', 'copy:docs');

2
README.md
View File

@ -21,7 +21,7 @@ To get started, check out <http://getbootstrap.com>!
Three quick start options are available:
- [Download the latest release](https://github.com/twbs/bootstrap/archive/v3.1.0.zip).
- [Download the latest release](https://github.com/twbs/bootstrap/archive/v3.1.1.zip).
- Clone the repo: `git clone https://github.com/twbs/bootstrap.git`.
- Install with [Bower](http://bower.io): `bower install bootstrap`.

16
_config.yml
View File

@ -11,7 +11,7 @@ destination: ./_gh_pages
host: 0.0.0.0
port: 9001
baseurl: /
url: http://localhost:9001
url: http://getbootstrap.com
encoding: UTF-8
exclude:
@ -19,19 +19,19 @@ exclude:
- "vendor"
# Custom vars
current_version: 3.1.0
current_version: 3.1.1
repo: https://github.com/twbs/bootstrap
sass_repo: https://github.com/twbs/bootstrap-sass
download:
source: https://github.com/twbs/bootstrap/archive/v3.1.0.zip
dist: https://github.com/twbs/bootstrap/releases/download/v3.1.0/bootstrap-3.1.0-dist.zip
sass: https://github.com/twbs/bootstrap-sass/archive/v3.1.0.tar.gz
source: https://github.com/twbs/bootstrap/archive/v3.1.1.zip
dist: https://github.com/twbs/bootstrap/releases/download/v3.1.1/bootstrap-3.1.1-dist.zip
sass: https://github.com/twbs/bootstrap-sass/archive/v3.1.1.tar.gz
blog: http://blog.getbootstrap.com
expo: http://expo.getbootstrap.com
cdn:
css: //netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css
css_theme: //netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap-theme.min.css
js: //netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js
css: //netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css
css_theme: //netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css
js: //netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js

24
bower.json
View File

@ -1,13 +1,23 @@
{
"name": "bootstrap",
"version": "3.1.0",
"version": "3.1.1",
"keywords": [
"css",
"js",
"less",
"mobile-first",
"responsive",
"front-end",
"framework",
"web"
],
"main": [
"./dist/css/bootstrap.css",
"./dist/js/bootstrap.js",
"./dist/fonts/glyphicons-halflings-regular.eot",
"./dist/fonts/glyphicons-halflings-regular.svg",
"./dist/fonts/glyphicons-halflings-regular.ttf",
"./dist/fonts/glyphicons-halflings-regular.woff"
"dist/css/bootstrap.css",
"dist/js/bootstrap.js",
"dist/fonts/glyphicons-halflings-regular.eot",
"dist/fonts/glyphicons-halflings-regular.svg",
"dist/fonts/glyphicons-halflings-regular.ttf",
"dist/fonts/glyphicons-halflings-regular.woff"
],
"ignore": [
"**/.*",

38
browserstack.json
View File

@ -1,38 +0,0 @@
{
"username": "--secure--",
"key": "--secure--",
"test_path": "js/tests/index.html",
"debug": true,
"browsers": [
{
"browser": "firefox",
"browser_version": "latest",
"os": "OS X",
"os_version": "Mavericks"
},
{
"browser": "safari",
"browser_version": "latest",
"os": "OS X",
"os_version": "Mavericks"
},
{
"browser": "firefox",
"browser_version": "latest",
"os": "Windows",
"os_version": "8.1"
},
{
"browser": "chrome",
"browser_version": "latest",
"os": "Windows",
"os_version": "8.1"
},
{
"browser": "Mobile Safari",
"os": "ios",
"os_version": "7.0",
"device": "iPhone 5S"
}
]
}

13
composer.json
View File

@ -1,7 +1,16 @@
{
"name": "twbs/bootstrap",
"description": "Sleek, intuitive, and powerful mobile first front-end framework for faster and easier web development.",
"keywords": ["bootstrap", "css"],
"description": "The most popular front-end framework for developing responsive, mobile first projects on the web.",
"keywords": [
"css",
"js",
"less",
"mobile-first",
"responsive",
"front-end",
"framework",
"web"
],
"homepage": "http://getbootstrap.com",
"authors": [
{

7309
dist/css/bootstrap-rtl.css vendored Normal file
View File

File diff suppressed because it is too large Load Diff

7
dist/css/bootstrap-rtl.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

62
dist/css/bootstrap-theme.css vendored
View File

@ -1,5 +1,5 @@
/*!
* Bootstrap v3.1.0 (http://getbootstrap.com)
* Bootstrap v3.1.1 (http://getbootstrap.com)
* Copyright 2011-2014 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
@ -36,6 +36,8 @@
.btn-default {
text-shadow: 0 1px 0 #fff;
background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%);
background-image: -o-linear-gradient(top, #fff 0%, #e0e0e0 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e0e0e0));
background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -55,6 +57,8 @@
}
.btn-primary {
background-image: -webkit-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
background-image: -o-linear-gradient(top, #428bca 0%, #2d6ca2 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#2d6ca2));
background-image: linear-gradient(to bottom, #428bca 0%, #2d6ca2 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -73,6 +77,8 @@
}
.btn-success {
background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%);
background-image: -o-linear-gradient(top, #5cb85c 0%, #419641 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#419641));
background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -91,6 +97,8 @@
}
.btn-info {
background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
background-image: -o-linear-gradient(top, #5bc0de 0%, #2aabd2 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#2aabd2));
background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -109,6 +117,8 @@
}
.btn-warning {
background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
background-image: -o-linear-gradient(top, #f0ad4e 0%, #eb9316 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#eb9316));
background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -127,6 +137,8 @@
}
.btn-danger {
background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
background-image: -o-linear-gradient(top, #d9534f 0%, #c12e2a 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -152,6 +164,8 @@
.dropdown-menu > li > a:focus {
background-color: #e8e8e8;
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
background-repeat: repeat-x;
@ -161,12 +175,16 @@
.dropdown-menu > .active > a:focus {
background-color: #357ebd;
background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
background-image: -o-linear-gradient(top, #428bca 0%, #357ebd 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#357ebd));
background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
background-repeat: repeat-x;
}
.navbar-default {
background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%);
background-image: -o-linear-gradient(top, #fff 0%, #f8f8f8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f8f8f8));
background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -177,6 +195,8 @@
}
.navbar-default .navbar-nav > .active > a {
background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
background-image: -o-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f3f3f3));
background-image: linear-gradient(to bottom, #ebebeb 0%, #f3f3f3 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff3f3f3', GradientType=0);
background-repeat: repeat-x;
@ -189,6 +209,8 @@
}
.navbar-inverse {
background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%);
background-image: -o-linear-gradient(top, #3c3c3c 0%, #222 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#3c3c3c), to(#222));
background-image: linear-gradient(to bottom, #3c3c3c 0%, #222 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
@ -196,6 +218,8 @@
}
.navbar-inverse .navbar-nav > .active > a {
background-image: -webkit-linear-gradient(top, #222 0%, #282828 100%);
background-image: -o-linear-gradient(top, #222 0%, #282828 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#222), to(#282828));
background-image: linear-gradient(to bottom, #222 0%, #282828 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff282828', GradientType=0);
background-repeat: repeat-x;
@ -218,6 +242,8 @@
}
.alert-success {
background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
background-image: -o-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#c8e5bc));
background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);
background-repeat: repeat-x;
@ -225,6 +251,8 @@
}
.alert-info {
background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
background-image: -o-linear-gradient(top, #d9edf7 0%, #b9def0 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#b9def0));
background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
background-repeat: repeat-x;
@ -232,6 +260,8 @@
}
.alert-warning {
background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
background-image: -o-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#f8efc0));
background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
background-repeat: repeat-x;
@ -239,6 +269,8 @@
}
.alert-danger {
background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
background-image: -o-linear-gradient(top, #f2dede 0%, #e7c3c3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#e7c3c3));
background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);
background-repeat: repeat-x;
@ -246,36 +278,48 @@
}
.progress {
background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
background-image: -o-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#f5f5f5));
background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar {
background-image: -webkit-linear-gradient(top, #428bca 0%, #3071a9 100%);
background-image: -o-linear-gradient(top, #428bca 0%, #3071a9 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#3071a9));
background-image: linear-gradient(to bottom, #428bca 0%, #3071a9 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3071a9', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-success {
background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%);
background-image: -o-linear-gradient(top, #5cb85c 0%, #449d44 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5cb85c), to(#449d44));
background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-info {
background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
background-image: -o-linear-gradient(top, #5bc0de 0%, #31b0d5 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#5bc0de), to(#31b0d5));
background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-warning {
background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
background-image: -o-linear-gradient(top, #f0ad4e 0%, #ec971f 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f0ad4e), to(#ec971f));
background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0);
background-repeat: repeat-x;
}
.progress-bar-danger {
background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%);
background-image: -o-linear-gradient(top, #d9534f 0%, #c9302c 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c9302c));
background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0);
background-repeat: repeat-x;
@ -290,6 +334,8 @@
.list-group-item.active:focus {
text-shadow: 0 -1px 0 #3071a9;
background-image: -webkit-linear-gradient(top, #428bca 0%, #3278b3 100%);
background-image: -o-linear-gradient(top, #428bca 0%, #3278b3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#3278b3));
background-image: linear-gradient(to bottom, #428bca 0%, #3278b3 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3278b3', GradientType=0);
background-repeat: repeat-x;
@ -301,42 +347,56 @@
}
.panel-default > .panel-heading {
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
background-repeat: repeat-x;
}
.panel-primary > .panel-heading {
background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%);
background-image: -o-linear-gradient(top, #428bca 0%, #357ebd 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#428bca), to(#357ebd));
background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
background-repeat: repeat-x;
}
.panel-success > .panel-heading {
background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
background-image: -o-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#dff0d8), to(#d0e9c6));
background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0);
background-repeat: repeat-x;
}
.panel-info > .panel-heading {
background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
background-image: -o-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#d9edf7), to(#c4e3f3));
background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0);
background-repeat: repeat-x;
}
.panel-warning > .panel-heading {
background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
background-image: -o-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcf8e3), to(#faf2cc));
background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0);
background-repeat: repeat-x;
}
.panel-danger > .panel-heading {
background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
background-image: -o-linear-gradient(top, #f2dede 0%, #ebcccc 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#f2dede), to(#ebcccc));
background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0);
background-repeat: repeat-x;
}
.well {
background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
background-image: -o-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%);
background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f5f5f5));
background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);
background-repeat: repeat-x;

2
dist/css/bootstrap-theme.css.map vendored
View File

File diff suppressed because one or more lines are too long

4
dist/css/bootstrap-theme.min.css vendored
View File

File diff suppressed because one or more lines are too long

4460
dist/css/bootstrap.css vendored
View File

File diff suppressed because it is too large Load Diff

2
dist/css/bootstrap.css.map vendored
View File

File diff suppressed because one or more lines are too long

4
dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

52
dist/js/bootstrap.js vendored
View File

@ -1,5 +1,5 @@
/*!
* Bootstrap v3.1.0 (http://getbootstrap.com)
* Bootstrap v3.1.1 (http://getbootstrap.com)
* Copyright 2011-2014 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
@ -7,7 +7,7 @@
if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript requires jQuery') }
/* ========================================================================
* Bootstrap: transition.js v3.1.0
* Bootstrap: transition.js v3.1.1
* http://getbootstrap.com/javascript/#transitions
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -56,7 +56,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: alert.js v3.1.0
* Bootstrap: alert.js v3.1.1
* http://getbootstrap.com/javascript/#alerts
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -145,7 +145,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: button.js v3.1.0
* Bootstrap: button.js v3.1.1
* http://getbootstrap.com/javascript/#buttons
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -253,7 +253,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: carousel.js v3.1.0
* Bootstrap: carousel.js v3.1.1
* http://getbootstrap.com/javascript/#carousel
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -459,7 +459,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: collapse.js v3.1.0
* Bootstrap: collapse.js v3.1.1
* http://getbootstrap.com/javascript/#collapse
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -608,7 +608,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
// COLLAPSE DATA-API
// =================
$(document).on('click.bs.collapse.data-api', '[data-toggle=collapse]', function (e) {
$(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (e) {
var $this = $(this), href
var target = $this.attr('data-target')
|| e.preventDefault()
@ -620,7 +620,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
var $parent = parent && $(parent)
if (!data || !data.transitioning) {
if ($parent) $parent.find('[data-toggle=collapse][data-parent="' + parent + '"]').not($this).addClass('collapsed')
if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed')
$this[$target.hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
}
@ -630,7 +630,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: dropdown.js v3.1.0
* Bootstrap: dropdown.js v3.1.1
* http://getbootstrap.com/javascript/#dropdowns
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -645,7 +645,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
// =========================
var backdrop = '.dropdown-backdrop'
var toggle = '[data-toggle=dropdown]'
var toggle = '[data-toggle="dropdown"]'
var Dropdown = function (element) {
$(element).on('click.bs.dropdown', this.toggle)
}
@ -675,7 +675,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
.toggleClass('open')
.trigger('shown.bs.dropdown', relatedTarget)
$this.focus()
$this.trigger('focus')
}
return false
@ -695,12 +695,12 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
var isActive = $parent.hasClass('open')
if (!isActive || (isActive && e.keyCode == 27)) {
if (e.which == 27) $parent.find(toggle).focus()
return $this.click()
if (e.which == 27) $parent.find(toggle).trigger('focus')
return $this.trigger('click')
}
var desc = ' li:not(.divider):visible a'
var $items = $parent.find('[role=menu]' + desc + ', [role=listbox]' + desc)
var $items = $parent.find('[role="menu"]' + desc + ', [role="listbox"]' + desc)
if (!$items.length) return
@ -710,7 +710,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
if (e.keyCode == 40 && index < $items.length - 1) index++ // down
if (!~index) index = 0
$items.eq(index).focus()
$items.eq(index).trigger('focus')
}
function clearMenus(e) {
@ -773,12 +773,12 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
.on('click.bs.dropdown.data-api', clearMenus)
.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
.on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
.on('keydown.bs.dropdown.data-api', toggle + ', [role=menu], [role=listbox]', Dropdown.prototype.keydown)
.on('keydown.bs.dropdown.data-api', toggle + ', [role="menu"], [role="listbox"]', Dropdown.prototype.keydown)
}(jQuery);
/* ========================================================================
* Bootstrap: modal.js v3.1.0
* Bootstrap: modal.js v3.1.1
* http://getbootstrap.com/javascript/#modals
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -857,10 +857,10 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
transition ?
that.$element.find('.modal-dialog') // wait for modal to slide in
.one($.support.transition.end, function () {
that.$element.focus().trigger(e)
that.$element.trigger('focus').trigger(e)
})
.emulateTransitionEnd(300) :
that.$element.focus().trigger(e)
that.$element.trigger('focus').trigger(e)
})
}
@ -896,7 +896,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
.off('focusin.bs.modal') // guard against infinite focus loop
.on('focusin.bs.modal', $.proxy(function (e) {
if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {
this.$element.focus()
this.$element.trigger('focus')
}
}, this))
}
@ -1011,7 +1011,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
$target
.modal(option, this)
.one('hide', function () {
$this.is(':visible') && $this.focus()
$this.is(':visible') && $this.trigger('focus')
})
})
@ -1022,7 +1022,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: tooltip.js v3.1.0
* Bootstrap: tooltip.js v3.1.1
* http://getbootstrap.com/javascript/#tooltip
* Inspired by the original jQuery.tipsy by Jason Frame
* ========================================================================
@ -1422,7 +1422,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: popover.js v3.1.0
* Bootstrap: popover.js v3.1.1
* http://getbootstrap.com/javascript/#popovers
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -1533,7 +1533,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: scrollspy.js v3.1.0
* Bootstrap: scrollspy.js v3.1.1
* http://getbootstrap.com/javascript/#scrollspy
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -1687,7 +1687,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: tab.js v3.1.0
* Bootstrap: tab.js v3.1.1
* http://getbootstrap.com/javascript/#tabs
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -1813,7 +1813,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
}(jQuery);
/* ========================================================================
* Bootstrap: affix.js v3.1.0
* Bootstrap: affix.js v3.1.1
* http://getbootstrap.com/javascript/#affix
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

4
dist/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
docs/_data/glyphicons.yml
View File

@ -1,4 +1,4 @@
# This file is generated via Grunt task. **Do not edit directly.**
# This file is generated via Grunt task. **Do not edit directly.**
# See the 'build-glyphicons-data' task in Gruntfile.js.
- glyphicon-asterisk

28
docs/_data/showcase.yml
View File

@ -1,19 +1,19 @@
- name: Coinbase
url: https://coinbase.com/
expo_url: http://expo.getbootstrap.com/2013/08/06/coinbase/
img: http://expo.getbootstrap.com/screenshots/coinbase.jpg
- name: Little
url: http://littleco.com
expo_url: http://expo.getbootstrap.com/2014/02/12/little/
img: http://expo.getbootstrap.com/screenshots/little.jpg
- name: Localcrime
url: http://www.localcrimeapp.com/
expo_url: http://expo.getbootstrap.com/2013/08/08/localcrime/
img: http://expo.getbootstrap.com/screenshots/localcrime.jpg
- name: Engine Yard
url: http://engineyard.com
expo_url: http://expo.getbootstrap.com/2014/02/10/engine-yard/
img: http://expo.getbootstrap.com/screenshots/engine-yard.jpg
- name: Webflow
url: http://webflow.com
expo_url: http://expo.getbootstrap.com/2014/02/04/webflow/
img: http://expo.getbootstrap.com/screenshots/webflow.jpg
- name: Sentry
url: https://www.getsentry.com/
url: https://getsentry.com
expo_url: http://expo.getbootstrap.com/2013/05/09/sentry/
img: http://expo.getbootstrap.com/screenshots/sentry.jpg
- name: Fortrabbit
url: http://fortrabbit.com/
expo_url: http://expo.getbootstrap.com/2013/08/05/fortrabbit/
img: http://expo.getbootstrap.com/screenshots/fortrabbit.jpg

36
docs/_includes/customizer-variables.html
View File

@ -1126,7 +1126,7 @@
<div class="row">
<div class="bs-customizer-input">
<label for="input-@modal-inner-padding">@modal-inner-padding</label>
<input id="input-@modal-inner-padding" type="text" value="20px" data-var="@modal-inner-padding" class="form-control"/>
<input id="input-@modal-inner-padding" type="text" value="15px" data-var="@modal-inner-padding" class="form-control"/>
<p class="help-block">Padding applied to the modal body</p>
</div>
<div class="bs-customizer-input">
@ -1311,17 +1311,17 @@
<div class="bs-customizer-input">
<label for="input-@list-group-hover-bg">@list-group-hover-bg</label>
<input id="input-@list-group-hover-bg" type="text" value="#f5f5f5" data-var="@list-group-hover-bg" class="form-control"/>
<p class="help-block">Background color of single list elements on hover</p>
<p class="help-block">Background color of single list items on hover</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-active-color">@list-group-active-color</label>
<input id="input-@list-group-active-color" type="text" value="@component-active-color" data-var="@list-group-active-color" class="form-control"/>
<p class="help-block">Text color of active list elements</p>
<p class="help-block">Text color of active list items</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-active-bg">@list-group-active-bg</label>
<input id="input-@list-group-active-bg" type="text" value="@component-active-bg" data-var="@list-group-active-bg" class="form-control"/>
<p class="help-block">Background color of active list elements</p>
<p class="help-block">Background color of active list items</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-active-border">@list-group-active-border</label>
@ -1331,11 +1331,31 @@
<div class="bs-customizer-input">
<label for="input-@list-group-active-text-color">@list-group-active-text-color</label>
<input id="input-@list-group-active-text-color" type="text" value="lighten(@list-group-active-bg, 40%)" data-var="@list-group-active-text-color" class="form-control"/>
<p class="help-block">Text color for content within active list items</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-disabled-color">@list-group-disabled-color</label>
<input id="input-@list-group-disabled-color" type="text" value="@gray-light" data-var="@list-group-disabled-color" class="form-control"/>
<p class="help-block">Text color of disabled list items</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-disabled-bg">@list-group-disabled-bg</label>
<input id="input-@list-group-disabled-bg" type="text" value="@gray-lighter" data-var="@list-group-disabled-bg" class="form-control"/>
<p class="help-block">Background color of disabled list items</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-disabled-text-color">@list-group-disabled-text-color</label>
<input id="input-@list-group-disabled-text-color" type="text" value="@list-group-disabled-color" data-var="@list-group-disabled-text-color" class="form-control"/>
<p class="help-block">Text color for content within disabled list items</p>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-link-color">@list-group-link-color</label>
<input id="input-@list-group-link-color" type="text" value="#555" data-var="@list-group-link-color" class="form-control"/>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-link-hover-color">@list-group-link-hover-color</label>
<input id="input-@list-group-link-hover-color" type="text" value="@list-group-link-color" data-var="@list-group-link-hover-color" class="form-control"/>
</div>
<div class="bs-customizer-input">
<label for="input-@list-group-link-heading-color">@list-group-link-heading-color</label>
<input id="input-@list-group-link-heading-color" type="text" value="#333" data-var="@list-group-link-heading-color" class="form-control"/>
@ -1352,6 +1372,14 @@
<label for="input-@panel-body-padding">@panel-body-padding</label>
<input id="input-@panel-body-padding" type="text" value="15px" data-var="@panel-body-padding" class="form-control"/>
</div>
<div class="bs-customizer-input">
<label for="input-@panel-heading-padding">@panel-heading-padding</label>
<input id="input-@panel-heading-padding" type="text" value="10px 15px" data-var="@panel-heading-padding" class="form-control"/>
</div>
<div class="bs-customizer-input">
<label for="input-@panel-footer-padding">@panel-footer-padding</label>
<input id="input-@panel-footer-padding" type="text" value="@panel-heading-padding" data-var="@panel-footer-padding" class="form-control"/>
</div>
<div class="bs-customizer-input">
<label for="input-@panel-border-radius">@panel-border-radius</label>
<input id="input-@panel-border-radius" type="text" value="@border-radius-base" data-var="@panel-border-radius" class="form-control"/>

3
docs/_includes/nav-components.html
View File

@ -103,6 +103,7 @@
<ul class="nav">
<li><a href="#progress-basic">Basic example</a></li>
<li><a href="#progress-label">With label</a></li>
<li><a href="#progress-low-percentages">Low percentages</a></li>
<li><a href="#progress-alternatives">Contextual alternatives</a></li>
<li><a href="#progress-striped">Striped</a></li>
<li><a href="#progress-animated">Animated</a></li>
@ -122,6 +123,7 @@
<li><a href="#list-group-basic">Basic example</a></li>
<li><a href="#list-group-badges">Badges</a></li>
<li><a href="#list-group-linked">Linked items</a></li>
<li><a href="#list-group-disabled">Disabled items</a></li>
<li><a href="#list-group-contextual-classes">Contextual classes</a></li>
<li><a href="#list-group-custom-content">Custom content</a></li>
</ul>
@ -136,4 +138,5 @@
<li><a href="#panels-list-group">With list groups</a>
</ul>
</li>
<li><a href="#responsive-embed">Responsive embed</a></li>
<li><a href="#wells">Wells</a></li>

13
docs/_includes/nav-css.html
View File

@ -30,7 +30,8 @@
<ul class="nav">
<li><a href="#type-headings">Headings</a></li>
<li><a href="#type-body-copy">Body copy</a></li>
<li><a href="#type-emphasis">Emphasis</a></li>
<li><a href="#type-inline-text">Inline text elements</a></li>
<li><a href="#type-alignment">Alignment classes</a></li>
<li><a href="#type-abbreviations">Abbreviations</a></li>
<li><a href="#type-addresses">Addresses</a></li>
<li><a href="#type-blockquotes">Blockquotes</a></li>
@ -43,6 +44,8 @@
<li><a href="#code-inline">Inline code</a></li>
<li><a href="#code-user-input">User input</a></li>
<li><a href="#code-block">Blocks of code</a></li>
<li><a href="#code-variables">Variables</a></li>
<li><a href="#code-sample-output">Sample output</a></li>
</ul>
</li>
<li>
@ -67,6 +70,7 @@
<li><a href="#forms-controls-static">Static control</a></li>
<li><a href="#forms-control-focus">Focus state</a></li>
<li><a href="#forms-control-disabled">Disabled state</a></li>
<li><a href="#forms-control-readonly">Readonly state</a></li>
<li><a href="#forms-control-validation">Validation states</a></li>
<li><a href="#forms-control-sizes">Control sizing</a></li>
<li><a href="#forms-help-text">Help text</a></li>
@ -128,3 +132,10 @@
<li><a href="#sass-installation">Rails install</a></li>
</ul>
</li>
<li>
<a href="#rtl">RTL version</a>
<ul class="nav">
<li><a href="#rtl-how-to">How to use</a></li>
<li><a href="#rtl-css-flip">CSS Flip</a></li>
</ul>
</li>

1
docs/_includes/nav-javascript.html
View File

@ -14,6 +14,7 @@
<ul class="nav">
<li><a href="#modals-examples">Examples</a></li>
<li><a href="#modals-sizes">Sizes</a></li>
<li><a href="#modals-remove-animation">Remove animation</a></li>
<li><a href="#modals-usage">Usage</a></li>
</ul>
</li>

14
docs/about.html
View File

@ -80,6 +80,20 @@ lead: "Learn about the project's history, meet the maintaining teams, and find o
</div>
</div>
<h2>Download mark</h2>
<p>Download the Bootstrap mark in one of three styles, each available as an SVG file. Right click, Save as.</p>
<div class="bs-brand-logos">
<div class="bs-brand-item">
<img class="svg" src="../assets/brand/bootstrap-solid.svg" alt="Bootstrap">
</div>
<div class="bs-brand-item inverse">
<img class="svg" src="../assets/brand/bootstrap-outline.svg" alt="Bootstrap">
</div>
<div class="bs-brand-item inverse">
<img class="svg" src="../assets/brand/bootstrap-punchout.svg" alt="Bootstrap">
</div>
</div>
<h2>Name</h2>
<p>The project and framework should always be referred to as <strong>Bootstrap</strong>. No Twitter before it, no capital <em>s</em>, and no abbreviations except for one, a capital <strong>B</strong>.</p>
<div class="bs-brand-logos">

43
docs/assets/brand/bootstrap-outline.svg Normal file
View File

@ -0,0 +1,43 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 90 612 612" enable-background="new 0 90 612 612" xml:space="preserve">
<g id="solid" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" display="none">
<path id="bg" display="inline" fill="#563D7C" d="M612,600c0,56.1-45.9,102-102,102H102C45.9,702,0,656.1,0,600V192
C0,135.9,45.9,90,102,90h408c56.1,0,102,45.9,102,102V600z"/>
<g id="B" display="inline" enable-background="new ">
<path fill="#FFFFFF" d="M166.3,223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8h-164V223z M228.8,372.5h102
c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102V372.5z M228.8,529h110.5
c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V529z"/>
</g>
</g>
<g id="outline" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<g id="bg_1_">
<path fill="#FFFFFF" d="M510,96c25.5,0,49.6,10,67.8,28.2S606,166.5,606,192v408c0,25.5-10,49.6-28.2,67.8S535.5,696,510,696H102
c-25.5,0-49.6-10-67.8-28.2S6,625.5,6,600V192c0-25.5,10-49.6,28.2-67.8S76.5,96,102,96H510 M510,90H102C45.9,90,0,135.9,0,192
v408c0,56.1,45.9,102,102,102h408c56.1,0,102-45.9,102-102V192C612,135.9,566.1,90,510,90L510,90z"/>
</g>
<g id="B_2_" enable-background="new ">
<path fill="#FFFFFF" d="M166.3,223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8h-164V223z M228.8,372.5h102
c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102V372.5z M228.8,529h110.5
c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V529z"/>
</g>
</g>
<g id="punchout" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" display="none">
<g display="inline">
<path fill="#FFFFFF" d="M373.5,431.8c-10.5-9.5-25.2-14.2-44.2-14.2H218.8V529h110.5c19,0,33.8-4.9,44.2-14.8
c10.5-9.8,15.8-23.8,15.8-41.8C389.2,454.8,384,441.2,373.5,431.8z"/>
<path fill="#FFFFFF" d="M358.2,359.8c10-8.5,15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102v98.5h102
C335.7,372.5,348.2,368.2,358.2,359.8z"/>
<path fill="#FFFFFF" d="M510,90H102C45.9,90,0,135.9,0,192v408c0,56.1,45.9,102,102,102h408c56.1,0,102-45.9,102-102V192
C612,135.9,566.1,90,510,90z M454.2,519.8c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8
h-164V223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2c-8.8,12.8-21.4,22.8-37.8,29.8v1
c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8C461.7,494.5,459.2,507.6,454.2,519.8z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

43
docs/assets/brand/bootstrap-punchout.svg Normal file
View File

@ -0,0 +1,43 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 90 612 612" enable-background="new 0 90 612 612" xml:space="preserve">
<g id="solid" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" display="none">
<path id="bg" display="inline" fill="#563D7C" d="M612,600c0,56.1-45.9,102-102,102H102C45.9,702,0,656.1,0,600V192
C0,135.9,45.9,90,102,90h408c56.1,0,102,45.9,102,102V600z"/>
<g id="B" display="inline" enable-background="new ">
<path fill="#FFFFFF" d="M166.3,223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8h-164V223z M228.8,372.5h102
c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102V372.5z M228.8,529h110.5
c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V529z"/>
</g>
</g>
<g id="outline" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" display="none">
<g id="bg_1_" display="inline">
<path fill="#FFFFFF" d="M510,96c25.5,0,49.6,10,67.8,28.2S606,166.5,606,192v408c0,25.5-10,49.6-28.2,67.8S535.5,696,510,696H102
c-25.5,0-49.6-10-67.8-28.2S6,625.5,6,600V192c0-25.5,10-49.6,28.2-67.8S76.5,96,102,96H510 M510,90H102C45.9,90,0,135.9,0,192
v408c0,56.1,45.9,102,102,102h408c56.1,0,102-45.9,102-102V192C612,135.9,566.1,90,510,90L510,90z"/>
</g>
<g id="B_2_" display="inline" enable-background="new ">
<path fill="#FFFFFF" d="M166.3,223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8h-164V223z M228.8,372.5h102
c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102V372.5z M228.8,529h110.5
c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V529z"/>
</g>
</g>
<g id="punchout" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<g>
<path fill="#FFFFFF" d="M383.5,431.8c-10.5-9.5-25.2-14.2-44.2-14.2H228.8V529h110.5c19,0,33.8-4.9,44.2-14.8
c10.5-9.8,15.8-23.8,15.8-41.8C399.2,454.8,394,441.2,383.5,431.8z"/>
<path fill="#FFFFFF" d="M368.2,359.8c10-8.5,15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102v98.5h102
C345.7,372.5,358.2,368.2,368.2,359.8z"/>
<path fill="#FFFFFF" d="M510,90H102C45.9,90,0,135.9,0,192v408c0,56.1,45.9,102,102,102h408c56.1,0,102-45.9,102-102V192
C612,135.9,566.1,90,510,90z M454.2,519.8c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8
h-164V223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2c-8.8,12.8-21.4,22.8-37.8,29.8v1
c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8C461.7,494.5,459.2,507.6,454.2,519.8z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

43
docs/assets/brand/bootstrap-solid.svg Normal file
View File

@ -0,0 +1,43 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 90 612 612" enable-background="new 0 90 612 612" xml:space="preserve">
<g id="solid" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
<path id="bg" fill="#563D7C" d="M612,600c0,56.1-45.9,102-102,102H102C45.9,702,0,656.1,0,600V192C0,135.9,45.9,90,102,90h408
c56.1,0,102,45.9,102,102V600z"/>
<g id="B" enable-background="new ">
<path fill="#FFFFFF" d="M166.3,223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8h-164V223z M228.8,372.5h102
c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102V372.5z M228.8,529h110.5
c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V529z"/>
</g>
</g>
<g id="outline" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" display="none">
<g id="bg_1_" display="inline">
<path fill="#FFFFFF" d="M510,96c25.5,0,49.6,10,67.8,28.2S606,166.5,606,192v408c0,25.5-10,49.6-28.2,67.8S535.5,696,510,696H102
c-25.5,0-49.6-10-67.8-28.2S6,625.5,6,600V192c0-25.5,10-49.6,28.2-67.8S76.5,96,102,96H510 M510,90H102C45.9,90,0,135.9,0,192
v408c0,56.1,45.9,102,102,102h408c56.1,0,102-45.9,102-102V192C612,135.9,566.1,90,510,90L510,90z"/>
</g>
<g id="B_2_" display="inline" enable-background="new ">
<path fill="#FFFFFF" d="M166.3,223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2
c-8.8,12.8-21.4,22.8-37.8,29.8v1c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8c0,14-2.5,27.1-7.5,39.2
c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8h-164V223z M228.8,372.5h102
c15,0,27.5-4.2,37.5-12.8s15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102V372.5z M228.8,529h110.5
c19,0,33.8-4.9,44.2-14.8c10.5-9.8,15.8-23.8,15.8-41.8c0-17.7-5.2-31.2-15.8-40.8s-25.2-14.2-44.2-14.2H228.8V529z"/>
</g>
</g>
<g id="punchout" inkscape:version="0.48.1 r9760" sodipodi:docname="twitter_bootstrap_logo.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" display="none">
<g display="inline">
<path fill="#FFFFFF" d="M373.5,431.8c-10.5-9.5-25.2-14.2-44.2-14.2H218.8V529h110.5c19,0,33.8-4.9,44.2-14.8
c10.5-9.8,15.8-23.8,15.8-41.8C389.2,454.8,384,441.2,373.5,431.8z"/>
<path fill="#FFFFFF" d="M358.2,359.8c10-8.5,15-20.8,15-36.8c0-18-4.5-30.7-13.5-38c-9-7.3-22-11-39-11h-102v98.5h102
C335.7,372.5,348.2,368.2,358.2,359.8z"/>
<path fill="#FFFFFF" d="M510,90H102C45.9,90,0,135.9,0,192v408c0,56.1,45.9,102,102,102h408c56.1,0,102-45.9,102-102V192
C612,135.9,566.1,90,510,90z M454.2,519.8c-5,12.2-12.8,22.7-23.5,31.5c-10.7,8.8-24.3,15.8-41,21c-16.7,5.2-36.5,7.8-59.5,7.8
h-164V223h173.5c32,0,57.7,7.3,77,22c19.3,14.7,29,36.8,29,66.5c0,18-4.4,33.4-13.2,46.2c-8.8,12.8-21.4,22.8-37.8,29.8v1
c22,4.7,38.7,15.1,50,31.2c11.3,16.2,17,36.4,17,60.8C461.7,494.5,459.2,507.6,454.2,519.8z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

204
docs/assets/css/docs.css
View File

@ -1,5 +1,3 @@
/*csslint ids: false, overqualified-elements: false, fallback-colors: false*/
/*!
* Bootstrap Docs (http://getbootstrap.com)
* Copyright 2011-2014 Twitter, Inc.
@ -42,7 +40,7 @@
*/
body {
position: relative; /* For scrollyspy */
position: relative; /* For scrollspy */
}
/* Keep code small in tables on account of limited space */
@ -85,10 +83,10 @@ body {
display: block;
font-weight: 500;
color: #fff;
text-align: center;
cursor: default;
background-color: #563d7c;
border-radius: 15%;
cursor: default;
text-align: center;
}
.bs-docs-booticon-sm {
width: 30px;
@ -128,8 +126,8 @@ body {
}
.bs-docs-nav .navbar-brand,
.bs-docs-nav .navbar-nav > li > a {
color: #563d7c;
font-weight: 500;
color: #563d7c;
}
.bs-docs-nav .navbar-nav > li > a:hover,
.bs-docs-nav .navbar-nav > .active > a,
@ -165,8 +163,8 @@ body {
border-top: 1px solid #e5e5e5;
}
.bs-docs-footer-links {
margin-top: 20px;
padding-left: 0;
margin-top: 20px;
color: #999;
}
.bs-docs-footer-links li {
@ -196,14 +194,14 @@ body {
}
.bs-docs-social-buttons {
display: inline-block;
margin-bottom: 0;
padding-left: 0;
margin-bottom: 0;
list-style: none;
}
.bs-docs-social-buttons li {
display: inline-block;
line-height: 1;
padding: 5px 8px;
line-height: 1;
}
.bs-docs-social-buttons .twitter-follow-button {
width: 225px !important;
@ -213,8 +211,8 @@ body {
}
/* Style the GitHub buttons via CSS instead of inline attributes */
.github-btn {
border: 0;
overflow: hidden;
border: 0;
}
@ -233,10 +231,12 @@ body {
text-align: center;
text-shadow: 0 1px 0 rgba(0,0,0,.1);
background-color: #6f5499;
background-image: -webkit-gradient(linear, left top, left bottom, from(#563d7c), to(#6f5499));
background-image: -webkit-linear-gradient(top, #563d7c 0%, #6f5499 100%);
background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
background-repeat: repeat-x;
background-image: -o-linear-gradient(top, #563d7c 0%, #6f5499 100%);
background-image: linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0);
background-repeat: repeat-x;
}
/* Masthead (headings and download button) */
@ -345,10 +345,10 @@ body {
.carbonad {
width: auto !important;
margin: 30px -30px -31px !important;
padding: 20px !important;
overflow: hidden; /* clearfix */
height: auto !important;
padding: 20px !important;
margin: 30px -30px -31px !important;
overflow: hidden; /* clearfix */
font-size: 13px !important;
line-height: 16px !important;
text-align: left;
@ -361,8 +361,8 @@ body {
}
.carbonad-text,
.carbonad-tag {
float: none !important;
display: block !important;
float: none !important;
width: auto !important;
height: auto !important;
margin-left: 145px !important;
@ -387,8 +387,8 @@ body {
.carbonad {
width: 330px !important;
margin: 20px auto !important;
border-radius: 4px;
border-width: 1px !important;
border-radius: 4px;
}
.bs-docs-masthead .carbonad {
margin: 50px auto 0 !important;
@ -397,8 +397,8 @@ body {
@media (min-width: 768px) {
.carbonad {
margin-left: 0 !important;
margin-right: 0 !important;
margin-left: 0 !important;
}
}
@ -407,9 +407,9 @@ body {
position: absolute;
top: 0;
right: 15px; /* 15px instead of 0 since box-sizing */
margin: 0 !important;
padding: 15px !important;
width: 330px !important;
padding: 15px !important;
margin: 0 !important;
}
.bs-docs-masthead .carbonad {
position: static;
@ -424,7 +424,7 @@ body {
*/
.bs-docs-featurette {
padding-top: 40px;
padding-top: 40px;
padding-bottom: 40px;
font-size: 16px;
line-height: 1.5;
@ -439,19 +439,19 @@ body {
}
.bs-docs-featurette-title {
margin-bottom: 5px;
font-size: 30px;
font-weight: normal;
color: #333;
margin-bottom: 5px;
}
.half-rule {
width: 100px;
margin: 40px auto;
}
.bs-docs-featurette h3 {
margin-bottom: 5px;
font-weight: normal;
color: #333;
margin-bottom: 5px;
}
.bs-docs-featurette-img {
display: block;
@ -459,8 +459,8 @@ body {
color: #333;
}
.bs-docs-featurette-img:hover {
text-decoration: none;
color: #428bca;
text-decoration: none;
}
.bs-docs-featurette-img img {
display: block;
@ -469,12 +469,12 @@ body {
/* Featured sites */
.bs-docs-featured-sites {
margin-left: -1px;
margin-right: -1px;
margin-left: -1px;
}
.bs-docs-featured-sites .col-sm-3 {
padding-left: 1px;
padding-right: 1px;
padding-left: 1px;
}
@media (min-width: 480px) {
@ -484,16 +484,16 @@ body {
}
@media (min-width: 768px) {
.bs-docs-featurette {
padding-top: 100px;
padding-top: 100px;
padding-bottom: 100px;
}
.bs-docs-featurette-title {
font-size: 40px;
}
.bs-docs-featurette .lead {
margin-left: auto;
margin-right: auto;
max-width: 80%;
margin-right: auto;
margin-left: auto;
}
.bs-docs-featured-sites .col-sm-3:first-child img {
border-top-left-radius: 4px;
@ -536,10 +536,10 @@ body {
/* All levels of nav */
.bs-docs-sidebar .nav > li > a {
display: block;
padding: 4px 20px;
font-size: 13px;
font-weight: 500;
color: #999;
padding: 4px 20px;
}
.bs-docs-sidebar .nav > li > a:hover,
.bs-docs-sidebar .nav > li > a:focus {
@ -565,7 +565,7 @@ body {
padding-bottom: 10px;
}
.bs-docs-sidebar .nav .nav > li > a {
padding-top: 1px;
padding-top: 1px;
padding-bottom: 1px;
padding-left: 30px;
font-size: 12px;
@ -578,23 +578,23 @@ body {
.bs-docs-sidebar .nav .nav > .active > a,
.bs-docs-sidebar .nav .nav > .active:hover > a,
.bs-docs-sidebar .nav .nav > .active:focus > a {
font-weight: 500;
padding-left: 28px;
font-weight: 500;
}
/* Back to top (hidden on mobile) */
.back-to-top {
display: none;
padding: 4px 10px;
margin-top: 10px;
margin-left: 10px;
padding: 4px 10px;
font-size: 12px;
font-weight: 500;
color: #999;
}
.back-to-top:hover {
text-decoration: none;
color: #563d7c;
text-decoration: none;
}
@media (min-width: 768px) {
@ -650,8 +650,8 @@ body {
}
h1[id] {
margin-top: 0;
padding-top: 20px;
margin-top: 0;
}
@ -664,8 +664,8 @@ h1[id] {
/* Common styles for all types */
.bs-callout {
margin: 20px 0;
padding: 20px;
margin: 20px 0;
border-left: 3px solid #eee;
}
.bs-callout h4 {
@ -716,7 +716,7 @@ h1[id] {
}
.color-swatch {
float: left;
width: 60px;
width: 60px;
height: 60px;
margin: 0 5px;
border-radius: 3px;
@ -724,28 +724,56 @@ h1[id] {
@media (min-width: 768px) {
.color-swatch {
width: 100px;
width: 100px;
height: 100px;
}
}
/* Framework colors */
.color-swatches .gray-darker { background-color: #222; }
.color-swatches .gray-dark { background-color: #333; }
.color-swatches .gray { background-color: #555; }
.color-swatches .gray-light { background-color: #999; }
.color-swatches .gray-lighter { background-color: #eee; }
.color-swatches .brand-primary { background-color: #428bca; }
.color-swatches .brand-success { background-color: #5cb85c; }
.color-swatches .brand-warning { background-color: #f0ad4e; }
.color-swatches .brand-danger { background-color: #d9534f; }
.color-swatches .brand-info { background-color: #5bc0de; }
.color-swatches .gray-darker {
background-color: #222;
}
.color-swatches .gray-dark {
background-color: #333;
}
.color-swatches .gray {
background-color: #555;
}
.color-swatches .gray-light {
background-color: #999;
}
.color-swatches .gray-lighter {
background-color: #eee;
}
.color-swatches .brand-primary {
background-color: #428bca;
}
.color-swatches .brand-success {
background-color: #5cb85c;
}
.color-swatches .brand-warning {
background-color: #f0ad4e;
}
.color-swatches .brand-danger {
background-color: #d9534f;
}
.color-swatches .brand-info {
background-color: #5bc0de;
}
/* Docs colors */
.color-swatches .bs-purple { background-color: #563d7c; }
.color-swatches .bs-purple-light { background-color: #c7bfd3; }
.color-swatches .bs-purple-lighter { background-color: #e5e1ea; }
.color-swatches .bs-gray { background-color: #f9f9f9; }
.color-swatches .bs-purple {
background-color: #563d7c;
}
.color-swatches .bs-purple-light {
background-color: #c7bfd3;
}
.color-swatches .bs-purple-lighter {
background-color: #e5e1ea;
}
.color-swatches .bs-gray {
background-color: #f9f9f9;
}
/*
@ -755,8 +783,8 @@ h1[id] {
*/
.bs-team .team-member {
color: #555;
line-height: 32px;
color: #555;
}
.bs-team .team-member:hover {
color: #333;
@ -764,9 +792,9 @@ h1[id] {
}
.bs-team .github-btn {
float: right;
margin-top: 6px;
width: 180px;
height: 20px;
margin-top: 6px;
}
.bs-team img {
float: left;
@ -808,49 +836,51 @@ h1[id] {
padding: 45px 15px 15px;
margin: 0 -15px 15px;
background-color: #fafafa;
box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
border-color: #e5e5e5 #eee #eee;
border-style: solid;
border-width: 1px 0;
-webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
}
/* Echo out a label for the example */
.bs-example:after {
content: "Example";
position: absolute;
top: 15px;
top: 15px;
left: 15px;
font-size: 12px;
font-weight: bold;
color: #bbb;
text-transform: uppercase;
letter-spacing: 1px;
content: "Example";
}
/* Tweak display of the code snippets when following an example */
.bs-example + .highlight {
margin: -15px -15px 15px;
border-radius: 0;
border-width: 0 0 1px;
border-radius: 0;
}
/* Make the examples and snippets not full-width */
@media (min-width: 768px) {
.bs-example {
margin-left: 0;
margin-right: 0;
margin-left: 0;
background-color: #fff;
border-width: 1px;
border-color: #ddd;
border-width: 1px;
border-radius: 4px 4px 0 0;
box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
.bs-example + .highlight {
margin-top: -16px;
margin-left: 0;
margin-right: 0;
margin-left: 0;
border-width: 1px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
}
}
@ -962,8 +992,8 @@ h1[id] {
.bs-navbar-top-example .navbar-fixed-top,
.bs-navbar-bottom-example .navbar-fixed-bottom {
position: relative;
margin-left: 0;
margin-right: 0;
margin-left: 0;
}
.bs-navbar-top-example {
padding-bottom: 45px;
@ -1016,15 +1046,15 @@ h1[id] {
position: relative;
top: auto;
right: auto;
left: auto;
bottom: auto;
left: auto;
z-index: 1;
display: block;
}
.bs-example-modal .modal-dialog {
left: auto;
margin-left: auto;
margin-right: auto;
margin-left: auto;
}
/* Example dropdowns */
@ -1087,9 +1117,9 @@ h1[id] {
padding: 0;
margin-top: 0;
margin-bottom: 0;
white-space: nowrap;
background-color: transparent;
border: 0;
white-space: nowrap;
}
.highlight pre code {
font-size: inherit;
@ -1100,8 +1130,8 @@ h1[id] {
width: 22px;
padding-right: 5px;
margin-right: 10px;
text-align: right;
color: #bebec5;
text-align: right;
}
@ -1186,7 +1216,7 @@ h1[id] {
*/
.bs-glyphicons {
margin: 0 -19px 20px -16px;
margin: 0 -10px 20px;
overflow: hidden;
}
.bs-glyphicons-list {
@ -1201,8 +1231,8 @@ h1[id] {
font-size: 10px;
line-height: 1.4;
text-align: center;
border: 1px solid #fff;
background-color: #f9f9f9;
border: 1px solid #fff;
}
.bs-glyphicons .glyphicon {
margin-top: 5px;
@ -1221,8 +1251,8 @@ h1[id] {
@media (min-width: 768px) {
.bs-glyphicons {
margin-left: 0;
margin-right: 0;
margin-left: 0;
}
.bs-glyphicons li {
width: 12.5%;
@ -1251,9 +1281,9 @@ h1[id] {
color: #555;
}
.bs-customizer h2 {
padding-top: 30px;
margin-top: 0;
margin-bottom: 5px;
padding-top: 30px;
}
.bs-customizer h3 {
margin-bottom: 0;
@ -1271,8 +1301,8 @@ h1[id] {
background-color: #fafafa;
}
.bs-customizer .help-block {
font-size: 12px;
margin-bottom: 5px;
font-size: 12px;
}
/* For the variables, use regular weight */
@ -1283,8 +1313,8 @@ h1[id] {
.bs-customizer-input {
float: left;
width: 33.333333%;
padding-left: 15px;
padding-right: 15px;
padding-left: 15px;
}
/* Downloads */
@ -1296,14 +1326,15 @@ h1[id] {
.bs-customizer-alert {
position: fixed;
top: 0;
left: 0;
right: 0;
left: 0;
z-index: 1030;
padding: 15px 0;
color: #fff;
background-color: #d9534f;
box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
border-bottom: 1px solid #b94441;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
.bs-customizer-alert .close {
margin-top: -4px;
@ -1320,7 +1351,8 @@ h1[id] {
color: #fff;
background-color: #a83c3a;
border-color: #973634;
box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
}
@ -1353,6 +1385,10 @@ h1[id] {
color: #fff;
background-color: #563d7c;
}
.bs-brand-item .svg {
width: 144px;
height: 144px;
}
/* Heading content within */
.bs-brand-item h1,
@ -1361,8 +1397,8 @@ h1[id] {
margin-bottom: 0;
}
.bs-brand-item .bs-docs-booticon {
margin-left: auto;
margin-right: auto;
margin-left: auto;
}
/* Make the icons stand out on what is/isn't okay */
@ -1374,8 +1410,12 @@ h1[id] {
color: #fff;
border-radius: 50%;
}
.bs-brand-item .glyphicon-ok { background-color: #5cb85c; }
.bs-brand-item .glyphicon-remove { background-color: #d9534f; }
.bs-brand-item .glyphicon-ok {
background-color: #5cb85c;
}
.bs-brand-item .glyphicon-remove {
background-color: #d9534f;
}
@media (min-width: 768px) {
.bs-brand-item {
@ -1415,6 +1455,6 @@ h1[id] {
border-color: rgba(82,168,236,.8);
outline: 0;
outline: thin dotted \9; /* IE6-9 */
-moz-box-shadow: 0 0 8px rgba(82,168,236,.6);
box-shadow: 0 0 8px rgba(82,168,236,.6);
-webkit-box-shadow: 0 0 8px rgba(82,168,236,.6);
box-shadow: 0 0 8px rgba(82,168,236,.6);
}

2
docs/assets/css/docs.min.css vendored
View File

File diff suppressed because one or more lines are too long

6
docs/assets/js/application.js
View File

@ -34,7 +34,7 @@
var navHeight = $('.navbar').outerHeight(true) + 10
$body.scrollspy({
target: '.bs-sidebar',
target: '.bs-docs-sidebar',
// offset: navHeight
})
@ -48,7 +48,7 @@
// back to top
setTimeout(function () {
var $sideBar = $('.bs-sidebar')
var $sideBar = $('.bs-docs-sidebar')
$sideBar.affix({
offset: {
@ -60,7 +60,7 @@
return (this.top = offsetTop - navOuterHeight - sideBarMargin)
},
bottom: function () {
return (this.bottom = $('.bs-footer').outerHeight(true))
return (this.bottom = $('.bs-docs-footer').outerHeight(true))
}
}
})

30
docs/assets/js/customize.min.js vendored
View File

File diff suppressed because one or more lines are too long

58
docs/assets/js/customizer.js
View File

@ -6,31 +6,29 @@
* details, see http://creativecommons.org/licenses/by/3.0/.
*/
/* jshint multistr: true */
window.onload = function () { // wait for load in a dumb way because B-0
var cw = '/*!\n' +
' * Bootstrap v3.1.0 (http://getbootstrap.com)\n' +
' * Bootstrap v3.1.1 (http://getbootstrap.com)\n' +
' * Copyright 2011-2014 Twitter, Inc.\n' +
' * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)\n' +
' */\n\n'
function showError(msg, err) {
$('<div id="bsCustomizerAlert" class="bs-customizer-alert">\
<div class="container">\
<a href="#bsCustomizerAlert" data-dismiss="alert" class="close pull-right">&times;</a>\
<p class="bs-customizer-alert-text"><span class="glyphicon glyphicon-warning-sign"></span>' + msg + '</p>' +
(err.extract ? '<pre class="bs-customizer-alert-extract">' + err.extract.join('\n') + '</pre>' : '') + '\
</div>\
</div>').appendTo('body').alert()
$('<div id="bsCustomizerAlert" class="bs-customizer-alert">' +
'<div class="container">' +
'<a href="#bsCustomizerAlert" data-dismiss="alert" class="close pull-right">&times;</a>' +
'<p class="bs-customizer-alert-text"><span class="glyphicon glyphicon-warning-sign"></span>' + msg + '</p>' +
(err.extract ? '<pre class="bs-customizer-alert-extract">' + err.extract.join('\n') + '</pre>' : '') +
'</div>' +
'</div>').appendTo('body').alert()
throw err
}
function showCallout(msg, showUpTop) {
var callout = $('<div class="bs-callout bs-callout-danger">\
<h4>Attention!</h4>\
<p>' + msg + '</p>\
</div>')
var callout = $('<div class="bs-callout bs-callout-danger">' +
'<h4>Attention!</h4>' +
'<p>' + msg + '</p>' +
'</div>')
if (showUpTop) {
callout.appendTo('.bs-docs-container')
@ -74,9 +72,9 @@ window.onload = function () { // wait for load in a dumb way because B-0
var vars = {}
$('#less-variables-section input')
.each(function () {
$(this).val() && (vars[$(this).prev().text()] = $(this).val())
})
.each(function () {
$(this).val() && (vars[$(this).prev().text()] = $(this).val())
})
var data = {
vars: vars,
@ -211,9 +209,9 @@ window.onload = function () { // wait for load in a dumb way because B-0
function compileLESS(lessSource, baseFilename, intoResult) {
var parser = new less.Parser({
paths: ['variables.less', 'mixins.less'],
optimization: 0,
filename: baseFilename + '.css'
paths: ['variables.less', 'mixins.less'],
optimization: 0,
filename: baseFilename + '.css'
}).parse(lessSource, function (err, tree) {
if (err) {
return showError('<strong>Ruh roh!</strong> Could not parse less files.', err)
@ -240,9 +238,9 @@ window.onload = function () { // wait for load in a dumb way because B-0
var vars = {}
$('#less-variables-section input')
.each(function () {
$(this).val() && (vars[$(this).prev().text()] = $(this).val())
})
.each(function () {
$(this).val() && (vars[$(this).prev().text()] = $(this).val())
})
var bsLessSource = generateLESS('bootstrap.less', lessFileIncludes, vars)
var themeLessSource = generateLESS('theme.less', lessFileIncludes, vars)
@ -333,15 +331,15 @@ window.onload = function () { // wait for load in a dumb way because B-0
// browser support alerts
if (!window.URL && navigator.userAgent.toLowerCase().indexOf('safari') != -1) {
showCallout('Looks like you\'re using safari, which sadly doesn\'t have the best support\
for HTML5 blobs. Because of this your file will be downloaded with the name <code>"untitled"</code>.\
However, if you check your downloads folder, just rename this <code>"untitled"</code> file\
to <code>"bootstrap.zip"</code> and you should be good to go!')
showCallout('Looks like you\'re using safari, which sadly doesn\'t have the best support' +
'for HTML5 blobs. Because of this your file will be downloaded with the name <code>"untitled"</code>.' +
'However, if you check your downloads folder, just rename this <code>"untitled"</code> file' +
'to <code>"bootstrap.zip"</code> and you should be good to go!')
} else if (!window.URL && !window.webkitURL) {
$('.bs-docs-section, .bs-sidebar').css('display', 'none')
$('.bs-docs-section, .bs-docs-sidebar').css('display', 'none')
showCallout('Looks like your current browser doesn\'t support the Bootstrap Customizer. Please take a second\
to <a href="https://www.google.com/intl/en/chrome/browser/"> upgrade to a more modern browser</a>.', true)
showCallout('Looks like your current browser doesn\'t support the Bootstrap Customizer. Please take a second' +
'to <a href="https://www.google.com/intl/en/chrome/browser/">upgrade to a more modern browser</a>.', true)
}
parseUrl()

2
docs/assets/js/docs.min.js vendored
View File

@ -13,4 +13,4 @@ var Holder=Holder||{};!function(a,b){function c(a,b,c){b=parseInt(b,10),a=parseI
* Licensed under the Creative Commons Attribution 3.0 Unported License. For
* details, see http://creativecommons.org/licenses/by/3.0/.
*/
!function(a){a(function(){if(navigator.userAgent.match(/IEMobile\/10\.0/)){var b=document.createElement("style");b.appendChild(document.createTextNode("@-ms-viewport{width:auto!important}")),document.querySelector("head").appendChild(b)}{var c=a(window),d=a(document.body);a(".navbar").outerHeight(!0)+10}d.scrollspy({target:".bs-sidebar"}),c.on("load",function(){d.scrollspy("refresh")}),a(".bs-docs-container [href=#]").click(function(a){a.preventDefault()}),setTimeout(function(){var b=a(".bs-sidebar");b.affix({offset:{top:function(){var c=b.offset().top,d=parseInt(b.children(0).css("margin-top"),10),e=a(".bs-docs-nav").height();return this.top=c-e-d},bottom:function(){return this.bottom=a(".bs-footer").outerHeight(!0)}}})},100),setTimeout(function(){a(".bs-top").affix()},100),a(".tooltip-demo").tooltip({selector:"[data-toggle=tooltip]",container:"body"}),a(".tooltip-test").tooltip(),a(".popover-test").popover(),a(".bs-docs-navbar").tooltip({selector:"a[data-toggle=tooltip]",container:".bs-docs-navbar .nav"}),a(".bs-docs-popover").popover(),a(".bs-docs-popover-dismiss").popover({trigger:"focus"}),a("#loading-example-btn").click(function(){var b=a(this);b.button("loading"),setTimeout(function(){b.button("reset")},3e3)})})}(jQuery);
!function(a){a(function(){if(navigator.userAgent.match(/IEMobile\/10\.0/)){var b=document.createElement("style");b.appendChild(document.createTextNode("@-ms-viewport{width:auto!important}")),document.querySelector("head").appendChild(b)}{var c=a(window),d=a(document.body);a(".navbar").outerHeight(!0)+10}d.scrollspy({target:".bs-docs-sidebar"}),c.on("load",function(){d.scrollspy("refresh")}),a(".bs-docs-container [href=#]").click(function(a){a.preventDefault()}),setTimeout(function(){var b=a(".bs-docs-sidebar");b.affix({offset:{top:function(){var c=b.offset().top,d=parseInt(b.children(0).css("margin-top"),10),e=a(".bs-docs-nav").height();return this.top=c-e-d},bottom:function(){return this.bottom=a(".bs-docs-footer").outerHeight(!0)}}})},100),setTimeout(function(){a(".bs-top").affix()},100),a(".tooltip-demo").tooltip({selector:"[data-toggle=tooltip]",container:"body"}),a(".tooltip-test").tooltip(),a(".popover-test").popover(),a(".bs-docs-navbar").tooltip({selector:"a[data-toggle=tooltip]",container:".bs-docs-navbar .nav"}),a(".bs-docs-popover").popover(),a(".bs-docs-popover-dismiss").popover({trigger:"focus"}),a("#loading-example-btn").click(function(){var b=a(this);b.button("loading"),setTimeout(function(){b.button("reset")},3e3)})})}(jQuery);

6
docs/assets/js/raw-files.min.js vendored
View File

File diff suppressed because one or more lines are too long

2317
docs/assets/js/vendor/jszip.js vendored
View File

File diff suppressed because it is too large Load Diff

14
docs/assets/js/vendor/jszip.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

26
docs/assets/js/vendor/less.min.js vendored
View File

File diff suppressed because one or more lines are too long

113
docs/browser-bugs.html Normal file
View File

@ -0,0 +1,113 @@
---
layout: default
title: Wall of browser bugs
slug: browser-bugs
lead: "A list of the browser bugs that Bootstrap is currently grappling with."
---
<div class="bs-docs-section">
<h1 id="browser-bugs" class="page-header">Browser bugs</h1>
<p>In order to deliver a consistent and usable cross-browser experience, Bootstrap currently has to work around several outstanding bugs in major browsers. And in some cases, we are completely unable to work around certain bugs, and must instead either document them for the benefit of our users or accept a degraded experience. We publicly list browser bugs that are impacting us here, in the hopes of expediting the process of fixing them. For information on Bootstrap's browser compatibility, <a href="../getting-started/#support">see our browser compatibility docs</a>.</p>
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>Browser(s)</th>
<th>Summary of bug</th>
<th>Upstream bug(s)</th>
<th>Downstream issue(s)</th>
</tr>
</thead>
<tbody>
<tr>
<td>Firefox</td>
<td>Allow use of line-height for <code>&lt;input&gt;</code></td>
<td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=697451">Mozilla bug #697451</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/2985">Bootstrap issue #2985</a></td>
</tr>
<tr>
<td>Firefox</td>
<td>Unusual default form control styles on Android</td>
<td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=900871">Closed Mozilla bug #900871</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=763671">Open Mozilla bug #763671</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/8702">Bootstrap issue #8702</a></td>
</tr>
<tr>
<td>Firefox</td>
<td><code>max-width: 100%;</code> doesn't work inside tables</td>
<td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=975632">Mozilla bug #975632</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/10690">Bootstrap issue #10690</a></td>
</tr>
<tr>
<td>Chrome</td>
<td>(More investigation needed&hellip;)</td>
<td>None yet</td>
<td><a href="https://github.com/twbs/bootstrap/issues/1969">Bootstrap issue #1969</a></td>
</tr>
<tr>
<td>Chrome</td>
<td>Weird button behavior with some number inputs</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=337668">Chromium issue #337668</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/8350">Bootstrap issue #8350</a>, <a href="https://github.com/necolas/normalize.css/issues/283">Normalize.css issue #283</a></td>
</tr>
<tr>
<td>Chrome</td>
<td>Navbar rendering problem on Windows after several clicks</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=272750">Chromium issue #272750</a>, <a href="https://bugs.webkit.org/show_bug.cgi?id=119793">WebKit bug #119793</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/9226">Bootstrap bug #9226</a></td>
</tr>
<tr>
<td>Chrome</td>
<td><code>display: table;</code> within <code>display: block;</code> forces sibling content to new line</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=309483">Chromium issue #309483</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/9950">Bootstrap issue #9950</a></td>
</tr>
<tr>
<td>Chrome</td>
<td>Unwanted vertical lines when printing styled <code>&lt;select&gt;s</code> on OS X</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=282918">Chromium issue #282918</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/11245">Bootstrap issue #11245</a></td>
</tr>
<tr>
<td>Chrome</td>
<td>inline-block element collapses white-space on Windows</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=329574">Chromium issue #329574</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/11885">Bootstrap issue #11885</a></td>
</tr>
<tr>
<td>Chrome</td>
<td>Incorrect viewport size used for media queries when printing</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=273306">Chromium issue #273306</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/12078">Bootstrap issue #12078</a></td>
</tr>
<tr>
<td>Chrome &amp; Safari</td>
<td>OS X scrollbar clipped in <code>select[multiple]</code> with padding</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=342208">Chromium issue #342208</a>, <a href="https://bugs.webkit.org/show_bug.cgi?id=128489">WebKit bug #128489</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/12536">Bootstrap issue #12536</a></td>
</tr>
<tr>
<td>Chrome</td>
<td><code>display: table-cell; width: 100%;</code> doesn't work correctly on date input</td>
<td><a href="https://code.google.com/p/chromium/issues/detail?id=346051">Chromium issue #346051</a></td>
<td><a href="https://github.com/twbs/bootstrap/issues/12548">Bootstrap issue #12548</a></td>
</tr>
<tr>
<td>Safari</td>
<td>Insufficient CSS percentage precision</td>
<td>(No public bug tracker)</td>
<td><a href="https://github.com/twbs/bootstrap/issues/9282">Bootstrap issue #9282</a></td>
</tr>
<tr>
<td>Safari</td>
<td>Justified nav rendering bug</td>
<td>(No public bug tracker)</td>
<td><a href="https://github.com/twbs/bootstrap/issues/9774">Bootstrap issue #9774</a></td>
</tr>
</tbody>
</table>
</div>
</div>

81
docs/components.html
View File

@ -2280,6 +2280,34 @@ body { padding-bottom: 70px; }
</div>
{% endhighlight %}
<h3 id="progress-low-percentages">Low percentages</h3>
<p>Progress bars representing low single digit percentages, as well as 0%, include a <code>min-width: 20px;</code> for legibility.</p>
<div class="bs-example">
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
0%
</div>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="width: 2%;">
2%
</div>
</div>
</div>
{% highlight html %}
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
0%
</div>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="width: 2%;">
2%
</div>
</div>
{% endhighlight %}
<h3 id="progress-alternatives">Contextual alternatives</h3>
<p>Progress bars use some of the same button and alert classes for consistent styles.</p>
<div class="bs-example">
@ -2620,6 +2648,31 @@ body { padding-bottom: 70px; }
<a href="#" class="list-group-item">Porta ac consectetur ac</a>
<a href="#" class="list-group-item">Vestibulum at eros</a>
</div>
{% endhighlight %}
<h3 id="list-group-disabled">Disabled items</h3>
<p>Add <code>.disabled</code> to a <code>.list-group-item</code> to gray it out to appear disabled.</p>
<div class="bs-example">
<div class="list-group">
<a href="#" class="list-group-item disabled">
Cras justo odio
</a>
<a href="#" class="list-group-item">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item">Morbi leo risus</a>
<a href="#" class="list-group-item">Porta ac consectetur ac</a>
<a href="#" class="list-group-item">Vestibulum at eros</a>
</div>
</div>
{% highlight html %}
<div class="list-group">
<a href="#" class="list-group-item disabled">
Cras justo odio
</a>
<a href="#" class="list-group-item">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item">Morbi leo risus</a>
<a href="#" class="list-group-item">Porta ac consectetur ac</a>
<a href="#" class="list-group-item">Vestibulum at eros</a>
</div>
{% endhighlight %}
<h3 id="list-group-contextual-classes">Contextual classes</h3>
@ -2972,6 +3025,34 @@ body { padding-bottom: 70px; }
<!-- Responsive embeds
================================================== -->
<div class="bs-docs-section">
<h1 id="responsive-embed" class="page-header">Responsive embed</h1>
<p>Allow browsers to determine video or slideshow dimensions based on the width of their containing block by creating an intrinsic ratio that will properly scale on any device.</p>
<p>Rules are directly apply to <code>&lt;iframe&gt;</code>, <code>&lt;embed&gt;</code> and <code>&lt;object&gt;</code> elements, optionally use of an explicit descendant class <code>.embed-responsive-item</code> when you want to match the styling for other attributes.</p>
<p><strong>Pro-Tip!</strong> You don't need to include <code>frameborder="0"</code> in your <code>&lt;iframe&gt;</code>s as we override that for you.</p>
<div class="bs-example">
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="//www.youtube.com/embed/zpOULjyy-n8?rel=0" allowfullscreen></iframe>
</div>
</div>
{% highlight html %}
<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="…"></iframe>
</div>
<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
<iframe class="embed-responsive-item" src="…"></iframe>
</div>
{% endhighlight %}
</div>
<!-- Wells
================================================== -->
<div class="bs-docs-section">

150
docs/css.html
View File

@ -46,12 +46,18 @@ lead: "Global CSS settings, fundamental HTML elements styled and enhanced with e
<p>For improved cross-browser rendering, we use <a href="http://necolas.github.io/normalize.css/" target="_blank">Normalize.css</a>, a project by <a href="http://twitter.com/necolas" target="_blank">Nicolas Gallagher</a> and <a href="http://twitter.com/jon_neal" target="_blank">Jonathan Neal</a>.</p>
<h3 id="overview-container">Containers</h3>
<p>Easily center a page's contents by wrapping its contents in a <code>.container</code>. Containers set <code>width</code> at various media query breakpoints to match our grid system.</p>
<p>Note that, due to <code>padding</code> and fixed widths, containers are not nestable by default.</p>
<p>Bootstrap requires a containing element to wrap site contents and house our grid system. You may choose one of two containers to use in your projects. Note that, due to <code>padding</code> and more, neither container is nestable.</p>
<p>Use <code>.container</code> for a responsive fixed width container.</p>
{% highlight html %}
<div class="container">
...
</div>
{% endhighlight %}
<p>Use <code>.container-fluid</code> for a full width container, spanning the entire width of your viewport.</p>
{% highlight html %}
<div class="container-fluid">
...
</div>
{% endhighlight %}
</div>
@ -73,6 +79,7 @@ lead: "Global CSS settings, fundamental HTML elements styled and enhanced with e
<li>Predefined grid classes like <code>.row</code> and <code>.col-xs-4</code> are available for quickly making grid layouts. Less mixins can also be used for more semantic layouts.</li>
<li>Columns create gutters (gaps between column content) via <code>padding</code>. That padding is offset in rows for the first and last column via negative margin on <code>.row</code>s.</li>
<li>Grid columns are created by specifying the number of twelve available columns you wish to span. For example, three equal columns would use three <code>.col-xs-4</code>.</li>
<li>Grid classes apply to devices with screen widths greater than or equal to the breakpoint sizes, and override grid classes targeted at smaller devices. Therefore, applying any <code>.col-md-</code> class to an element will not only affect its styling on medium devices but also on large devices if a <code>.col-lg-</code> class is not present.</li>
</ul>
<p>Look to the examples for applying these principles to your code.</p>
@ -151,9 +158,9 @@ lead: "Global CSS settings, fundamental HTML elements styled and enhanced with e
<tr>
<th>Column width</th>
<td class="text-muted">Auto</td>
<td>60px</td>
<td>78px</td>
<td>95px</td>
<td>~62px</td>
<td>~81px</td>
<td>~97px</td>
</tr>
<tr>
<th>Gutter width</th>
@ -174,7 +181,6 @@ lead: "Global CSS settings, fundamental HTML elements styled and enhanced with e
</tbody>
</table>
</div>
<p>Grid classes apply to devices with screen widths greater than or equal to the breakpoint sizes, and override grid classes targeted at smaller devices. Therefore, applying any <code>.col-md-</code> class to an element will not only affect its styling on medium devices but also on large devices if a <code>.col-lg-</code> class is not present.</p>
<h3 id="grid-example-basic">Example: Stacked-to-horizontal</h3>
<p>Using a single set of <code>.col-md-*</code> grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns in any <code>.row</code>.</p>
@ -712,9 +718,54 @@ lead: "Global CSS settings, fundamental HTML elements styled and enhanced with e
<h3>Built with Less</h3>
<p>The typographic scale is based on two Less variables in <strong>variables.less</strong>: <code>@font-size-base</code> and <code>@line-height-base</code>. The first is the base font-size used throughout and the second is the base line-height. We use those variables and some simple math to create the margins, paddings, and line-heights of all our type and more. Customize them and Bootstrap adapts.</p>
<!-- Inline text elements -->
<h2 id="type-inline-text">Inline text elements</h2>
<h3>Marked text</h3>
<p>For indicating blocks of text that have been deleted use the <code>&lt;mark&gt;</code> tag.</p>
<div class="bs-example">
<p>You can use the mark tag to <mark>highlight</mark> text.</p>
</div>
{% highlight html %}
<mark>This line of text is meant to be treated as deleted text.</mark>
{% endhighlight %}
<h3>Deleted text</h3>
<p>For indicating blocks of text that have been deleted use the <code>&lt;del&gt;</code> tag.</p>
<div class="bs-example">
<p><del>This line of text is meant to be treated as deleted text.</del></p>
</div>
{% highlight html %}
<del>This line of text is meant to be treated as deleted text.</del>
{% endhighlight %}
<h3>Strikethrough text</h3>
<p>For indicating blocks of text that are no longer relevant use the <code>&lt;s&gt;</code> tag.</p>
<div class="bs-example">
<p><s>This line of text is meant to be treated as no longer accurate.</s></p>
</div>
{% highlight html %}
<s>This line of text is meant to be treated as no longer accurate.</s>
{% endhighlight %}
<h3>Inserted text</h3>
<p>For indicating additions to the document use the <code>&lt;ins&gt;</code> tag.</p>
<div class="bs-example">
<p><ins>This line of text is meant to be treated as an addition to the document.</ins></p>
</div>
{% highlight html %}
<ins>This line of text is meant to be treated as an addition to the document.</ins>
{% endhighlight %}
<h3>Underlined text</h3>
<p>To underline text use the <code>&lt;u&gt;</code> tag.</p>
<div class="bs-example">
<p><u>This line of text is will render as underlined</u></p>
</div>
{% highlight html %}
<u>This line of text is will render as underlined</u>
{% endhighlight %}
<!-- Emphasis -->
<h2 id="type-emphasis">Emphasis</h2>
<p>Make use of HTML's default emphasis tags with lightweight styles.</p>
<h3>Small text</h3>
@ -751,7 +802,7 @@ lead: "Global CSS settings, fundamental HTML elements styled and enhanced with e
<p>Feel free to use <code>&lt;b&gt;</code> and <code>&lt;i&gt;</code> in HTML5. <code>&lt;b&gt;</code> is meant to highlight words or phrases without conveying additional importance while <code>&lt;i&gt;</code> is mostly for voice, technical terms, etc.</p>
</div>
<h3>Alignment classes</h3>
<h2 id="type-alignment">Alignment classes</h2>
<p>Easily realign text to components with text alignment classes.</p>
<div class="bs-example">
<p class="text-left">Left aligned text.</p>
@ -1045,10 +1096,29 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% endhighlight %}
<p>You may optionally add the <code>.pre-scrollable</code> class, which will set a max-height of 350px and provide a y-axis scrollbar.</p>
<h2 id="code-variables">Variables</h2>
<p>For indicating variables use the <code>&lt;var&gt;</code> tag.</p>
<div class="bs-example">
<p><var>y</var> = <var>m</var><var>x</var> + <var>b</var></p>
</div>
{% highlight html %}
<var>y</var> = <var>m</var><var>x</var> + <var>b</var>
{% endhighlight %}
<h2 id="code-sample-output">Sample output</h2>
<p>For indicating blocks sample output from a program use the <code>&lt;samp&gt;</code> tag.</p>
<div class="bs-example">
<p><samp>This text is meant to be treated as sample output from a computer program.</samp></p>
</div>
{% highlight html %}
<samp>This text is meant to be treated as sample output from a computer program.</samp>
{% endhighlight %}
</div>
<!-- Tables
================================================== -->
<div class="bs-docs-section">
@ -1872,7 +1942,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<h2 id="forms-control-disabled">Disabled inputs</h2>
<p>Add the <code>disabled</code> attribute on an input to prevent user input and trigger a slightly different look.</p>
<p>Add the <code>disabled</code> boolean attribute on an input to prevent user input and trigger a slightly different look.</p>
<div class="bs-example">
<form role="form">
<input class="form-control" id="disabledInput" type="text" placeholder="Disabled input here…" disabled>
@ -1886,8 +1956,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
<p>Add the <code>disabled</code> attribute to a <code>&lt;fieldset&gt;</code> to disable all the controls within the <code>&lt;fieldset&gt;</code> at once.</p>
<div class="bs-callout bs-callout-warning">
<h4>Link functionality of <code>&lt;a&gt;</code> not impacted</h4>
<p>This class will only change the appearance of <code>&lt;a class="btn btn-default"&gt;</code> buttons, not their functionality. Use custom JavaScript to disable links here.</p>
<h4>Caveat about link functionality of <code>&lt;a&gt;</code></h4>
<p>Our styles use <code>pointer-events: none</code> to try to disable the link functionality of <code>&lt;a class="btn btn-*"&gt;</code> buttons in this case, but that CSS property is not yet standardized and isn't fully supported in Opera 18 and below, or in Internet Explorer 11. So to be safe, use custom JavaScript to disable such links.</p>
</div>
<div class="bs-callout bs-callout-danger">
@ -1941,6 +2011,18 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% endhighlight %}
<h2 id="forms-control-readonly">Readonly inputs</h2>
<p>Add the <code>readonly</code> boolean attribute on an input to prevent user input and style the input as disabled.</p>
<div class="bs-example">
<form role="form">
<input class="form-control" type="text" placeholder="Readonly input here…" readonly>
</form>
</div><!-- /.bs-example -->
{% highlight html %}
<input class="form-control" type="text" placeholder="Readonly input here…" readonly>
{% endhighlight %}
<h2 id="forms-control-validation">Validation states</h2>
<p>Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add <code>.has-warning</code>, <code>.has-error</code>, or <code>.has-success</code> to the parent element. Any <code>.control-label</code>, <code>.form-control</code>, and <code>.help-block</code> within that element will receive the validation styles.</p>
@ -1976,10 +2058,10 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
{% endhighlight %}
<h3>With optional icons</h3>
<p>You can also add optional feedback icons with the addition of an extra class and the right icon.</p>
<p>You can also add optional feedback icons with the addition of <code>.has-feedback</code> and the right icon.</p>
<div class="bs-callout bs-callout-warning">
<h4>Icons and input groups</h4>
<p>When using the feedback icons, be aware that manual positioning may be required for <a href="../components#input-groups">input groups</a> with an add-on on the right. Adjust the <code>right: 0;</code> to an appropriate pixel value depending on the width of your addon.</p>
<h4>Icons, labels, and input groups</h4>
<p>Manual positioning of feedback icons is required for <a href="../components#input-groups">input groups</a> with an add-on on the right and inputs without a label. For input groups, adjust the <code>right</code> value to an appropriate pixel value depending on the width of your addon. For labels, adjust the <code>top</code>value.</p>
</div>
<div class="bs-example">
<form role="form">
@ -2292,8 +2374,8 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
We use <code>.disabled</code> as a utility class here, similar to the common <code>.active</code> class, so no prefix is required.
</p>
<div class="bs-callout bs-callout-warning">
<h4>Link functionality not impacted</h4>
<p>This class will only change the <code>&lt;a&gt;</code>'s appearance, not its functionality. Use custom JavaScript to disable links here.</p>
<h4>Link functionality caveat</h4>
<p>This class uses <code>pointer-events: none</code> to try to disable the link functionality of <code>&lt;a&gt;</code>s, but that CSS property is not yet standardized and isn't fully supported in Opera 18 and below, or in Internet Explorer 11. So to be safe, use custom JavaScript to disable such links.</p>
</div>
<div class="bs-callout bs-callout-warning">
<h4>Context-specific usage</h4>
@ -2954,6 +3036,7 @@ a {
<h3 id="less-mixins-box-sizing">Box-sizing</h3>
<p>Reset your components' box model with a single mixin. For context, see this <a href="https://developer.mozilla.org/en-US/docs/CSS/box-sizing" target="_blank">helpful article from Mozilla</a>.</p>
<p>The mixin is <strong>deprecated</strong> as of v3.2.0, with the introduction of autoprefixer. To preserve backwards-compatibility, Bootstrap will continue to use the mixin internally until Bootstrap v4.</p>
{% highlight scss %}
.box-sizing(@box-model) {
-webkit-box-sizing: @box-model; // Safari <= 5
@ -2996,6 +3079,7 @@ a {
<h3 id="less-mixins-transitions">Transitions</h3>
<p>Three mixins for flexibility. Set all transition information with one, or specify a separate delay and duration as needed.</p>
<p>The mixins are <strong>deprecated</strong> as of v3.2.0, with the introduction of autoprefixer. To preserve backwards-compatibility, Bootstrap will continue to use the mixins internally until Bootstrap v4.</p>
{% highlight scss %}
.transition(@transition) {
-webkit-transition: @transition;
@ -3023,6 +3107,7 @@ a {
<h3 id="less-mixins-transformations">Transformations</h3>
<p>Rotate, scale, translate (move), or skew any object.</p>
<p>The mixins are <strong>deprecated</strong> as of v3.2.0, with the introduction of autoprefixer. To preserve backwards-compatibility, Bootstrap will continue to use the mixins internally until Bootstrap v4.</p>
{% highlight scss %}
.rotate(@degrees) {
-webkit-transform: rotate(@degrees);
@ -3079,6 +3164,7 @@ a {
<h3 id="less-mixins-animations">Animations</h3>
<p>A single mixin for using all of CSS3's animation properties in one declaration and other mixins for individual properties.</p>
<p>The mixins are <strong>deprecated</strong> as of v3.2.0, with the introduction of autoprefixer. To preserve backwards-compatibility, Bootstrap will continue to use the mixins internally until Bootstrap v4.</p>
{% highlight scss %}
.animation(@animation) {
-webkit-animation: @animation;
@ -3125,8 +3211,7 @@ a {
<p>Provide context for form controls within each field.</p>
{% highlight scss %}
.placeholder(@color: @input-color-placeholder) {
&:-moz-placeholder { color: @color; } // Firefox 4-18
&::-moz-placeholder { color: @color; } // Firefox 19+
&::-moz-placeholder { color: @color; } // Firefox
&:-ms-input-placeholder { color: @color; } // Internet Explorer 10+
&::-webkit-input-placeholder { color: @color; } // Safari and Chrome
}
@ -3161,7 +3246,7 @@ a {
{% endhighlight %}
<p>If you need a barber-stripe style gradient, that's easy, too. Just specify a single color and we'll overlay a translucent white stripe.</p>
{% highlight scss %}
#gradient > .striped(#333; #000; 45deg);
#gradient > .striped(#333; 45deg);
{% endhighlight %}
<p>Up the ante and use three colors instead. Set the first color, the second color, the second color's color stop (a decimal value like 0.25), and the third color with these mixins:</p>
{% highlight scss %}
@ -3339,3 +3424,28 @@ a {
<a class="btn btn-lg btn-outline" href="{{ site.sass_repo }}">Bootstrap for Sass</a>
</p>
</div>
<!-- RTL
================================================== -->
<div class="bs-docs-section">
<h1 id="rtl" class="page-header">RTL</h1>
<p class="lead">As of Bootstrap 3.2, a right-to-left version of Bootstrap ships as part of the repository. It's powered by Twitter's <a href="https://github.com/twitter/css-flip">CSS Flip project</a> and is generated via our Gruntfile.</p>
<h2 id="rtl-how-to">How to use</h2>
<p>Bootstrap is by default a left-to-right project. For right-to-left projects, you'll need to set your language and replace the default Bootstrap CSS with an RTL version. First, set your language and text direction:</p>
{% highlight html %}
<!-- Example: Arabic language with direction set to RTL -->
<html lang="ar" dir="rtl">
{% endhighlight %}
<p>Then, include the right-to-left CSS file in place of the default Bootstrap CSS:</p>
{% highlight html %}
<!-- Bootstrap RTL -->
<link rel="stylesheet" href="bootstrap-rtl.css">
{% endhighlight %}
<p>Alternatively, you may use the minified RTL file, <code>bootstrap-rtl.min.css</code>.</p>
<h2 id="rtl-css-flip">CSS Flip</h2>
<p><a href="https://github.com/twitter/css-flip">CSS Flip</a> is a project for converting left-to-right CSS files into right-to-left CSS files. We use it in our Gruntfile to automate the generation of Bootstrap's RTL CSS files.</p>
</div>

6
docs/customize.html
View File

@ -164,6 +164,12 @@ lead: Customize Bootstrap's components, Less variables, and jQuery plugins to ge
Panels
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="responsive-embed.less">
Responsive embed
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="wells.less">

7
docs/dist/css/bootstrap-rtl.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
docs/dist/css/bootstrap-theme.css.map vendored
View File

File diff suppressed because one or more lines are too long

4
docs/dist/css/bootstrap-theme.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
docs/dist/css/bootstrap.css.map vendored
View File

File diff suppressed because one or more lines are too long

4
docs/dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

4
docs/dist/js/bootstrap.min.js vendored
View File

File diff suppressed because one or more lines are too long

10
docs/examples/blog/blog.css
View File

@ -37,7 +37,8 @@ h6, .h6 {
.blog-masthead {
background-color: #428bca;
box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
-webkit-box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
box-shadow: inset 0 -2px 5px rgba(0,0,0,.1);
}
/* Nav links */
@ -67,9 +68,9 @@ h6, .h6 {
margin-left: -5px;
vertical-align: middle;
content: " ";
border-right: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid;
border-left: 5px solid transparent;
border-left: 5px solid transparent;
}
@ -161,3 +162,6 @@ h6, .h6 {
background-color: #f9f9f9;
border-top: 1px solid #e5e5e5;
}
.blog-footer p:last-child {
margin-bottom: 0;
}

4
docs/examples/carousel/carousel.css
View File

@ -116,11 +116,11 @@ body {
}
.navbar-wrapper .container {
padding-right: 15px;
padding-left: 15px;
padding-left: 15px;
}
.navbar-wrapper .navbar {
padding-right: 0;
padding-left: 0;
padding-left: 0;
}
/* The navbar becomes detached from the top, so we round the corners */

4
docs/examples/cover/cover.css
View File

@ -33,7 +33,8 @@ body {
color: #fff;
text-align: center;
text-shadow: 0 1px 3px rgba(0,0,0,.5);
box-shadow: inset 0 0 100px rgba(0,0,0,.5);
-webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5);
box-shadow: inset 0 0 100px rgba(0,0,0,.5);
}
/* Extra markup and styles for table-esque vertical and horizontal centering */
@ -84,6 +85,7 @@ body {
.masthead-nav > li > a:hover,
.masthead-nav > li > a:focus {
background-color: transparent;
border-bottom-color: #a9a9a9;
border-bottom-color: rgba(255,255,255,.25);
}
.masthead-nav > .active > a,

11
docs/examples/dashboard/dashboard.css
View File

@ -17,6 +17,13 @@ body {
border-bottom: 1px solid #eee;
}
/*
* Top navigation
* Hide default border to remove 1px line.
*/
.navbar-fixed-top {
border: 0;
}
/*
* Sidebar
@ -52,7 +59,9 @@ body {
padding-right: 20px;
padding-left: 20px;
}
.nav-sidebar > .active > a {
.nav-sidebar > .active > a,
.nav-sidebar > .active > a:hover,
.nav-sidebar > .active > a:focus {
color: #fff;
background-color: #428bca;
}

12
docs/examples/justified-nav/justified-nav.css
View File

@ -34,11 +34,10 @@ body {
color: #777;
text-align: center;
background-color: #e5e5e5; /* Old browsers */
background-image: -moz-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%); /* FF3.6+ */
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
background-image: -webkit-linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* Chrome 10+,Safari 5.1+ */
background-image: -o-linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* Opera 11.10+ */
background-image: linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* W3C */
background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e5e5e5));
background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%);
background-image: -o-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%);
background-image: linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
background-repeat: repeat-x; /* Repeat the gradient */
border-bottom: 1px solid #d5d5d5;
@ -48,7 +47,8 @@ body {
.nav-justified > .active > a:focus {
background-color: #ddd;
background-image: none;
box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
-webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
}
.nav-justified > li:first-child > a {
border-radius: 5px 5px 0 0;

5
docs/examples/non-responsive/non-responsive.css
View File

@ -11,6 +11,11 @@ body {
padding-bottom: 30px;
}
/* Don't let the lead text change font-size. */
.lead {
font-size: 16px;
}
/* Finesse the page header spacing */
.page-header {
margin-bottom: 30px;

10
docs/examples/offcanvas/offcanvas.css
View File

@ -21,10 +21,18 @@ footer {
.row-offcanvas {
position: relative;
-webkit-transition: all .25s ease-out;
-moz-transition: all .25s ease-out;
-o-transition: all .25s ease-out;
transition: all .25s ease-out;
}
.row-offcanvas-right {
right: 0;
}
.row-offcanvas-left {
left: 0;
}
.row-offcanvas-right
.sidebar-offcanvas {
right: -50%; /* 6 columns */

382
docs/examples/rtl/index.html Normal file
View File

@ -0,0 +1,382 @@
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="../../assets/ico/favicon.ico">
<title>RTL Template for Bootstrap</title>
<!-- Bootstrap RTL CSS -->
<link href="../../dist/css/bootstrap.rtl.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="rtl.css" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy this line! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body role="document">
<!-- Fixed navbar -->
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Bootstrap RTL</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="container theme-showcase" role="main">
<!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron">
<h1>RTL Bootstrap</h1>
<p>This is a template for a simple marketing or informational website. It includes a large callout called a jumbotron and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
<p><a href="#" class="btn btn-primary btn-lg" role="button">Learn more &raquo;</a></p>
</div>
<div class="page-header">
<h1>Buttons</h1>
</div>
<p>
<button type="button" class="btn btn-lg btn-default">Default</button>
<button type="button" class="btn btn-lg btn-primary">Primary</button>
<button type="button" class="btn btn-lg btn-success">Success</button>
<button type="button" class="btn btn-lg btn-info">Info</button>
<button type="button" class="btn btn-lg btn-warning">Warning</button>
<button type="button" class="btn btn-lg btn-danger">Danger</button>
<button type="button" class="btn btn-lg btn-link">Link</button>
</p>
<p>
<button type="button" class="btn btn-default">Default</button>
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-link">Link</button>
</p>
<p>
<button type="button" class="btn btn-sm btn-default">Default</button>
<button type="button" class="btn btn-sm btn-primary">Primary</button>
<button type="button" class="btn btn-sm btn-success">Success</button>
<button type="button" class="btn btn-sm btn-info">Info</button>
<button type="button" class="btn btn-sm btn-warning">Warning</button>
<button type="button" class="btn btn-sm btn-danger">Danger</button>
<button type="button" class="btn btn-sm btn-link">Link</button>
</p>
<p>
<button type="button" class="btn btn-xs btn-default">Default</button>
<button type="button" class="btn btn-xs btn-primary">Primary</button>
<button type="button" class="btn btn-xs btn-success">Success</button>
<button type="button" class="btn btn-xs btn-info">Info</button>
<button type="button" class="btn btn-xs btn-warning">Warning</button>
<button type="button" class="btn btn-xs btn-danger">Danger</button>
<button type="button" class="btn btn-xs btn-link">Link</button>
</p>
<div class="page-header">
<h1>Thumbnails</h1>
</div>
<img data-src="holder.js/200x200" class="img-thumbnail" alt="A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera">
<div class="page-header">
<h1>Dropdown menus</h1>
</div>
<div class="dropdown theme-dropdown clearfix">
<a id="dropdownMenu1" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li class="active" role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>
<div class="page-header">
<h1>Navbars</h1>
</div>
<div class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="page-header">
<h1>Alerts</h1>
</div>
<div class="alert alert-success">
<strong>Well done!</strong> You successfully read this important alert message.
</div>
<div class="alert alert-info">
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
</div>
<div class="alert alert-warning">
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
<div class="alert alert-danger">
<strong>Oh snap!</strong> Change a few things up and try submitting again.
</div>
<div class="page-header">
<h1>Progress bars</h1>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"><span class="sr-only">60% Complete</span></div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%"><span class="sr-only">40% Complete (success)</span></div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%"><span class="sr-only">20% Complete</span></div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"><span class="sr-only">60% Complete (warning)</span></div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%"><span class="sr-only">80% Complete (danger)</span></div>
</div>
<div class="progress">
<div class="progress-bar progress-bar-success" style="width: 35%"><span class="sr-only">35% Complete (success)</span></div>
<div class="progress-bar progress-bar-warning" style="width: 20%"><span class="sr-only">20% Complete (warning)</span></div>
<div class="progress-bar progress-bar-danger" style="width: 10%"><span class='sr-only'>10% Complete (danger)</span></div>
</div>
<div class="page-header">
<h1>List groups</h1>
</div>
<div class="row">
<div class="col-sm-4">
<ul class="list-group">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li>
<li class="list-group-item">Porta ac consectetur ac</li>
<li class="list-group-item">Vestibulum at eros</li>
</ul>
</div><!-- /.col-sm-4 -->
<div class="col-sm-4">
<div class="list-group">
<a href="#" class="list-group-item active">
Cras justo odio
</a>
<a href="#" class="list-group-item">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item">Morbi leo risus</a>
<a href="#" class="list-group-item">Porta ac consectetur ac</a>
<a href="#" class="list-group-item">Vestibulum at eros</a>
</div>
</div><!-- /.col-sm-4 -->
<div class="col-sm-4">
<div class="list-group">
<a href="#" class="list-group-item active">
<h4 class="list-group-item-heading">List group item heading</h4>
<p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
</a>
<a href="#" class="list-group-item">
<h4 class="list-group-item-heading">List group item heading</h4>
<p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
</a>
<a href="#" class="list-group-item">
<h4 class="list-group-item-heading">List group item heading</h4>
<p class="list-group-item-text">Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
</a>
</div>
</div><!-- /.col-sm-4 -->
</div>
<div class="page-header">
<h1>Panels</h1>
</div>
<div class="row">
<div class="col-sm-4">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
</div><!-- /.col-sm-4 -->
<div class="col-sm-4">
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
</div><!-- /.col-sm-4 -->
<div class="col-sm-4">
<div class="panel panel-warning">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-danger">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
<div class="panel-body">
Panel content
</div>
</div>
</div><!-- /.col-sm-4 -->
</div>
<div class="page-header">
<h1>Wells</h1>
</div>
<div class="well">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Aenean lacinia bibendum nulla sed consectetur.</p>
</div>
</div> <!-- /container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="../../dist/js/bootstrap.min.js"></script>
<script src="../../assets/js/docs.min.js"></script>
</body>
</html>

14
docs/examples/rtl/rtl.css Normal file
View File

@ -0,0 +1,14 @@
body {
padding-top: 70px;
padding-bottom: 30px;
}
.theme-dropdown .dropdown-menu {
position: static;
display: block;
margin-bottom: 20px;
}
.theme-showcase > p > .btn {
margin: 5px 0;
}

2
docs/examples/sticky-footer-navbar/index.html
View File

@ -71,7 +71,7 @@
<p>Back to <a href="../sticky-footer">the default sticky footer</a> minus the navbar.</p>
</div>
<div id="footer">
<div class="footer">
<div class="container">
<p class="text-muted">Place sticky footer content here.</p>
</div>

4
docs/examples/sticky-footer-navbar/sticky-footer-navbar.css
View File

@ -8,7 +8,7 @@ body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
#footer {
.footer {
position: absolute;
bottom: 0;
width: 100%;
@ -29,7 +29,7 @@ body > .container {
margin: 20px 0;
}
#footer > .container {
.footer > .container {
padding-right: 15px;
padding-left: 15px;
}

2
docs/examples/sticky-footer/index.html
View File

@ -37,7 +37,7 @@
<p>Use <a href="../sticky-footer-navbar">the sticky footer with a fixed navbar</a> if need be, too.</p>
</div>
<div id="footer">
<div class="footer">
<div class="container">
<p class="text-muted">Place sticky footer content here.</p>
</div>

2
docs/examples/sticky-footer/sticky-footer.css
View File

@ -8,7 +8,7 @@ body {
/* Margin bottom by footer height */
margin-bottom: 60px;
}
#footer {
.footer {
position: absolute;
bottom: 0;
width: 100%;

9
docs/getting-started.html
View File

@ -30,6 +30,7 @@ lead: "An overview of Bootstrap, how to download and use, basic templates and ex
<a href="{{ site.download.sass }}" class="btn btn-lg btn-outline" role="button" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download Sass']);">Download Sass</a>
</div>
</div>
<p class="muted">Currently v{{ site.current_version }}.</p>
<h3 id="download-cdn">Bootstrap CDN</h3>
<p>The folks over at <a href="http://www.maxcdn.com/">MaxCDN</a> graciously provide CDN support for Bootstrap's CSS and JavaScript. Just use these <a href="http://www.bootstrapcdn.com/">Bootstrap CDN</a> links.</p>
@ -417,6 +418,7 @@ bootstrap/
</table>
</div>
<p>Unofficially, Bootstrap should look and behave well enough in Chromium and Chrome for Linux, Firefox for Linux, and Internet Explorer 7, though they are not officially supported.</p>
<p>For a list of some of the browser bugs that Bootstrap has to grapple with, see our <a href="../browser-bugs/">Wall of browser bugs</a>.</p>
<h3 id="support-ie8-ie9">Internet Explorer 8 and 9</h3>
<p>Internet Explorer 8 and 9 are also supported, however, please be aware that some CSS3 properties and HTML5 elements are not fully supported by these browsers. In addition, <strong>Internet Explorer 8 requires the use of <a href="https://github.com/scottjehl/Respond">Respond.js</a> to enable media query support.</strong></p>
@ -449,8 +451,6 @@ bootstrap/
<th scope="row"><code>transition</code></th>
<td colspan="2" class="text-danger"><span class="glyphicon glyphicon-remove"></span> Not supported</td>
</tr>
</tbody>
<tbody>
<tr>
<th scope="row"><code>placeholder</code></th>
<td colspan="2" class="text-danger"><span class="glyphicon glyphicon-remove"></span> Not supported</td>
@ -511,7 +511,7 @@ if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
<p>As a heads up, we include this in the Bootstrap docs as an example.</p>
<h3 id="support-safari-percentages">Safari percent rounding</h3>
<p>As of Safari v6.1 for OS X and Safari for iOS v7.0.1, Safari's rendering engine has some trouble with the number of decimal places used in our <code>.col-*-1</code> grid classes. So if you have 12 individual grid columns, you'll notice that they come up short compared to other rows of columns. We can't do much here (<a href="https://github.com/twbs/bootstrap/issues/9282">see #9282</a>) but you do have some options:</p>
<p>As of Safari v7.0.1 for OS X and Safari for iOS v7.0.1, Safari's rendering engine has some trouble with the number of decimal places used in our <code>.col-*-1</code> grid classes. So if you have 12 individual grid columns, you'll notice that they come up short compared to other rows of columns. We can't do much here (<a href="https://github.com/twbs/bootstrap/issues/9282">see #9282</a>) but you do have some options:</p>
<ul>
<li>Add <code>.pull-right</code> to your last grid column to get the hard-right alignment</li>
<li>Tweak your percentages manually to get the perfect rounding for Safari (more difficult than the first option)</li>
@ -771,5 +771,6 @@ if (isAndroid) {
<li><a href="http://www.oneskyapp.com/docs/bootstrap/es">Bootstrap en Español (Spanish)</a></li>
<li><a href="http://twbs.site-konstruktor.com.ua">Bootstrap ua Українською (Ukrainian)</a></li>
</ul>
<p>Have another language to add, or perhaps a different or better translation? Let us know by <a href="https://github.com/twbs/bootstrap/issues/new">opening an issue</a>.</p>
<p><strong class="text-danger">We don't help organize or host translations, we just link to them.</strong></p>
<p>Finished a new or better translation? Open a pull request to add it to our list.</p>
</div>

37
docs/javascript.html
View File

@ -65,7 +65,7 @@ $.fn.bootstrapBtn = bootstrapButton // give $().bootstrapBtn the Boot
{% endhighlight %}
<h3 id="js-events">Events</h3>
<p>Bootstrap provides custom events for most plugins' unique actions. Generally, these come in an infinitive and past participle form - where the infinitive (ex. <code>show</code>) is triggered at the start of an event, and its past participle form (ex. <code>shown</code>) is trigger on the completion of an action.</p>
<p>Bootstrap provides custom events for most plugins' unique actions. Generally, these come in an infinitive and past participle form - where the infinitive (ex. <code>show</code>) is triggered at the start of an event, and its past participle form (ex. <code>shown</code>) is triggered on the completion of an action.</p>
<p>As of 3.0.0, all Bootstrap events are namespaced.</p>
<p>All infinitive events provide <code>preventDefault</code> functionality. This provides the ability to stop the execution of an action before it starts.</p>
{% highlight js %}
@ -241,14 +241,14 @@ $('#myModal').on('show.bs.modal', function (e) {
<h2 id="modals-sizes">Optional sizes</h2>
<p>Modals have two optional sizes, available via modifier classes to be placed on a <code>.modal-dialog</code>.</p>
<div class="bs-example">
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-modal-lg">Large modal</button>
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-modal-sm">Small modal</button>
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">Large modal</button>
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
</div>
{% highlight html %}
<!-- Large modal -->
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-modal-lg">Large modal</button>
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">Large modal</button>
<div class="modal fade bs-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
...
@ -257,9 +257,9 @@ $('#myModal').on('show.bs.modal', function (e) {
</div>
<!-- Small modal -->
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-modal-sm">Small modal</button>
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
<div class="modal fade bs-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
...
@ -269,7 +269,7 @@ $('#myModal').on('show.bs.modal', function (e) {
{% endhighlight %}
<!-- Modal content for the above example -->
<div class="modal fade bs-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
@ -283,7 +283,7 @@ $('#myModal').on('show.bs.modal', function (e) {
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<div class="modal fade bs-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
@ -298,6 +298,13 @@ $('#myModal').on('show.bs.modal', function (e) {
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<h2 id="modals-remove-animation">Remove animation</h2>
<p>For modals that simply appear rather than fade in to view, remove the <code>.fade</code> class from your modal markup.</p>
{% highlight html %}
<div class="modal" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
...
</div>
{% endhighlight %}
<h2 id="modals-usage">Usage</h2>
<p>The modal plugin toggles your hidden content on demand, via data attributes or JavaScript. It also adds <code>.modal-open</code> to the <code>&lt;body&gt;</code> to override default scrolling behavior and generates a <code>.modal-backdrop</code> to provide a click area for dismissing shown modals when clicking outside the modal.</p>
@ -435,7 +442,7 @@ $('#myModal').on('hidden.bs.modal', function (e) {
<nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-collapse">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-example-js-navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
@ -443,7 +450,7 @@ $('#myModal').on('hidden.bs.modal', function (e) {
</button>
<a class="navbar-brand" href="#">Project Name</a>
</div>
<div class="collapse navbar-collapse bs-js-navbar-collapse">
<div class="collapse navbar-collapse bs-example-js-navbar-collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
@ -614,7 +621,7 @@ $('#myDropdown').on('show.bs.dropdown', function () {
<nav id="navbar-example2" class="navbar navbar-default navbar-static" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-scrollspy">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-example-js-navbar-scrollspy">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
@ -622,7 +629,7 @@ $('#myDropdown').on('show.bs.dropdown', function () {
</button>
<a class="navbar-brand" href="#">Project Name</a>
</div>
<div class="collapse navbar-collapse bs-js-navbar-scrollspy">
<div class="collapse navbar-collapse bs-example-js-navbar-scrollspy">
<ul class="nav navbar-nav">
<li><a href="#fat">@fat</a></li>
<li><a href="#mdo">@mdo</a></li>
@ -2092,11 +2099,11 @@ $('#myCarousel').on('slide.bs.carousel', function () {
<h3>Via JavaScript</h3>
<p>Call the affix plugin via JavaScript:</p>
{% highlight js %}
$('#myAffix').affix({
$('#my-affix').affix({
offset: {
top: 100
, bottom: function () {
return (this.bottom = $('.bs-footer').outerHeight(true))
return (this.bottom = $('.footer').outerHeight(true))
}
}
})

1
docs/migration.html
View File

@ -428,6 +428,7 @@ lead: "Guidance on how to upgrade from Bootstrap v2.x to v3.x with emphasis on m
<li>Typeahead has been dropped, in favor of using <a href="http://twitter.github.io/typeahead.js/">Twitter Typeahead</a>.</li>
<li>Modal markup has changed significantly. The <code>.modal-header</code>, <code>.modal-body</code>, and <code>.modal-footer</code> sections are now wrapped in <code>.modal-content</code> and <code>.modal-dialog</code> for better mobile styling and behavior. Also, you should no longer apply <code>.hide</code> to <code>.modal</code> in your markup.</li>
<li>As of v3.1.0, the HTML loaded by the <code>remote</code> modal option is now injected into the <code>.modal-content</code> (from v3.0.0 to v3.0.3, into the <code>.modal</code>) instead of into the <code>.modal-body</code>. This allows you to also easily vary the header and footer of the modal, not just the modal body.</li>
<li>The checkbox and radio features of the button.js plugin now both use <code>data-toggle="buttons"</code> instead of <code>data-toggle="buttons-checkbox"</code> or <code>data-toggle="buttons-radio"</code> in their markup.</li>
<li>JavaScript events are namespaced. For example, to handle the modal "show" event, use <code>'show.bs.modal'</code>. For tabs "shown" use <code>'shown.bs.tab'</code>, etc.</li>
</ul>
<p>For more information on upgrading to v3.0, and code snippets from the community, see <a href="http://bootply.com/">Bootply</a>.</p>

10
docs/robots.txt Normal file
View File

@ -0,0 +1,10 @@
---
layout: nil
---
# www.robotstxt.org/
# Allow crawling of all content
User-agent: *
Disallow:
Sitemap: {{ site.url }}/sitemap.xml

22
docs/sitemap.xml Normal file
View File

@ -0,0 +1,22 @@
---
layout: nil
---
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>{{ site.url }}/</loc>
<lastmod>{{ site.time | date_to_xmlschema }}</lastmod>
<changefreq>daily</changefreq>
<priority>1.0</priority>
</url>
{% for page in site.html_pages %}
{% if page.layout != "home" %}
<url>
<loc>{{ site.url }}{{ page.url }}</loc>
<lastmod>{{ site.time | date_to_xmlschema }}</lastmod>
<changefreq>weekly</changefreq>
<priority>0.7</priority>
</url>
{% endif %}
{% endfor %}
</urlset>

0
fonts/glyphicons-halflings-regular.eot Executable file → Normal file
View File

0
fonts/glyphicons-halflings-regular.svg Executable file → Normal file
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 62 KiB

After

Width:  |  Height:  |  Size: 62 KiB

0
fonts/glyphicons-halflings-regular.ttf Executable file → Normal file
View File

0
fonts/glyphicons-halflings-regular.woff Executable file → Normal file
View File

14
grunt/.jshintrc
View File

@ -1,16 +1,10 @@
{
"asi": false,
"camelcase": true,
"curly": true,
"curly" : true,
"eqeqeq": true,
"immed": true,
"indent": 2,
"newcap": true,
"noarg": true,
"noarg" : true,
"node" : true,
"nonbsp": true,
"quotmark": "single",
"undef": true,
"strict": true,
"trailing": true,
"node" : true
"undef" : true
}

2
grunt/bs-glyphicons-data-generator.js
View File

@ -15,7 +15,7 @@ module.exports = function generateGlyphiconsData() {
// Use any line that starts with ".glyphicon-" and capture the class name
var iconClassName = /^\.(glyphicon-[^\s]+)/;
var glyphiconsData = '# This file is generated via Grunt task. **Do not edit directly.** \n' +
var glyphiconsData = '# This file is generated via Grunt task. **Do not edit directly.**\n' +
'# See the \'build-glyphicons-data\' task in Gruntfile.js.\n\n';
for (var i = 0, len = glpyhiconsLines.length; i < len; i++) {
var match = glpyhiconsLines[i].match(iconClassName);

12
grunt/bs-raw-files-generator.js
View File

@ -6,8 +6,9 @@
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
'use strict';
var btoa = require('btoa');
var fs = require('fs');
var btoa = require('btoa');
var grunt = require('grunt');
function getFiles(type) {
var files = {};
@ -27,5 +28,12 @@ module.exports = function generateRawFilesJs(banner) {
banner = '';
}
var files = banner + getFiles('js') + getFiles('less') + getFiles('fonts');
fs.writeFileSync('docs/assets/js/raw-files.min.js', files);
var rawFilesJs = 'docs/assets/js/raw-files.min.js';
try {
fs.writeFileSync(rawFilesJs, files);
}
catch (err) {
grunt.fail.warn(err);
}
grunt.log.writeln('File ' + rawFilesJs.cyan + ' created.');
};

11
js/.jscs.json → js/.jscsrc
View File

@ -1,15 +1,22 @@
{
"disallowEmptyBlocks": true,
"disallowKeywords": ["with"],
"requireLeftStickedOperators": [","],
"disallowLeftStickedOperators": ["?", "+", "-", "/", "*", "=", "==", "===", "!=", "!==", ">", ">=", "<", "<="],
"disallowMixedSpacesAndTabs": true,
"disallowMultipleLineStrings": true,
"disallowRightStickedOperators": ["?", "/", "*", ":", "=", "==", "===", "!=", "!==", ">", ">=", "<", "<="],
"disallowSpaceAfterPrefixUnaryOperators": ["++", "--", "+", "-", "~"],
"disallowSpaceBeforePostfixUnaryOperators": ["++", "--"],
"disallowTrailingWhitespace": true,
"requireCamelCaseOrUpperCaseIdentifiers": true,
"requireLeftStickedOperators": [","],
"requireLineFeedAtFileEnd": true,
"requireRightStickedOperators": ["!"],
"requireSpaceAfterBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!=="],
"requireSpaceAfterKeywords": ["if", "else", "for", "while", "do", "switch", "return", "try", "catch"],
"requireSpaceBeforeBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!=="],
"requireSpacesInFunctionExpression": { "beforeOpeningCurlyBrace": true },
"validateLineBreaks": "LF"
"validateIndentation": 2,
"validateLineBreaks": "LF",
"validateQuoteMarks": "'"
}

4
js/.jshintrc
View File

@ -2,13 +2,11 @@
"asi" : true,
"boss" : true,
"browser" : true,
"curly" : false,
"debug" : true,
"devel" : true,
"eqeqeq" : false,
"eqnull" : true,
"expr" : true,
"laxbreak" : true,
"quotmark" : "single",
"validthis": true
}
}

2
js/affix.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: affix.js v3.1.0
* Bootstrap: affix.js v3.1.1
* http://getbootstrap.com/javascript/#affix
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

2
js/alert.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: alert.js v3.1.0
* Bootstrap: alert.js v3.1.1
* http://getbootstrap.com/javascript/#alerts
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

2
js/button.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: button.js v3.1.0
* Bootstrap: button.js v3.1.1
* http://getbootstrap.com/javascript/#buttons
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

2
js/carousel.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: carousel.js v3.1.0
* Bootstrap: carousel.js v3.1.1
* http://getbootstrap.com/javascript/#carousel
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

6
js/collapse.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: collapse.js v3.1.0
* Bootstrap: collapse.js v3.1.1
* http://getbootstrap.com/javascript/#collapse
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -148,7 +148,7 @@
// COLLAPSE DATA-API
// =================
$(document).on('click.bs.collapse.data-api', '[data-toggle=collapse]', function (e) {
$(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (e) {
var $this = $(this), href
var target = $this.attr('data-target')
|| e.preventDefault()
@ -160,7 +160,7 @@
var $parent = parent && $(parent)
if (!data || !data.transitioning) {
if ($parent) $parent.find('[data-toggle=collapse][data-parent="' + parent + '"]').not($this).addClass('collapsed')
if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed')
$this[$target.hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
}

16
js/dropdown.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: dropdown.js v3.1.0
* Bootstrap: dropdown.js v3.1.1
* http://getbootstrap.com/javascript/#dropdowns
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -14,7 +14,7 @@
// =========================
var backdrop = '.dropdown-backdrop'
var toggle = '[data-toggle=dropdown]'
var toggle = '[data-toggle="dropdown"]'
var Dropdown = function (element) {
$(element).on('click.bs.dropdown', this.toggle)
}
@ -44,7 +44,7 @@
.toggleClass('open')
.trigger('shown.bs.dropdown', relatedTarget)
$this.focus()
$this.trigger('focus')
}
return false
@ -64,12 +64,12 @@
var isActive = $parent.hasClass('open')
if (!isActive || (isActive && e.keyCode == 27)) {
if (e.which == 27) $parent.find(toggle).focus()
return $this.click()
if (e.which == 27) $parent.find(toggle).trigger('focus')
return $this.trigger('click')
}
var desc = ' li:not(.divider):visible a'
var $items = $parent.find('[role=menu]' + desc + ', [role=listbox]' + desc)
var $items = $parent.find('[role="menu"]' + desc + ', [role="listbox"]' + desc)
if (!$items.length) return
@ -79,7 +79,7 @@
if (e.keyCode == 40 && index < $items.length - 1) index++ // down
if (!~index) index = 0
$items.eq(index).focus()
$items.eq(index).trigger('focus')
}
function clearMenus(e) {
@ -142,6 +142,6 @@
.on('click.bs.dropdown.data-api', clearMenus)
.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
.on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
.on('keydown.bs.dropdown.data-api', toggle + ', [role=menu], [role=listbox]', Dropdown.prototype.keydown)
.on('keydown.bs.dropdown.data-api', toggle + ', [role="menu"], [role="listbox"]', Dropdown.prototype.keydown)
}(jQuery);

10
js/modal.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: modal.js v3.1.0
* Bootstrap: modal.js v3.1.1
* http://getbootstrap.com/javascript/#modals
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.
@ -78,10 +78,10 @@
transition ?
that.$element.find('.modal-dialog') // wait for modal to slide in
.one($.support.transition.end, function () {
that.$element.focus().trigger(e)
that.$element.trigger('focus').trigger(e)
})
.emulateTransitionEnd(300) :
that.$element.focus().trigger(e)
that.$element.trigger('focus').trigger(e)
})
}
@ -117,7 +117,7 @@
.off('focusin.bs.modal') // guard against infinite focus loop
.on('focusin.bs.modal', $.proxy(function (e) {
if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {
this.$element.focus()
this.$element.trigger('focus')
}
}, this))
}
@ -232,7 +232,7 @@
$target
.modal(option, this)
.one('hide', function () {
$this.is(':visible') && $this.focus()
$this.is(':visible') && $this.trigger('focus')
})
})

2
js/popover.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: popover.js v3.1.0
* Bootstrap: popover.js v3.1.1
* http://getbootstrap.com/javascript/#popovers
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

2
js/scrollspy.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: scrollspy.js v3.1.0
* Bootstrap: scrollspy.js v3.1.1
* http://getbootstrap.com/javascript/#scrollspy
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

2
js/tab.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: tab.js v3.1.0
* Bootstrap: tab.js v3.1.1
* http://getbootstrap.com/javascript/#tabs
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

37
js/tests/index.html
View File

@ -3,20 +3,44 @@
<head>
<title>Bootstrap Plugin Test Suite</title>
<!-- jquery -->
<!-- jQuery -->
<script src="vendor/jquery.js"></script>
<!-- qunit -->
<!-- QUnit -->
<link rel="stylesheet" href="vendor/qunit.css" media="screen">
<script src="vendor/qunit.js"></script>
<script>
// See https://github.com/axemclion/grunt-saucelabs#test-result-details-with-qunit
QUnit.done(function(results) {
window.global_test_results = results
var log = []
QUnit.done = function (test_results) {
var tests = log.map(function (details) {
return {
name: details.name,
result: details.result,
expected: details.expected,
actual: details.actual,
source: details.source
}
})
test_results.tests = tests
// Delaying results a bit because in real-world scenario you won't get them immediately
setTimeout(function () {
window.global_test_results = test_results
}, 2000)
}
QUnit.testStart(function (testDetails) {
QUnit.log = function (details) {
if (!details.result) {
details.name = testDetails.name
log.push(details)
}
}
})
</script>
<!-- plugin sources -->
<!-- Plugin sources -->
<script>$.support.transition = false</script>
<script src="../../js/alert.js"></script>
<script src="../../js/button.js"></script>
@ -30,8 +54,7 @@
<script src="../../js/popover.js"></script>
<script src="../../js/affix.js"></script>
<!-- unit tests -->
<script src="unit/transition.js"></script>
<!-- Unit tests -->
<script src="unit/alert.js"></script>
<script src="unit/button.js"></script>
<script src="unit/carousel.js"></script>

88
js/tests/unit/affix.js
View File

@ -1,50 +1,50 @@
$(function () {
module('affix')
module('affix')
test('should provide no conflict', function () {
var affix = $.fn.affix.noConflict()
ok(!$.fn.affix, 'affix was set back to undefined (org value)')
$.fn.affix = affix
test('should provide no conflict', function () {
var affix = $.fn.affix.noConflict()
ok(!$.fn.affix, 'affix was set back to undefined (org value)')
$.fn.affix = affix
})
test('should be defined on jquery object', function () {
ok($(document.body).affix, 'affix method is defined')
})
test('should return element', function () {
ok($(document.body).affix()[0] == document.body, 'document.body returned')
})
test('should exit early if element is not visible', function () {
var $affix = $('<div style="display: none"></div>').affix()
$affix.data('bs.affix').checkPosition()
ok(!$affix.hasClass('affix'), 'affix class was not added')
})
test('should trigger affixed event after affix', function () {
stop()
var template = $('<div id="affixTarget"><ul><li>Please affix</li><li>And unaffix</li></ul></div><div id="affixAfter" style="height: 20000px; display:block;"></div>')
template.appendTo('body')
var affixer = $('#affixTarget').affix({
offset: $('#affixTarget ul').position()
})
$('#affixTarget')
.on('affix.bs.affix', function (e) {
ok(true, 'affix event triggered')
}).on('affixed.bs.affix', function (e) {
ok(true,'affixed event triggered')
$('#affixTarget').remove()
$('#affixAfter').remove()
start()
})
test('should be defined on jquery object', function () {
ok($(document.body).affix, 'affix method is defined')
})
test('should return element', function () {
ok($(document.body).affix()[0] == document.body, 'document.body returned')
})
test('should exit early if element is not visible', function () {
var $affix = $('<div style="display: none"></div>').affix()
$affix.data('bs.affix').checkPosition()
ok(!$affix.hasClass('affix'), 'affix class was not added')
})
test('should trigger affixed event after affix', function () {
stop()
var template = $('<div id="affixTarget"><ul><li>Please affix</li><li>And unaffix</li></ul></div><div id="affixAfter" style="height: 20000px; display:block;"></div>')
template.appendTo('body')
var affixer = $('#affixTarget').affix({
offset: $('#affixTarget ul').position()
})
$('#affixTarget')
.on('affix.bs.affix', function (e) {
ok(true, 'affix event triggered')
}).on('affixed.bs.affix', function (e) {
ok(true,'affixed event triggered')
$('#affixTarget').remove()
$('#affixAfter').remove()
start()
})
setTimeout(function () {
window.scrollTo(0, document.body.scrollHeight)
setTimeout(function () { window.scroll(0,0) }, 0)
},0)
})
setTimeout(function () {
window.scrollTo(0, document.body.scrollHeight)
setTimeout(function () { window.scroll(0,0) }, 0)
},0)
})
})

110
js/tests/unit/alert.js
View File

@ -1,62 +1,62 @@
$(function () {
module('alert')
module('alert')
test('should provide no conflict', function () {
var alert = $.fn.alert.noConflict()
ok(!$.fn.alert, 'alert was set back to undefined (org value)')
$.fn.alert = alert
test('should provide no conflict', function () {
var alert = $.fn.alert.noConflict()
ok(!$.fn.alert, 'alert was set back to undefined (org value)')
$.fn.alert = alert
})
test('should be defined on jquery object', function () {
ok($(document.body).alert, 'alert method is defined')
})
test('should return element', function () {
ok($(document.body).alert()[0] == document.body, 'document.body returned')
})
test('should fade element out on clicking .close', function () {
var alertHTML = '<div class="alert-message warning fade in">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
'</div>',
alert = $(alertHTML).alert()
alert.find('.close').click()
ok(!alert.hasClass('in'), 'remove .in class on .close click')
})
test('should remove element when clicking .close', function () {
$.support.transition = false
var alertHTML = '<div class="alert-message warning fade in">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
'</div>',
alert = $(alertHTML).appendTo('#qunit-fixture').alert()
ok($('#qunit-fixture').find('.alert-message').length, 'element added to dom')
alert.find('.close').click()
ok(!$('#qunit-fixture').find('.alert-message').length, 'element removed from dom')
})
test('should not fire closed when close is prevented', function () {
$.support.transition = false
stop()
$('<div class="alert"/>')
.on('close.bs.alert', function (e) {
e.preventDefault()
ok(true)
start()
})
test('should be defined on jquery object', function () {
ok($(document.body).alert, 'alert method is defined')
})
test('should return element', function () {
ok($(document.body).alert()[0] == document.body, 'document.body returned')
})
test('should fade element out on clicking .close', function () {
var alertHTML = '<div class="alert-message warning fade in">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
'</div>',
alert = $(alertHTML).alert()
alert.find('.close').click()
ok(!alert.hasClass('in'), 'remove .in class on .close click')
})
test('should remove element when clicking .close', function () {
$.support.transition = false
var alertHTML = '<div class="alert-message warning fade in">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
'</div>',
alert = $(alertHTML).appendTo('#qunit-fixture').alert()
ok($('#qunit-fixture').find('.alert-message').length, 'element added to dom')
alert.find('.close').click()
ok(!$('#qunit-fixture').find('.alert-message').length, 'element removed from dom')
})
test('should not fire closed when close is prevented', function () {
$.support.transition = false
stop();
$('<div class="alert"/>')
.on('close.bs.alert', function (e) {
e.preventDefault();
ok(true);
start();
})
.on('closed.bs.alert', function () {
ok(false);
})
.alert('close')
.on('closed.bs.alert', function () {
ok(false)
})
.alert('close')
})
})

206
js/tests/unit/button.js
View File

@ -1,122 +1,122 @@
$(function () {
module('button')
module('button')
test('should provide no conflict', function () {
var button = $.fn.button.noConflict()
ok(!$.fn.button, 'button was set back to undefined (org value)')
$.fn.button = button
})
test('should provide no conflict', function () {
var button = $.fn.button.noConflict()
ok(!$.fn.button, 'button was set back to undefined (org value)')
$.fn.button = button
})
test('should be defined on jquery object', function () {
ok($(document.body).button, 'button method is defined')
})
test('should be defined on jquery object', function () {
ok($(document.body).button, 'button method is defined')
})
test('should return element', function () {
ok($(document.body).button()[0] == document.body, 'document.body returned')
})
test('should return element', function () {
ok($(document.body).button()[0] == document.body, 'document.body returned')
})
test('should return set state to loading', function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal(btn.html(), 'mdo', 'btn text equals mdo')
btn.button('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
start()
}, 0)
})
test('should return set state to loading', function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal(btn.html(), 'mdo', 'btn text equals mdo')
btn.button('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
start()
}, 0)
})
test('should return reset state', function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal(btn.html(), 'mdo', 'btn text equals mdo')
btn.button('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
start()
stop()
btn.button('reset')
equal(btn.html(), 'mdo', 'btn text equals mdo')
setTimeout(function () {
ok(!btn.attr('disabled'), 'btn is not disabled')
ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
start()
}, 0)
}, 0)
test('should return reset state', function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal(btn.html(), 'mdo', 'btn text equals mdo')
btn.button('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
start()
stop()
btn.button('reset')
equal(btn.html(), 'mdo', 'btn text equals mdo')
setTimeout(function () {
ok(!btn.attr('disabled'), 'btn is not disabled')
ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
start()
}, 0)
}, 0)
})
})
test('should toggle active', function () {
var btn = $('<button class="btn">mdo</button>')
ok(!btn.hasClass('active'), 'btn does not have active class')
btn.button('toggle')
ok(btn.hasClass('active'), 'btn has class active')
})
test('should toggle active', function () {
var btn = $('<button class="btn">mdo</button>')
ok(!btn.hasClass('active'), 'btn does not have active class')
btn.button('toggle')
ok(btn.hasClass('active'), 'btn has class active')
})
test('should toggle active when btn children are clicked', function () {
var btn = $('<button class="btn" data-toggle="button">mdo</button>'),
inner = $('<i></i>')
btn
.append(inner)
.appendTo($('#qunit-fixture'))
ok(!btn.hasClass('active'), 'btn does not have active class')
inner.click()
ok(btn.hasClass('active'), 'btn has class active')
})
test('should toggle active when btn children are clicked', function () {
var btn = $('<button class="btn" data-toggle="button">mdo</button>'),
inner = $('<i></i>')
btn
.append(inner)
.appendTo($('#qunit-fixture'))
ok(!btn.hasClass('active'), 'btn does not have active class')
inner.click()
ok(btn.hasClass('active'), 'btn has class active')
})
test('should toggle active when btn children are clicked within btn-group', function () {
var btngroup = $('<div class="btn-group" data-toggle="buttons"></div>'),
btn = $('<button class="btn">fat</button>'),
inner = $('<i></i>')
btngroup
.append(btn.append(inner))
.appendTo($('#qunit-fixture'))
ok(!btn.hasClass('active'), 'btn does not have active class')
inner.click()
ok(btn.hasClass('active'), 'btn has class active')
})
test('should toggle active when btn children are clicked within btn-group', function () {
var btngroup = $('<div class="btn-group" data-toggle="buttons"></div>'),
btn = $('<button class="btn">fat</button>'),
inner = $('<i></i>')
btngroup
.append(btn.append(inner))
.appendTo($('#qunit-fixture'))
ok(!btn.hasClass('active'), 'btn does not have active class')
inner.click()
ok(btn.hasClass('active'), 'btn has class active')
})
test('should check for closest matching toggle', function () {
var group = '<div class="btn-group" data-toggle="buttons">' +
'<label class="btn btn-primary active">' +
'<input type="radio" name="options" id="option1" checked="true"> Option 1' +
'</label>' +
'<label class="btn btn-primary">' +
'<input type="radio" name="options" id="option2"> Option 2' +
'</label>' +
'<label class="btn btn-primary">' +
'<input type="radio" name="options" id="option3"> Option 3' +
'</label>' +
'</div>'
test('should check for closest matching toggle', function () {
var group = '<div class="btn-group" data-toggle="buttons">' +
'<label class="btn btn-primary active">' +
'<input type="radio" name="options" id="option1" checked="true"> Option 1' +
'</label>' +
'<label class="btn btn-primary">' +
'<input type="radio" name="options" id="option2"> Option 2' +
'</label>' +
'<label class="btn btn-primary">' +
'<input type="radio" name="options" id="option3"> Option 3' +
'</label>' +
'</div>'
group = $(group)
group = $(group)
var btn1 = $(group.children()[0])
var btn2 = $(group.children()[1])
var btn3 = $(group.children()[2])
var btn1 = $(group.children()[0])
var btn2 = $(group.children()[1])
var btn3 = $(group.children()[2])
group.appendTo($('#qunit-fixture'))
group.appendTo($('#qunit-fixture'))
ok(btn1.hasClass('active'), 'btn1 has active class')
ok(btn1.find('input').prop('checked'), 'btn1 is checked')
ok(!btn2.hasClass('active'), 'btn2 does not have active class')
ok(!btn2.find('input').prop('checked'), 'btn2 is not checked')
btn2.find('input').click()
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
ok(btn2.hasClass('active'), 'btn2 has active class')
ok(btn2.find('input').prop('checked'), 'btn2 is checked')
ok(btn1.hasClass('active'), 'btn1 has active class')
ok(btn1.find('input').prop('checked'), 'btn1 is checked')
ok(!btn2.hasClass('active'), 'btn2 does not have active class')
ok(!btn2.find('input').prop('checked'), 'btn2 is not checked')
btn2.find('input').click()
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
ok(btn2.hasClass('active'), 'btn2 has active class')
ok(btn2.find('input').prop('checked'), 'btn2 is checked')
btn2.find('input').click() /* clicking an already checked radio should not un-check it */
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
ok(btn2.hasClass('active'), 'btn2 has active class')
ok(btn2.find('input').prop('checked'), 'btn2 is checked')
})
btn2.find('input').click() /* clicking an already checked radio should not un-check it */
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
ok(btn2.hasClass('active'), 'btn2 has active class')
ok(btn2.find('input').prop('checked'), 'btn2 is checked')
})
})

192
js/tests/unit/carousel.js
View File

@ -1,110 +1,110 @@
$(function () {
module('carousel')
module('carousel')
test('should provide no conflict', function () {
var carousel = $.fn.carousel.noConflict()
ok(!$.fn.carousel, 'carousel was set back to undefined (org value)')
$.fn.carousel = carousel
test('should provide no conflict', function () {
var carousel = $.fn.carousel.noConflict()
ok(!$.fn.carousel, 'carousel was set back to undefined (org value)')
$.fn.carousel = carousel
})
test('should be defined on jquery object', function () {
ok($(document.body).carousel, 'carousel method is defined')
})
test('should return element', function () {
ok($(document.body).carousel()[0] == document.body, 'document.body returned')
})
test('should not fire slide when slide is prevented', function () {
$.support.transition = false
stop()
$('<div class="carousel"/>')
.on('slide.bs.carousel', function (e) {
e.preventDefault()
ok(true)
start()
})
test('should be defined on jquery object', function () {
ok($(document.body).carousel, 'carousel method is defined')
.on('slid.bs.carousel', function () {
ok(false)
})
.carousel('next')
})
test('should return element', function () {
ok($(document.body).carousel()[0] == document.body, 'document.body returned')
})
test('should not fire slide when slide is prevented', function () {
$.support.transition = false
stop()
$('<div class="carousel"/>')
.on('slide.bs.carousel', function (e) {
e.preventDefault();
ok(true);
start();
})
.on('slid.bs.carousel', function () {
ok(false);
})
.carousel('next')
})
test('should reset when slide is prevented', function () {
var template = '<div id="carousel-example-generic" class="carousel slide"><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li></ol><div class="carousel-inner"><div class="item active"><div class="carousel-caption"></div></div><div class="item"><div class="carousel-caption"></div></div><div class="item"><div class="carousel-caption"></div></div></div><a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"></a><a class="right carousel-control" href="#carousel-example-generic" data-slide="next"></a></div>'
var $carousel = $(template)
$.support.transition = false
stop()
$carousel.one('slide.bs.carousel', function (e) {
e.preventDefault()
setTimeout(function () {
ok($carousel.find('.item:eq(0)').is('.active'))
ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'))
$carousel.carousel('next')
}, 1);
})
$carousel.one('slid.bs.carousel', function () {
setTimeout(function () {
ok($carousel.find('.item:eq(1)').is('.active'))
ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'))
start()
}, 1);
})
test('should reset when slide is prevented', function () {
var template = '<div id="carousel-example-generic" class="carousel slide"><ol class="carousel-indicators"><li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li><li data-target="#carousel-example-generic" data-slide-to="1"></li><li data-target="#carousel-example-generic" data-slide-to="2"></li></ol><div class="carousel-inner"><div class="item active"><div class="carousel-caption"></div></div><div class="item"><div class="carousel-caption"></div></div><div class="item"><div class="carousel-caption"></div></div></div><a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"></a><a class="right carousel-control" href="#carousel-example-generic" data-slide="next"></a></div>'
var $carousel = $(template)
$.support.transition = false
stop()
$carousel.one('slide.bs.carousel', function (e) {
e.preventDefault()
setTimeout(function () {
ok($carousel.find('.item:eq(0)').is('.active'))
ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'))
$carousel.carousel('next')
}, 1)
})
$carousel.one('slid.bs.carousel', function () {
setTimeout(function () {
ok($carousel.find('.item:eq(1)').is('.active'))
ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'))
start()
}, 1)
})
$carousel.carousel('next')
})
test('should fire slide event with direction', function () {
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><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></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a><a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a></div>'
$.support.transition = false
stop()
$(template).on('slide.bs.carousel', function (e) {
e.preventDefault()
ok(e.direction)
ok(e.direction === 'right' || e.direction === 'left')
start()
}).carousel('next')
})
test('should fire slide event with relatedTarget', function () {
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><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></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a><a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a></div>'
$.support.transition = false
stop()
$(template)
.on('slide.bs.carousel', function (e) {
e.preventDefault()
ok(e.relatedTarget)
ok($(e.relatedTarget).hasClass('item'))
start()
})
.carousel('next')
})
test('should fire slide event with direction', function () {
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><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></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a><a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a></div>'
$.support.transition = false
stop()
$(template).on('slide.bs.carousel', function (e) {
e.preventDefault()
ok(e.direction)
ok(e.direction === 'right' || e.direction === 'left')
start()
}).carousel('next')
})
test('should set interval from data attribute', 4, function () {
var template = $('<div id="myCarousel" class="carousel slide"> <div class="carousel-inner"> <div class="item active"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}First Thumbnail label{{/i}}</h4> <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> </div> </div> <div class="item"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}Second Thumbnail label{{/i}}</h4> <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> </div> </div> <div class="item"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}Third Thumbnail label{{/i}}</h4> <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> </div> </div> </div> <a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a> <a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a> </div>')
template.attr('data-interval', 1814)
test('should fire slide event with relatedTarget', function () {
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><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></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><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></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a><a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a></div>'
$.support.transition = false
stop()
$(template)
.on('slide.bs.carousel', function (e) {
e.preventDefault();
ok(e.relatedTarget);
ok($(e.relatedTarget).hasClass('item'));
start();
})
.carousel('next')
})
template.appendTo('body')
$('[data-slide]').first().click()
ok($('#myCarousel').data('bs.carousel').options.interval == 1814)
$('#myCarousel').remove()
test('should set interval from data attribute', 4, function () {
var template = $('<div id="myCarousel" class="carousel slide"> <div class="carousel-inner"> <div class="item active"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}First Thumbnail label{{/i}}</h4> <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> </div> </div> <div class="item"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}Second Thumbnail label{{/i}}</h4> <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> </div> </div> <div class="item"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}Third Thumbnail label{{/i}}</h4> <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> </div> </div> </div> <a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a> <a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a> </div>');
template.attr('data-interval', 1814);
template.appendTo('body').attr('data-modal', 'foobar')
$('[data-slide]').first().click()
ok($('#myCarousel').data('bs.carousel').options.interval == 1814, 'even if there is an data-modal attribute set')
$('#myCarousel').remove()
template.appendTo('body');
$('[data-slide]').first().click();
ok($('#myCarousel').data('bs.carousel').options.interval == 1814);
$('#myCarousel').remove();
template.appendTo('body')
$('[data-slide]').first().click()
$('#myCarousel').attr('data-interval', 1860)
$('[data-slide]').first().click()
ok($('#myCarousel').data('bs.carousel').options.interval == 1814, 'attributes should be read only on intitialization')
$('#myCarousel').remove()
template.appendTo('body').attr('data-modal', 'foobar');
$('[data-slide]').first().click();
ok($('#myCarousel').data('bs.carousel').options.interval == 1814, 'even if there is an data-modal attribute set');
$('#myCarousel').remove();
template.appendTo('body');
$('[data-slide]').first().click();
$('#myCarousel').attr('data-interval', 1860);
$('[data-slide]').first().click();
ok($('#myCarousel').data('bs.carousel').options.interval == 1814, 'attributes should be read only on intitialization');
$('#myCarousel').remove();
template.attr('data-interval', false);
template.appendTo('body');
$('#myCarousel').carousel(1);
ok($('#myCarousel').data('bs.carousel').options.interval === false, 'data attribute has higher priority than default options');
$('#myCarousel').remove();
})
template.attr('data-interval', false)
template.appendTo('body')
$('#myCarousel').carousel(1)
ok($('#myCarousel').data('bs.carousel').options.interval === false, 'data attribute has higher priority than default options')
$('#myCarousel').remove()
})
})

302
js/tests/unit/collapse.js
View File

@ -1,164 +1,164 @@
$(function () {
module('collapse')
module('collapse')
test('should provide no conflict', function () {
var collapse = $.fn.collapse.noConflict()
ok(!$.fn.collapse, 'collapse was set back to undefined (org value)')
$.fn.collapse = collapse
test('should provide no conflict', function () {
var collapse = $.fn.collapse.noConflict()
ok(!$.fn.collapse, 'collapse was set back to undefined (org value)')
$.fn.collapse = collapse
})
test('should be defined on jquery object', function () {
ok($(document.body).collapse, 'collapse method is defined')
})
test('should return element', function () {
ok($(document.body).collapse()[0] == document.body, 'document.body returned')
})
test('should show a collapsed element', function () {
var el = $('<div class="collapse"></div>').collapse('show')
ok(el.hasClass('in'), 'has class in')
ok(/height/.test(el.attr('style')), 'has height set')
})
test('should hide a collapsed element', function () {
var el = $('<div class="collapse"></div>').collapse('hide')
ok(!el.hasClass('in'), 'does not have class in')
ok(/height/.test(el.attr('style')), 'has height set')
})
test('should not fire shown when show is prevented', function () {
$.support.transition = false
stop()
$('<div class="collapse"/>')
.on('show.bs.collapse', function (e) {
e.preventDefault()
ok(true)
start()
})
.on('shown.bs.collapse', function () {
ok(false)
})
.collapse('show')
})
test('should reset style to auto after finishing opening collapse', function () {
$.support.transition = false
stop()
$('<div class="collapse" style="height: 0px"/>')
.on('show.bs.collapse', function () {
ok(this.style.height == '0px')
})
.on('shown.bs.collapse', function () {
ok(this.style.height == 'auto')
start()
})
.collapse('show')
})
test('should add active class to target when collapse shown', function () {
$.support.transition = false
stop()
var target = $('<a data-toggle="collapse" href="#test1"></a>')
.appendTo($('#qunit-fixture'))
var collapsible = $('<div id="test1"></div>')
.appendTo($('#qunit-fixture'))
.on('show.bs.collapse', function () {
ok(!target.hasClass('collapsed'))
start()
})
test('should be defined on jquery object', function () {
ok($(document.body).collapse, 'collapse method is defined')
target.click()
})
test('should remove active class to target when collapse hidden', function () {
$.support.transition = false
stop()
var target = $('<a data-toggle="collapse" href="#test1"></a>')
.appendTo($('#qunit-fixture'))
var collapsible = $('<div id="test1" class="in"></div>')
.appendTo($('#qunit-fixture'))
.on('hide.bs.collapse', function () {
ok(target.hasClass('collapsed'))
start()
})
test('should return element', function () {
ok($(document.body).collapse()[0] == document.body, 'document.body returned')
target.click()
})
test('should remove active class from inactive accordion targets', function () {
$.support.transition = false
stop()
var accordion = $('<div id="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
.appendTo($('#qunit-fixture'))
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var collapsible1 = $('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var collapsible2 = $('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var collapsible3 = $('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
start()
})
test('should show a collapsed element', function () {
var el = $('<div class="collapse"></div>').collapse('show')
ok(el.hasClass('in'), 'has class in')
ok(/height/.test(el.attr('style')), 'has height set')
target3.click()
})
test('should allow dots in data-parent', function () {
$.support.transition = false
stop()
var accordion = $('<div class="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
.appendTo($('#qunit-fixture'))
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var collapsible1 = $('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var collapsible2 = $('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var collapsible3 = $('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
start()
})
test('should hide a collapsed element', function () {
var el = $('<div class="collapse"></div>').collapse('hide')
ok(!el.hasClass('in'), 'does not have class in')
ok(/height/.test(el.attr('style')), 'has height set')
})
test('should not fire shown when show is prevented', function () {
$.support.transition = false
stop()
$('<div class="collapse"/>')
.on('show.bs.collapse', function (e) {
e.preventDefault();
ok(true);
start();
})
.on('shown.bs.collapse', function () {
ok(false);
})
.collapse('show')
})
test('should reset style to auto after finishing opening collapse', function () {
$.support.transition = false
stop()
$('<div class="collapse" style="height: 0px"/>')
.on('show.bs.collapse', function () {
ok(this.style.height == '0px')
})
.on('shown.bs.collapse', function () {
ok(this.style.height == 'auto')
start()
})
.collapse('show')
})
test('should add active class to target when collapse shown', function () {
$.support.transition = false
stop()
var target = $('<a data-toggle="collapse" href="#test1"></a>')
.appendTo($('#qunit-fixture'))
var collapsible = $('<div id="test1"></div>')
.appendTo($('#qunit-fixture'))
.on('show.bs.collapse', function () {
ok(!target.hasClass('collapsed'))
start()
})
target.click()
})
test('should remove active class to target when collapse hidden', function () {
$.support.transition = false
stop()
var target = $('<a data-toggle="collapse" href="#test1"></a>')
.appendTo($('#qunit-fixture'))
var collapsible = $('<div id="test1" class="in"></div>')
.appendTo($('#qunit-fixture'))
.on('hide.bs.collapse', function () {
ok(target.hasClass('collapsed'))
start()
})
target.click()
})
test('should remove active class from inactive accordion targets', function () {
$.support.transition = false
stop()
var accordion = $('<div id="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
.appendTo($('#qunit-fixture'))
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var collapsible1 = $('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var collapsible2 = $('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var collapsible3 = $('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
start()
})
target3.click()
})
test('should allow dots in data-parent', function () {
$.support.transition = false
stop()
var accordion = $('<div class="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
.appendTo($('#qunit-fixture'))
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var collapsible1 = $('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var collapsible2 = $('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var collapsible3 = $('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
start()
})
target3.click()
})
target3.click()
})
})

418
js/tests/unit/dropdown.js
View File

@ -1,218 +1,218 @@
$(function () {
module('dropdowns')
module('dropdowns')
test('should provide no conflict', function () {
var dropdown = $.fn.dropdown.noConflict()
ok(!$.fn.dropdown, 'dropdown was set back to undefined (org value)')
$.fn.dropdown = dropdown
test('should provide no conflict', function () {
var dropdown = $.fn.dropdown.noConflict()
ok(!$.fn.dropdown, 'dropdown was set back to undefined (org value)')
$.fn.dropdown = dropdown
})
test('should be defined on jquery object', function () {
ok($(document.body).dropdown, 'dropdown method is defined')
})
test('should return element', function () {
var el = $('<div />')
ok(el.dropdown()[0] === el[0], 'same element returned')
})
test('should not open dropdown if target is disabled', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<button disabled href="#" class="btn dropdown-toggle" data-toggle="dropdown">Dropdown</button>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should not open dropdown if target is disabled', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<button href="#" class="btn dropdown-toggle disabled" data-toggle="dropdown">Dropdown</button>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should add class open to menu if clicked', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should test if element has a # before assuming it\'s a selector', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="/foo/" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should remove open class if body clicked', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML)
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
.click()
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
$('body').click()
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class removed')
dropdown.remove()
})
test('should remove open class if body clicked, with multiple drop downs', function () {
var dropdownHTML = '<ul class="nav">' +
' <li><a href="#menu1">Menu 1</a></li>' +
' <li class="dropdown" id="testmenu">' +
' <a class="dropdown-toggle" data-toggle="dropdown" href="#testmenu">Test menu <b class="caret"></b></a>' +
' <ul class="dropdown-menu" role="menu">' +
' <li><a href="#sub1">Submenu 1</a></li>' +
' </ul>' +
' </li>' +
'</ul>' +
'<div class="btn-group">' +
' <button class="btn">Actions</button>' +
' <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>' +
' <ul class="dropdown-menu">' +
' <li><a href="#">Action 1</a></li>' +
' </ul>' +
'</div>',
dropdowns = $(dropdownHTML).appendTo('#qunit-fixture').find('[data-toggle="dropdown"]'),
first = dropdowns.first(),
last = dropdowns.last()
ok(dropdowns.length == 2, 'Should be two dropdowns')
first.click()
ok(first.parents('.open').length == 1, 'open class added on click')
ok($('#qunit-fixture .open').length == 1, 'only one object is open')
$('body').click()
ok($('#qunit-fixture .open').length === 0, 'open class removed')
last.click()
ok(last.parent('.open').length == 1, 'open class added on click')
ok($('#qunit-fixture .open').length == 1, 'only one object is open')
$('body').click()
ok($('#qunit-fixture .open').length === 0, 'open class removed')
$('#qunit-fixture').html('')
})
test('should fire show and hide event', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML)
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
stop()
dropdown
.parent('.dropdown')
.bind('show.bs.dropdown', function () {
ok(true, 'show was called')
})
.bind('hide.bs.dropdown', function () {
ok(true, 'hide was called')
start()
})
test('should be defined on jquery object', function () {
ok($(document.body).dropdown, 'dropdown method is defined')
dropdown.click()
$(document.body).click()
})
test('should fire shown and hiden event', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML)
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
stop()
dropdown
.parent('.dropdown')
.bind('shown.bs.dropdown', function () {
ok(true, 'show was called')
})
.bind('hidden.bs.dropdown', function () {
ok(true, 'hide was called')
start()
})
test('should return element', function () {
var el = $('<div />')
ok(el.dropdown()[0] === el[0], 'same element returned')
})
test('should not open dropdown if target is disabled', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<button disabled href="#" class="btn dropdown-toggle" data-toggle="dropdown">Dropdown</button>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should not open dropdown if target is disabled', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<button href="#" class="btn dropdown-toggle disabled" data-toggle="dropdown">Dropdown</button>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should add class open to menu if clicked', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should test if element has a # before assuming it\'s a selector', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="/foo/" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
})
test('should remove open class if body clicked', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML)
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
.click()
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
$('body').click()
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class removed')
dropdown.remove()
})
test('should remove open class if body clicked, with multiple drop downs', function () {
var dropdownHTML = '<ul class="nav">' +
' <li><a href="#menu1">Menu 1</a></li>' +
' <li class="dropdown" id="testmenu">' +
' <a class="dropdown-toggle" data-toggle="dropdown" href="#testmenu">Test menu <b class="caret"></b></a>' +
' <ul class="dropdown-menu" role="menu">' +
' <li><a href="#sub1">Submenu 1</a></li>' +
' </ul>' +
' </li>' +
'</ul>' +
'<div class="btn-group">' +
' <button class="btn">Actions</button>' +
' <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>' +
' <ul class="dropdown-menu">' +
' <li><a href="#">Action 1</a></li>' +
' </ul>' +
'</div>',
dropdowns = $(dropdownHTML).appendTo('#qunit-fixture').find('[data-toggle="dropdown"]'),
first = dropdowns.first(),
last = dropdowns.last()
ok(dropdowns.length == 2, 'Should be two dropdowns')
first.click()
ok(first.parents('.open').length == 1, 'open class added on click')
ok($('#qunit-fixture .open').length == 1, 'only one object is open')
$('body').click()
ok($('#qunit-fixture .open').length === 0, 'open class removed')
last.click()
ok(last.parent('.open').length == 1, 'open class added on click')
ok($('#qunit-fixture .open').length == 1, 'only one object is open')
$('body').click()
ok($('#qunit-fixture .open').length === 0, 'open class removed')
$('#qunit-fixture').html('')
})
test('should fire show and hide event', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML)
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
stop()
dropdown
.parent('.dropdown')
.bind('show.bs.dropdown', function () {
ok(true, 'show was called')
})
.bind('hide.bs.dropdown', function () {
ok(true, 'hide was called')
start()
})
dropdown.click()
$(document.body).click()
})
test('should fire shown and hiden event', function () {
var dropdownHTML = '<ul class="tabs">' +
'<li class="dropdown">' +
'<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#">Secondary link</a></li>' +
'<li><a href="#">Something else here</a></li>' +
'<li class="divider"></li>' +
'<li><a href="#">Another link</a></li>' +
'</ul>' +
'</li>' +
'</ul>',
dropdown = $(dropdownHTML)
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
stop()
dropdown
.parent('.dropdown')
.bind('shown.bs.dropdown', function () {
ok(true, 'show was called')
})
.bind('hidden.bs.dropdown', function () {
ok(true, 'hide was called')
start()
})
dropdown.click()
$(document.body).click()
})
dropdown.click()
$(document.body).click()
})
})

368
js/tests/unit/modal.js
View File

@ -2,194 +2,194 @@ $(function () {
module('modal')
test('should provide no conflict', function () {
var modal = $.fn.modal.noConflict()
ok(!$.fn.modal, 'modal was set back to undefined (org value)')
$.fn.modal = modal
})
test('should provide no conflict', function () {
var modal = $.fn.modal.noConflict()
ok(!$.fn.modal, 'modal was set back to undefined (org value)')
$.fn.modal = modal
})
test('should be defined on jquery object', function () {
var div = $('<div id="modal-test"></div>')
ok(div.modal, 'modal method is defined')
})
test('should be defined on jquery object', function () {
var div = $('<div id="modal-test"></div>')
ok(div.modal, 'modal method is defined')
})
test('should return element', function () {
var div = $('<div id="modal-test"></div>')
ok(div.modal() == div, 'document.body returned')
$('#modal-test').remove()
})
test('should return element', function () {
var div = $('<div id="modal-test"></div>')
ok(div.modal() == div, 'document.body returned')
$('#modal-test').remove()
})
test('should expose defaults var for settings', function () {
ok($.fn.modal.Constructor.DEFAULTS, 'default object exposed')
})
test('should expose defaults var for settings', function () {
ok($.fn.modal.Constructor.DEFAULTS, 'default object exposed')
})
test('should insert into dom when show method is called', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('shown.bs.modal', function () {
ok($('#modal-test').length, 'modal inserted into dom')
$(this).remove()
test('should insert into dom when show method is called', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('shown.bs.modal', function () {
ok($('#modal-test').length, 'modal inserted into dom')
$(this).remove()
start()
})
.modal('show')
})
test('should fire show event', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('show.bs.modal', function () {
ok(true, 'show was called')
})
.on('shown.bs.modal', function () {
$(this).remove()
start()
})
.modal('show')
})
test('should not fire shown when default prevented', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('show.bs.modal', function (e) {
e.preventDefault()
ok(true, 'show was called')
start()
})
.on('shown.bs.modal', function () {
ok(false, 'shown was called')
})
.modal('show')
})
test('should hide modal when hide is called', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
ok($('#modal-test').length, 'modal inserted into dom')
$(this).modal('hide')
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
$('#modal-test').remove()
start()
})
.modal('show')
})
test('should toggle when toggle is called', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"></div>')
div
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
ok($('#modal-test').length, 'modal inserted into dom')
div.modal('toggle')
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('toggle')
})
test('should remove from dom when click [data-dismiss=modal]', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"><span class="close" data-dismiss="modal"></span></div>')
div
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
ok($('#modal-test').length, 'modal inserted into dom')
div.find('.close').click()
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('toggle')
})
test('should allow modal close with "backdrop:false"', function () {
stop()
$.support.transition = false
var div = $('<div>', { id: 'modal-test', 'data-backdrop': false })
div
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
div.modal('hide')
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('show')
})
test('should close modal when clicking outside of modal-content', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"><div class="contents"></div></div>')
div
.bind('shown.bs.modal', function () {
ok($('#modal-test').length, 'modal insterted into dom')
$('.contents').click()
ok($('#modal-test').is(':visible'), 'modal visible')
$('#modal-test').click()
})
.bind('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('show')
})
test('should trigger hide event once when clicking outside of modal-content', function () {
stop()
$.support.transition = false
var triggered
var div = $('<div id="modal-test"><div class="contents"></div></div>')
div
.bind('shown.bs.modal', function () {
triggered = 0
$('#modal-test').click()
})
.bind('hide.bs.modal', function () {
triggered += 1
ok(triggered === 1, 'modal hide triggered once')
start()
})
.modal('show')
})
test('should close reopened modal with [data-dismiss=modal] click', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"></div></div></div>')
div
.bind('shown.bs.modal', function () {
$('#close').click()
ok(!$('#modal-test').is(':visible'), 'modal hidden')
})
.one('hidden.bs.modal', function () {
div.one('hidden.bs.modal', function () {
start()
})
.modal('show')
})
}).modal('show')
})
.modal('show')
test('should fire show event', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('show.bs.modal', function () {
ok(true, 'show was called')
})
.on('shown.bs.modal', function () {
$(this).remove()
start()
})
.modal('show')
})
test('should not fire shown when default prevented', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('show.bs.modal', function (e) {
e.preventDefault()
ok(true, 'show was called')
start()
})
.on('shown.bs.modal', function () {
ok(false, 'shown was called')
})
.modal('show')
})
test('should hide modal when hide is called', function () {
stop()
$.support.transition = false
$('<div id="modal-test"></div>')
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
ok($('#modal-test').length, 'modal inserted into dom')
$(this).modal('hide')
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
$('#modal-test').remove()
start()
})
.modal('show')
})
test('should toggle when toggle is called', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"></div>')
div
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
ok($('#modal-test').length, 'modal inserted into dom')
div.modal('toggle')
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('toggle')
})
test('should remove from dom when click [data-dismiss=modal]', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"><span class="close" data-dismiss="modal"></span></div>')
div
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
ok($('#modal-test').length, 'modal inserted into dom')
div.find('.close').click()
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('toggle')
})
test('should allow modal close with "backdrop:false"', function () {
stop()
$.support.transition = false
var div = $('<div>', { id: 'modal-test', 'data-backdrop': false })
div
.on('shown.bs.modal', function () {
ok($('#modal-test').is(':visible'), 'modal visible')
div.modal('hide')
})
.on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('show')
})
test('should close modal when clicking outside of modal-content', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"><div class="contents"></div></div>')
div
.bind('shown.bs.modal', function () {
ok($('#modal-test').length, 'modal insterted into dom')
$('.contents').click()
ok($('#modal-test').is(':visible'), 'modal visible')
$('#modal-test').click()
})
.bind('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove()
start()
})
.modal('show')
})
test('should trigger hide event once when clicking outside of modal-content', function () {
stop()
$.support.transition = false
var triggered
var div = $('<div id="modal-test"><div class="contents"></div></div>')
div
.bind('shown.bs.modal', function () {
triggered = 0
$('#modal-test').click()
})
.bind('hide.bs.modal', function () {
triggered += 1
ok(triggered === 1, 'modal hide triggered once')
start()
})
.modal('show')
})
test('should close reopened modal with [data-dismiss=modal] click', function () {
stop()
$.support.transition = false
var div = $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"></div></div></div>')
div
.bind('shown.bs.modal', function () {
$('#close').click()
ok(!$('#modal-test').is(':visible'), 'modal hidden')
})
.one('hidden.bs.modal', function () {
div.one('hidden.bs.modal', function () {
start()
}).modal('show')
})
.modal('show')
div.remove()
})
div.remove()
})
})

242
js/tests/unit/popover.js
View File

@ -1,133 +1,133 @@
$(function () {
module('popover')
module('popover')
test('should provide no conflict', function () {
var popover = $.fn.popover.noConflict()
ok(!$.fn.popover, 'popover was set back to undefined (org value)')
$.fn.popover = popover
test('should provide no conflict', function () {
var popover = $.fn.popover.noConflict()
ok(!$.fn.popover, 'popover was set back to undefined (org value)')
$.fn.popover = popover
})
test('should be defined on jquery object', function () {
var div = $('<div></div>')
ok(div.popover, 'popover method is defined')
})
test('should return element', function () {
var div = $('<div></div>')
ok(div.popover() == div, 'document.body returned')
})
test('should render popover element', function () {
$.support.transition = false
var popover = $('<a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>')
.appendTo('#qunit-fixture')
.popover('show')
ok($('.popover').length, 'popover was inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover removed')
})
test('should store popover instance in popover data object', function () {
$.support.transition = false
var popover = $('<a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>')
.popover()
ok(!!popover.data('bs.popover'), 'popover instance exists')
})
test('should get title and content from options', function () {
$.support.transition = false
var popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.popover({
title: function () {
return '@fat'
},
content: function () {
return 'loves writing tests （╯°□°）╯︵ ┻━┻'
}
})
test('should be defined on jquery object', function () {
var div = $('<div></div>')
ok(div.popover, 'popover method is defined')
popover.popover('show')
ok($('.popover').length, 'popover was inserted')
equal($('.popover .popover-title').text(), '@fat', 'title correctly inserted')
equal($('.popover .popover-content').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should get title and content from attributes', function () {
$.support.transition = false
var popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
.appendTo('#qunit-fixture')
.popover()
.popover('show')
ok($('.popover').length, 'popover was inserted')
equal($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
equal($('.popover .popover-content').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should get title and content from attributes #2', function () {
$.support.transition = false
var popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
.appendTo('#qunit-fixture')
.popover({
title: 'ignored title option',
content: 'ignored content option'
})
.popover('show')
ok($('.popover').length, 'popover was inserted')
equal($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
equal($('.popover .popover-content').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should respect custom classes', function () {
$.support.transition = false
var popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.popover({
title: 'Test',
content: 'Test',
template: '<div class="popover foobar"><div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div></div>'
})
test('should return element', function () {
var div = $('<div></div>')
ok(div.popover() == div, 'document.body returned')
})
popover.popover('show')
test('should render popover element', function () {
$.support.transition = false
var popover = $('<a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>')
.appendTo('#qunit-fixture')
.popover('show')
ok($('.popover').length, 'popover was inserted')
ok($('.popover').hasClass('foobar'), 'custom class is present')
ok($('.popover').length, 'popover was inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover removed')
})
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should store popover instance in popover data object', function () {
$.support.transition = false
var popover = $('<a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>')
.popover()
ok(!!popover.data('bs.popover'), 'popover instance exists')
})
test('should get title and content from options', function () {
$.support.transition = false
var popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.popover({
title: function () {
return '@fat'
},
content: function () {
return 'loves writing tests （╯°□°）╯︵ ┻━┻'
}
})
popover.popover('show')
ok($('.popover').length, 'popover was inserted')
equal($('.popover .popover-title').text(), '@fat', 'title correctly inserted')
equal($('.popover .popover-content').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should get title and content from attributes', function () {
$.support.transition = false
var popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
.appendTo('#qunit-fixture')
.popover()
.popover('show')
ok($('.popover').length, 'popover was inserted')
equal($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
equal($('.popover .popover-content').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should get title and content from attributes #2', function () {
$.support.transition = false
var popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
.appendTo('#qunit-fixture')
.popover({
title: 'ignored title option',
content: 'ignored content option'
})
.popover('show')
ok($('.popover').length, 'popover was inserted')
equal($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
equal($('.popover .popover-content').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should respect custom classes', function () {
$.support.transition = false
var popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.popover({
title: 'Test',
content: 'Test',
template: '<div class="popover foobar"><div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div></div>'
})
popover.popover('show')
ok($('.popover').length, 'popover was inserted')
ok($('.popover').hasClass('foobar'), 'custom class is present')
popover.popover('hide')
ok(!$('.popover').length, 'popover was removed')
$('#qunit-fixture').empty()
})
test('should destroy popover', function () {
var popover = $('<div/>').popover({trigger: 'hover'}).on('click.foo', function () {})
ok(popover.data('bs.popover'), 'popover has data')
ok($._data(popover[0], 'events').mouseover && $._data(popover[0], 'events').mouseout, 'popover has hover event')
ok($._data(popover[0], 'events').click[0].namespace == 'foo', 'popover has extra click.foo event')
popover.popover('show')
popover.popover('destroy')
ok(!popover.hasClass('in'), 'popover is hidden')
ok(!popover.data('popover'), 'popover does not have data')
ok($._data(popover[0],'events').click[0].namespace == 'foo', 'popover still has click.foo')
ok(!$._data(popover[0], 'events').mouseover && !$._data(popover[0], 'events').mouseout, 'popover does not have any events')
})
test('should destroy popover', function () {
var popover = $('<div/>').popover({trigger: 'hover'}).on('click.foo', function () {})
ok(popover.data('bs.popover'), 'popover has data')
ok($._data(popover[0], 'events').mouseover && $._data(popover[0], 'events').mouseout, 'popover has hover event')
ok($._data(popover[0], 'events').click[0].namespace == 'foo', 'popover has extra click.foo event')
popover.popover('show')
popover.popover('destroy')
ok(!popover.hasClass('in'), 'popover is hidden')
ok(!popover.data('popover'), 'popover does not have data')
ok($._data(popover[0],'events').click[0].namespace == 'foo', 'popover still has click.foo')
ok(!$._data(popover[0], 'events').mouseover && !$._data(popover[0], 'events').mouseout, 'popover does not have any events')
})
})

54
js/tests/unit/scrollspy.js
View File

@ -1,36 +1,36 @@
$(function () {
module('scrollspy')
module('scrollspy')
test('should provide no conflict', function () {
var scrollspy = $.fn.scrollspy.noConflict()
ok(!$.fn.scrollspy, 'scrollspy was set back to undefined (org value)')
$.fn.scrollspy = scrollspy
})
test('should provide no conflict', function () {
var scrollspy = $.fn.scrollspy.noConflict()
ok(!$.fn.scrollspy, 'scrollspy was set back to undefined (org value)')
$.fn.scrollspy = scrollspy
})
test('should be defined on jquery object', function () {
ok($(document.body).scrollspy, 'scrollspy method is defined')
})
test('should be defined on jquery object', function () {
ok($(document.body).scrollspy, 'scrollspy method is defined')
})
test('should return element', function () {
ok($(document.body).scrollspy()[0] == document.body, 'document.body returned')
})
test('should return element', function () {
ok($(document.body).scrollspy()[0] == document.body, 'document.body returned')
})
test('should switch active class on scroll', function () {
var sectionHTML = '<div id="masthead"></div>'
$section = $(sectionHTML).append('#qunit-fixture'),
topbarHTML = '<div class="topbar">' +
'<div class="topbar-inner">' +
'<div class="container">' +
'<h3><a href="#">Bootstrap</a></h3>' +
'<li><a href="#masthead">Overview</a></li>' +
'</ul>' +
'</div>' +
'</div>' +
'</div>',
$topbar = $(topbarHTML).scrollspy()
test('should switch active class on scroll', function () {
var sectionHTML = '<div id="masthead"></div>',
$section = $(sectionHTML).append('#qunit-fixture'),
topbarHTML = '<div class="topbar">' +
'<div class="topbar-inner">' +
'<div class="container">' +
'<h3><a href="#">Bootstrap</a></h3>' +
'<li><a href="#masthead">Overview</a></li>' +
'</ul>' +
'</div>' +
'</div>' +
'</div>',
$topbar = $(topbarHTML).scrollspy()
ok($topbar.find('.active', true))
})
ok($topbar.find('.active', true))
})
})

152
js/tests/unit/tab.js
View File

@ -1,86 +1,86 @@
$(function () {
module('tabs')
module('tabs')
test('should provide no conflict', function () {
var tab = $.fn.tab.noConflict()
ok(!$.fn.tab, 'tab was set back to undefined (org value)')
$.fn.tab = tab
test('should provide no conflict', function () {
var tab = $.fn.tab.noConflict()
ok(!$.fn.tab, 'tab was set back to undefined (org value)')
$.fn.tab = tab
})
test('should be defined on jquery object', function () {
ok($(document.body).tab, 'tabs method is defined')
})
test('should return element', function () {
ok($(document.body).tab()[0] == document.body, 'document.body returned')
})
test('should activate element by tab id', function () {
var tabsHTML = '<ul class="tabs">' +
'<li><a href="#home">Home</a></li>' +
'<li><a href="#profile">Profile</a></li>' +
'</ul>'
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo('#qunit-fixture')
$(tabsHTML).find('li:last a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'profile')
$(tabsHTML).find('li:first a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'home')
})
test('should activate element by tab id', function () {
var pillsHTML = '<ul class="pills">' +
'<li><a href="#home">Home</a></li>' +
'<li><a href="#profile">Profile</a></li>' +
'</ul>'
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo('#qunit-fixture')
$(pillsHTML).find('li:last a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'profile')
$(pillsHTML).find('li:first a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'home')
})
test('should not fire closed when close is prevented', function () {
$.support.transition = false
stop()
$('<div class="tab"/>')
.on('show.bs.tab', function (e) {
e.preventDefault()
ok(true)
start()
})
test('should be defined on jquery object', function () {
ok($(document.body).tab, 'tabs method is defined')
.on('shown.bs.tab', function () {
ok(false)
})
.tab('show')
})
test('should return element', function () {
ok($(document.body).tab()[0] == document.body, 'document.body returned')
test('show and shown events should reference correct relatedTarget', function () {
var dropHTML = '<ul class="drop">' +
'<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#1-1" data-toggle="tab">1-1</a></li>' +
'<li><a href="#1-2" data-toggle="tab">1-2</a></li>' +
'</ul>' +
'</li>' +
'</ul>'
$(dropHTML).find('ul>li:first a').tab('show').end()
.find('ul>li:last a')
.on('show.bs.tab', function (event) {
equal(event.relatedTarget.hash, '#1-1')
})
test('should activate element by tab id', function () {
var tabsHTML = '<ul class="tabs">' +
'<li><a href="#home">Home</a></li>' +
'<li><a href="#profile">Profile</a></li>' +
'</ul>'
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo('#qunit-fixture')
$(tabsHTML).find('li:last a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'profile')
$(tabsHTML).find('li:first a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'home')
})
test('should activate element by tab id', function () {
var pillsHTML = '<ul class="pills">' +
'<li><a href="#home">Home</a></li>' +
'<li><a href="#profile">Profile</a></li>' +
'</ul>'
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo('#qunit-fixture')
$(pillsHTML).find('li:last a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'profile')
$(pillsHTML).find('li:first a').tab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'home')
})
test('should not fire closed when close is prevented', function () {
$.support.transition = false
stop();
$('<div class="tab"/>')
.on('show.bs.tab', function (e) {
e.preventDefault();
ok(true);
start();
})
.on('shown.bs.tab', function () {
ok(false);
})
.tab('show')
})
test('show and shown events should reference correct relatedTarget', function () {
var dropHTML = '<ul class="drop">' +
'<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#1-1" data-toggle="tab">1-1</a></li>' +
'<li><a href="#1-2" data-toggle="tab">1-2</a></li>' +
'</ul>' +
'</li>' +
'</ul>'
$(dropHTML).find('ul>li:first a').tab('show').end()
.find('ul>li:last a')
.on('show.bs.tab', function (event) {
equal(event.relatedTarget.hash, '#1-1')
})
.on('show.bs.tab', function (event) {
equal(event.relatedTarget.hash, '#1-1')
})
.tab('show')
.on('show.bs.tab', function (event) {
equal(event.relatedTarget.hash, '#1-1')
})
.tab('show')
})
})

759
js/tests/unit/tooltip.js
View File

@ -1,432 +1,431 @@
$(function () {
module('tooltip')
module('tooltip')
test('should provide no conflict', function () {
var tooltip = $.fn.tooltip.noConflict()
ok(!$.fn.tooltip, 'tooltip was set back to undefined (org value)')
$.fn.tooltip = tooltip
test('should provide no conflict', function () {
var tooltip = $.fn.tooltip.noConflict()
ok(!$.fn.tooltip, 'tooltip was set back to undefined (org value)')
$.fn.tooltip = tooltip
})
test('should be defined on jquery object', function () {
var div = $('<div></div>')
ok(div.tooltip, 'popover method is defined')
})
test('should return element', function () {
var div = $('<div></div>')
ok(div.tooltip() == div, 'document.body returned')
})
test('should expose default settings', function () {
ok(!!$.fn.tooltip.Constructor.DEFAULTS, 'defaults is defined')
})
test('should empty title attribute', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
ok(tooltip.attr('title') === '', 'title attribute was emptied')
})
test('should add data attribute for referencing original title', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
equal(tooltip.attr('data-original-title'), 'Another tooltip', 'original title preserved in data attribute')
})
test('should place tooltips relative to placement option', function () {
$.support.transition = false
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({placement: 'bottom'})
.tooltip('show')
ok($('.tooltip').is('.fade.bottom.in'), 'has correct classes applied')
tooltip.tooltip('hide')
})
test('should allow html entities', function () {
$.support.transition = false
var tooltip = $('<a href="#" rel="tooltip" title="<b>@fat</b>"></a>')
.appendTo('#qunit-fixture')
.tooltip({html: true})
.tooltip('show')
ok($('.tooltip b').length, 'b tag was inserted')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
test('should respect custom classes', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ template: '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>'})
.tooltip('show')
ok($('.tooltip').hasClass('some-class'), 'custom class is present')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
test('should fire show event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('show.bs.tooltip', function () {
ok(true, 'show was called')
start()
})
.tooltip('show')
})
test('should be defined on jquery object', function () {
var div = $('<div></div>')
ok(div.tooltip, 'popover method is defined')
test('should fire shown event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
ok(true, 'shown was called')
start()
})
.tooltip('show')
})
test('should return element', function () {
var div = $('<div></div>')
ok(div.tooltip() == div, 'document.body returned')
test('should not fire shown event when default prevented', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('show.bs.tooltip', function (e) {
e.preventDefault()
ok(true, 'show was called')
start()
})
test('should expose default settings', function () {
ok(!!$.fn.tooltip.Constructor.DEFAULTS, 'defaults is defined')
.on('shown.bs.tooltip', function () {
ok(false, 'shown was called')
})
.tooltip('show')
})
test('should empty title attribute', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
ok(tooltip.attr('title') === '', 'title attribute was emptied')
test('should fire hide event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
$(this).tooltip('hide')
})
test('should add data attribute for referencing original title', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
equal(tooltip.attr('data-original-title'), 'Another tooltip', 'original title preserved in data attribute')
.on('hide.bs.tooltip', function () {
ok(true, 'hide was called')
start()
})
.tooltip('show')
})
test('should place tooltips relative to placement option', function () {
$.support.transition = false
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({placement: 'bottom'})
.tooltip('show')
ok($('.tooltip').is('.fade.bottom.in'), 'has correct classes applied')
tooltip.tooltip('hide')
test('should fire hidden event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
$(this).tooltip('hide')
})
test('should allow html entities', function () {
$.support.transition = false
var tooltip = $('<a href="#" rel="tooltip" title="<b>@fat</b>"></a>')
.appendTo('#qunit-fixture')
.tooltip({html: true})
.tooltip('show')
ok($('.tooltip b').length, 'b tag was inserted')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
.on('hidden.bs.tooltip', function () {
ok(true, 'hidden was called')
start()
})
.tooltip('show')
})
test('should respect custom classes', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ template: '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>'})
.tooltip('show')
ok($('.tooltip').hasClass('some-class'), 'custom class is present')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
test('should not fire hidden event when default prevented', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
$(this).tooltip('hide')
})
test('should fire show event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('show.bs.tooltip', function () {
ok(true, 'show was called')
start()
})
.tooltip('show')
.on('hide.bs.tooltip', function (e) {
e.preventDefault()
ok(true, 'hide was called')
start()
})
test('should fire shown event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
ok(true, 'shown was called')
start()
})
.tooltip('show')
.on('hidden.bs.tooltip', function () {
ok(false, 'hidden was called')
})
.tooltip('show')
})
test('should not fire shown event when default prevented', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('show.bs.tooltip', function (e) {
e.preventDefault()
ok(true, 'show was called')
start()
})
.on('shown.bs.tooltip', function () {
ok(false, 'shown was called')
})
.tooltip('show')
})
test('should not show tooltip if leave event occurs before delay expires', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: 200 })
test('should fire hide event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
$(this).tooltip('hide')
})
.on('hide.bs.tooltip', function () {
ok(true, 'hide was called')
start()
})
.tooltip('show')
})
stop()
test('should fire hidden event', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
$(this).tooltip('hide')
})
.on('hidden.bs.tooltip', function () {
ok(true, 'hidden was called')
start()
})
.tooltip('show')
})
tooltip.trigger('mouseenter')
test('should not fire hidden event when default prevented', function () {
stop()
var tooltip = $('<div title="tooltip title"></div>')
.on('shown.bs.tooltip', function () {
$(this).tooltip('hide')
})
.on('hide.bs.tooltip', function (e) {
e.preventDefault()
ok(true, 'hide was called')
start()
})
.on('hidden.bs.tooltip', function () {
ok(false, 'hidden was called')
})
.tooltip('show')
})
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
start()
}, 200)
}, 100)
})
test('should not show tooltip if leave event occurs before delay expires', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: 200 })
test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: { show: 200, hide: 0} })
stop()
stop()
tooltip.trigger('mouseenter')
tooltip.trigger('mouseenter')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
start()
}, 200)
}, 100)
})
test('should wait 200 ms before hiding the tooltip', 3, function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: { show: 0, hide: 200} })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), '100ms:tooltip is still faded in')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
start()
}, 200)
}, 100)
})
test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: { show: 200, hide: 0} })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
start()
}, 200)
}, 100)
})
test('should wait 200 ms before hiding the tooltip', 3, function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: { show: 0, hide: 200} })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), '100ms:tooltip is still faded in')
setTimeout(function () {
ok(!$('.tooltip').is('.in'), 'tooltip removed')
start()
}, 150)
}, 100)
}, 1)
})
test('should not hide tooltip if leave event occurs, then tooltip is show immediately again', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: { show: 0, hide: 200} })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), '100ms:tooltip is still faded in')
tooltip.trigger('mouseenter')
setTimeout(function () {
ok($('.tooltip').is('.in'), 'tooltip removed')
start()
}, 150)
}, 100)
}, 1)
})
test('should not show tooltip if leave event occurs before delay expires', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: 100 })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
start()
}, 100)
}, 50)
})
test('should show tooltip if leave event hasn\'t occured before delay expires', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: 150 })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
}, 100)
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), 'tooltip has faded in')
ok(!$('.tooltip').is('.in'), 'tooltip removed')
start()
}, 200)
})
}, 150)
}, 100)
}, 1)
})
test('should destroy tooltip', function () {
var tooltip = $('<div/>').tooltip().on('click.foo', function () {})
ok(tooltip.data('bs.tooltip'), 'tooltip has data')
ok($._data(tooltip[0], 'events').mouseover && $._data(tooltip[0], 'events').mouseout, 'tooltip has hover event')
ok($._data(tooltip[0], 'events').click[0].namespace == 'foo', 'tooltip has extra click.foo event')
tooltip.tooltip('show')
tooltip.tooltip('destroy')
ok(!tooltip.hasClass('in'), 'tooltip is hidden')
ok(!$._data(tooltip[0], 'bs.tooltip'), 'tooltip does not have data')
ok($._data(tooltip[0], 'events').click[0].namespace == 'foo', 'tooltip still has click.foo')
ok(!$._data(tooltip[0], 'events').mouseover && !$._data(tooltip[0], 'events').mouseout, 'tooltip does not have any events')
})
test('should not hide tooltip if leave event occurs, then tooltip is show immediately again', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: { show: 0, hide: 200} })
test('should show tooltip with delegate selector on click', function () {
var div = $('<div><a href="#" rel="tooltip" title="Another tooltip"></a></div>')
var tooltip = div.appendTo('#qunit-fixture')
.tooltip({ selector: 'a[rel=tooltip]',
trigger: 'click' })
div.find('a').trigger('click')
ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
})
stop()
test('should show tooltip when toggle is called', function () {
var tooltip = $('<a href="#" rel="tooltip" title="tooltip on toggle"></a>')
.appendTo('#qunit-fixture')
.tooltip({trigger: 'manual'})
.tooltip('toggle')
ok($('.tooltip').is('.fade.in'), 'tooltip should be toggled in')
})
tooltip.trigger('mouseenter')
test('should place tooltips inside the body', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({container: 'body'})
.tooltip('show')
ok($('body > .tooltip').length, 'inside the body')
ok(!$('#qunit-fixture > .tooltip').length, 'not found in parent')
tooltip.tooltip('hide')
})
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), '100ms:tooltip is still faded in')
tooltip.trigger('mouseenter')
setTimeout(function () {
ok($('.tooltip').is('.in'), 'tooltip removed')
start()
}, 150)
}, 100)
}, 1)
})
test('should place tooltip inside window', function () {
var container = $('<div />').appendTo('body')
.css({position: 'absolute', width: 200, height: 200, bottom: 0, left: 0}),
tooltip = $('<a href="#" title="Very very very very very very very very long tooltip">Hover me</a>')
.css({position: 'absolute', top: 0, left: 0})
test('should not show tooltip if leave event occurs before delay expires', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: 100 })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
tooltip.trigger('mouseout')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
start()
}, 100)
}, 50)
})
test('should show tooltip if leave event hasn\'t occured before delay expires', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({ delay: 150 })
stop()
tooltip.trigger('mouseenter')
setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), 'tooltip is not faded in')
}, 100)
setTimeout(function () {
ok($('.tooltip').is('.fade.in'), 'tooltip has faded in')
start()
}, 200)
})
test('should destroy tooltip', function () {
var tooltip = $('<div/>').tooltip().on('click.foo', function () {})
ok(tooltip.data('bs.tooltip'), 'tooltip has data')
ok($._data(tooltip[0], 'events').mouseover && $._data(tooltip[0], 'events').mouseout, 'tooltip has hover event')
ok($._data(tooltip[0], 'events').click[0].namespace == 'foo', 'tooltip has extra click.foo event')
tooltip.tooltip('show')
tooltip.tooltip('destroy')
ok(!tooltip.hasClass('in'), 'tooltip is hidden')
ok(!$._data(tooltip[0], 'bs.tooltip'), 'tooltip does not have data')
ok($._data(tooltip[0], 'events').click[0].namespace == 'foo', 'tooltip still has click.foo')
ok(!$._data(tooltip[0], 'events').mouseover && !$._data(tooltip[0], 'events').mouseout, 'tooltip does not have any events')
})
test('should show tooltip with delegate selector on click', function () {
var div = $('<div><a href="#" rel="tooltip" title="Another tooltip"></a></div>')
var tooltip = div.appendTo('#qunit-fixture')
.tooltip({ selector: 'a[rel=tooltip]', trigger: 'click' })
div.find('a').trigger('click')
ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
})
test('should show tooltip when toggle is called', function () {
var tooltip = $('<a href="#" rel="tooltip" title="tooltip on toggle"></a>')
.appendTo('#qunit-fixture')
.tooltip({trigger: 'manual'})
.tooltip('toggle')
ok($('.tooltip').is('.fade.in'), 'tooltip should be toggled in')
})
test('should place tooltips inside the body', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture')
.tooltip({container: 'body'})
.tooltip('show')
ok($('body > .tooltip').length, 'inside the body')
ok(!$('#qunit-fixture > .tooltip').length, 'not found in parent')
tooltip.tooltip('hide')
})
test('should place tooltip inside window', function () {
var container = $('<div />').appendTo('body')
.css({position: 'absolute', width: 200, height: 200, bottom: 0, left: 0}),
tooltip = $('<a href="#" title="Very very very very very very very very long tooltip">Hover me</a>')
.css({position: 'absolute', top: 0, left: 0})
.appendTo(container)
.tooltip({placement: 'top', animate: false})
.tooltip('show')
stop()
setTimeout(function () {
ok($('.tooltip').offset().left >= 0)
start()
container.remove()
}, 100)
})
test('should place tooltip on top of element', function () {
var container = $('<div />').appendTo('body')
.css({position: 'absolute', bottom: 0, left: 0, textAlign: 'right', width: 300, height: 300}),
p = $('<p style="margin-top:200px" />').appendTo(container),
tooltiped = $('<a href="#" title="very very very very very very very long tooltip">Hover me</a>')
.css({marginTop: 200})
.appendTo(p)
.tooltip({placement: 'top', animate: false})
.tooltip('show')
stop()
setTimeout(function () {
var tooltip = container.find('.tooltip')
start()
ok(Math.round(tooltip.offset().top + tooltip.outerHeight()) <= Math.round(tooltiped.offset().top))
container.remove()
}, 100)
})
test('should add position class before positioning so that position-specific styles are taken into account', function () {
$('head').append('<style> .tooltip.right { white-space: nowrap; } .tooltip.right .tooltip-inner { max-width: none; } </style>')
var container = $('<div />').appendTo('body'),
target = $('<a href="#" rel="tooltip" title="very very very very very very very very long tooltip in one line"></a>')
.appendTo(container)
.tooltip({placement: 'top', animate: false})
.tooltip('show')
.tooltip({placement: 'right'})
.tooltip('show'),
tooltip = container.find('.tooltip')
stop()
// this is some dumb hack shit because sub pixels in firefox
var top = Math.round(target.offset().top + (target[0].offsetHeight / 2) - (tooltip[0].offsetHeight / 2))
var top2 = Math.round(tooltip.offset().top)
var topDiff = top - top2
ok(topDiff <= 1 && topDiff >= -1)
target.tooltip('hide')
})
setTimeout(function () {
ok($('.tooltip').offset().left >= 0)
test('tooltip title test #1', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Simple tooltip" style="display: inline-block; position: absolute; top: 0; left: 0;"></a>')
.appendTo('#qunit-fixture')
.tooltip({})
.tooltip('show')
equal($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title from title attribute is set')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
start()
container.remove()
}, 100)
test('tooltip title test #2', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Simple tooltip" style="display: inline-block; position: absolute; top: 0; left: 0;"></a>')
.appendTo('#qunit-fixture')
.tooltip({
title: 'This is a tooltip with some content'
})
.tooltip('show')
equal($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title is set from title attribute while prefered over title option')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
test('should place tooltip on top of element', function () {
var container = $('<div />').appendTo('body')
.css({position: 'absolute', bottom: 0, left: 0, textAlign: 'right', width: 300, height: 300}),
p = $('<p style="margin-top:200px" />').appendTo(container),
tooltiped = $('<a href="#" title="very very very very very very very long tooltip">Hover me</a>')
.css({marginTop: 200})
.appendTo(p)
.tooltip({placement: 'top', animate: false})
.tooltip('show')
stop()
setTimeout(function () {
var tooltip = container.find('.tooltip')
start()
ok(Math.round(tooltip.offset().top + tooltip.outerHeight()) <= Math.round(tooltiped.offset().top))
container.remove()
}, 100)
test('tooltip title test #3', function () {
var tooltip = $('<a href="#" rel="tooltip" style="display: inline-block; position: absolute; top: 0; left: 0;"></a>')
.appendTo('#qunit-fixture')
.tooltip({
title: 'This is a tooltip with some content'
})
.tooltip('show')
equal($('.tooltip').children('.tooltip-inner').text(), 'This is a tooltip with some content', 'title from title option is set')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
test('should add position class before positioning so that position-specific styles are taken into account', function () {
$('head').append('<style> .tooltip.right { white-space: nowrap; } .tooltip.right .tooltip-inner { max-width: none; } </style>')
test('tooltips should be placed dynamically, with the dynamic placement option', function () {
$.support.transition = false
var ttContainer = $('<div id="dynamic-tt-test"/>').css({
'height' : 400,
'overflow' : 'hidden',
'position' : 'absolute',
'top' : 0,
'left' : 0,
'width' : 600
})
.appendTo('body')
var container = $('<div />').appendTo('body'),
target = $('<a href="#" rel="tooltip" title="very very very very very very very very long tooltip in one line"></a>')
.appendTo(container)
.tooltip({placement: 'right'})
.tooltip('show'),
tooltip = container.find('.tooltip')
var topTooltip = $('<div style="display: inline-block; position: absolute; left: 0; top: 0;" rel="tooltip" title="Top tooltip">Top Dynamic Tooltip</div>')
.appendTo('#dynamic-tt-test')
.tooltip({placement: 'auto'})
.tooltip('show')
// this is some dumb hack shit because sub pixels in firefox
var top = Math.round(target.offset().top + (target[0].offsetHeight / 2) - (tooltip[0].offsetHeight / 2))
var top2 = Math.round(tooltip.offset().top)
var topDiff = top - top2
ok(topDiff <= 1 && topDiff >= -1)
target.tooltip('hide')
})
ok($('.tooltip').is('.bottom'), 'top positioned tooltip is dynamically positioned bottom')
test('tooltip title test #1', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Simple tooltip" style="display: inline-block; position: absolute; top: 0; left: 0;"></a>')
.appendTo('#qunit-fixture')
.tooltip({
})
.tooltip('show')
equal($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title from title attribute is set')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
topTooltip.tooltip('hide')
test('tooltip title test #2', function () {
var tooltip = $('<a href="#" rel="tooltip" title="Simple tooltip" style="display: inline-block; position: absolute; top: 0; left: 0;"></a>')
.appendTo('#qunit-fixture')
.tooltip({
title: 'This is a tooltip with some content'
})
.tooltip('show')
equal($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title is set from title attribute while prefered over title option')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
var rightTooltip = $('<div style="display: inline-block; position: absolute; right: 0;" rel="tooltip" title="Right tooltip">Right Dynamic Tooltip</div>')
.appendTo('#dynamic-tt-test')
.tooltip({placement: 'right auto'})
.tooltip('show')
test('tooltip title test #3', function () {
var tooltip = $('<a href="#" rel="tooltip" style="display: inline-block; position: absolute; top: 0; left: 0;"></a>')
.appendTo('#qunit-fixture')
.tooltip({
title: 'This is a tooltip with some content'
})
.tooltip('show')
equal($('.tooltip').children('.tooltip-inner').text(), 'This is a tooltip with some content', 'title from title option is set')
tooltip.tooltip('hide')
ok(!$('.tooltip').length, 'tooltip removed')
})
ok($('.tooltip').is('.left'), 'right positioned tooltip is dynamically positioned left')
rightTooltip.tooltip('hide')
test('tooltips should be placed dynamically, with the dynamic placement option', function () {
$.support.transition = false
var ttContainer = $('<div id="dynamic-tt-test"/>').css({
'height' : 400,
'overflow' : 'hidden',
'position' : 'absolute',
'top' : 0,
'left' : 0,
'width' : 600})
.appendTo('body')
var leftTooltip = $('<div style="display: inline-block; position: absolute; left: 0;" rel="tooltip" title="Left tooltip">Left Dynamic Tooltip</div>')
.appendTo('#dynamic-tt-test')
.tooltip({placement: 'auto left'})
.tooltip('show')
var topTooltip = $('<div style="display: inline-block; position: absolute; left: 0; top: 0;" rel="tooltip" title="Top tooltip">Top Dynamic Tooltip</div>')
.appendTo('#dynamic-tt-test')
.tooltip({placement: 'auto'})
.tooltip('show')
ok($('.tooltip').is('.right'), 'left positioned tooltip is dynamically positioned right')
leftTooltip.tooltip('hide')
ok($('.tooltip').is('.bottom'), 'top positioned tooltip is dynamically positioned bottom')
topTooltip.tooltip('hide')
var rightTooltip = $('<div style="display: inline-block; position: absolute; right: 0;" rel="tooltip" title="Right tooltip">Right Dynamic Tooltip</div>')
.appendTo('#dynamic-tt-test')
.tooltip({placement: 'right auto'})
.tooltip('show')
ok($('.tooltip').is('.left'), 'right positioned tooltip is dynamically positioned left')
rightTooltip.tooltip('hide')
var leftTooltip = $('<div style="display: inline-block; position: absolute; left: 0;" rel="tooltip" title="Left tooltip">Left Dynamic Tooltip</div>')
.appendTo('#dynamic-tt-test')
.tooltip({placement: 'auto left'})
.tooltip('show')
ok($('.tooltip').is('.right'), 'left positioned tooltip is dynamically positioned right')
leftTooltip.tooltip('hide')
ttContainer.remove()
})
ttContainer.remove()
})
})

2
js/tooltip.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: tooltip.js v3.1.0
* Bootstrap: tooltip.js v3.1.1
* http://getbootstrap.com/javascript/#tooltip
* Inspired by the original jQuery.tipsy by Jason Frame
* ========================================================================

2
js/transition.js
View File

@ -1,5 +1,5 @@
/* ========================================================================
* Bootstrap: transition.js v3.1.0
* Bootstrap: transition.js v3.1.1
* http://getbootstrap.com/javascript/#transitions
* ========================================================================
* Copyright 2011-2014 Twitter, Inc.

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