Merge remote-tracking branch 'bootstrap/3.0.0-wip' into 3.0.0-wip
Conflicts: js/tests/unit/bootstrap-collapse.js
|
@ -0,0 +1,14 @@
|
|||
# editorconfig.org
|
||||
|
||||
root = true
|
||||
|
||||
[*]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
end_of_line = lf
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
[Makefile]
|
||||
indent_style = tab
|
|
@ -13,6 +13,7 @@ _gh_pages
|
|||
*.vi
|
||||
*~
|
||||
*.sass-cache
|
||||
*.ruby-version
|
||||
|
||||
# OS or Editor folders
|
||||
.DS_Store
|
||||
|
|
|
@ -1,3 +1,3 @@
|
|||
language: node_js
|
||||
node_js:
|
||||
- 0.6
|
||||
- 0.6
|
||||
|
|
|
@ -357,4 +357,4 @@ Complete rewrite of the library. For full details, head to the upgrading doc at
|
|||
- Bug fixes
|
||||
|
||||
## v1.0.0
|
||||
- **Initial release**
|
||||
- **Initial release**
|
||||
|
|
|
@ -9,7 +9,7 @@ Looking to contribute something to Bootstrap? **Here's how you can help.**
|
|||
We only accept issues that are bug reports or feature requests. Bugs must be isolated and reproducible problems that we can fix within the Bootstrap core. Please read the following guidelines before opening any issue.
|
||||
|
||||
1. **Search for existing issues.** We get a lot of duplicate issues, and you'd help us out a lot by first checking if someone else has reported the same issue. Moreover, the issue may have already been resolved with a fix available.
|
||||
2. **Create an isolated and reproducible test case.** Be sure the problem exists in Bootstrap's code with a [reduced test cases](http://css-tricks.com/reduced-test-cases/) that should be included in each bug report.
|
||||
2. **Create an isolated and reproducible test case.** Be sure the problem exists in Bootstrap's code with a [reduced test case](http://css-tricks.com/reduced-test-cases/) that should be included in each bug report.
|
||||
3. **Include a live example.** Make use of jsFiddle or jsBin to share your isolated test cases.
|
||||
4. **Share as much information as possible.** Include operating system and version, browser and version, version of Bootstrap, customized or vanilla build, etc. where appropriate. Also include steps to reproduce the bug.
|
||||
|
||||
|
|
2
LICENSE
|
@ -173,4 +173,4 @@
|
|||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
|
2
Makefile
|
@ -88,8 +88,6 @@ bootstrap/css/*.css: less/*.less
|
|||
mkdir -p bootstrap/css
|
||||
recess --compile ${BOOTSTRAP_LESS} > bootstrap/css/bootstrap.css
|
||||
recess --compress ${BOOTSTRAP_LESS} > bootstrap/css/bootstrap.min.css
|
||||
recess --compile ${BOOTSTRAP_RESPONSIVE_LESS} > bootstrap/css/bootstrap-responsive.css
|
||||
recess --compress ${BOOTSTRAP_RESPONSIVE_LESS} > bootstrap/css/bootstrap-responsive.min.css
|
||||
|
||||
#
|
||||
# FONTS
|
||||
|
|
21
README.md
|
@ -1,7 +1,3 @@
|
|||
<a href="http://getbootstrap.com">
|
||||
<img src="http://twitter.github.com/bootstrap/assets/img/bootstrap-docs-readme.png" width="100px">
|
||||
</a>
|
||||
|
||||
# [Bootstrap v3.0.0](http://getbootstrap.com) [](http://travis-ci.org/twitter/bootstrap)
|
||||
|
||||
Bootstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development, created and maintained by [Mark Otto](http://twitter.com/mdo) and [Jacob Thornton](http://twitter.com/fat).
|
||||
|
@ -16,7 +12,7 @@ Three quick start options are available:
|
|||
|
||||
* [Download the latest release](https://github.com/twitter/bootstrap/zipball/master).
|
||||
* Clone the repo: `git clone git://github.com/twitter/bootstrap.git`.
|
||||
* Install with Twitter's [Bower](http://twitter.github.com/bower): `bower install bootstrap`.
|
||||
* Install with Twitter's [Bower](http://github.com/bower/bower): `bower install bootstrap`.
|
||||
|
||||
Read the [Getting Started page](http://getbootstrap.com/getting-started/) for information on the framework contents, basic template guidelines, and more.
|
||||
|
||||
|
@ -55,14 +51,17 @@ $ npm install
|
|||
|
||||
When completed, you'll be able to run the various make commands provided:
|
||||
|
||||
#### build - `make` or `make bootstrap`
|
||||
`make` runs the Recess compiler to rebuild the `/less` files and compile the docs. `make bootstrap` creates the `/bootstrap` directory with compiled files. **Requires recess and uglify-js.**
|
||||
#### Build - `make`
|
||||
`make` runs the Recess compiler to rebuild the `/less` files and compile the docs. **Requires recess and uglify-js.**
|
||||
|
||||
#### test - `make test`
|
||||
#### Compile CSS, JS, and fonts - `make bootstrap`
|
||||
`make bootstrap` creates the `/bootstrap` directory with compiled files. **Requires recess and uglify-js.**
|
||||
|
||||
#### Tests - `make test`
|
||||
Runs jshint and qunit tests headlessly in [phantomjs](http://code.google.com/p/phantomjs/) (used for ci). **Requires phantomjs.**
|
||||
|
||||
#### watch - `make watch`
|
||||
This is a convenience method for watching just Less files and automatically building them whenever you save. **Requires the Watchr gem.**
|
||||
#### Watch - `make watch`
|
||||
This is a convenience method for watching just Less files and automatically building them whenever you save. **Requires the watchr gem.**
|
||||
|
||||
Should you encounter problems with installing dependencies or running the makefile commands, uninstall any previous versions (global and local) you may have installed, and then rerun `npm install`.
|
||||
|
||||
|
@ -72,6 +71,8 @@ Should you encounter problems with installing dependencies or running the makefi
|
|||
|
||||
Please submit all pull requests against *-wip branches. If your pull request contains JavaScript patches or features, you must include relevant unit tests. All HTML and CSS should conform to the [Code Guide](http://github.com/mdo/code-guide), maintained by [Mark Otto](http://github.com/mdo).
|
||||
|
||||
Editor preferences are also available in the [editor config](.editorconfig) for easy application in common text editors. Read more and download plugins at [http://editorconfig.com](http://editorconfig.com).
|
||||
|
||||
|
||||
|
||||
## Community
|
||||
|
|
|
@ -5,4 +5,4 @@
|
|||
"dependencies": {
|
||||
"jquery": "~1.8.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<!-- Footer
|
||||
================================================== -->
|
||||
<footer class="bs-docs-footer">
|
||||
<div class="container">
|
||||
<div class="bs-docs-container">
|
||||
|
||||
<div class="bs-docs-social">
|
||||
<ul class="bs-docs-social-buttons">
|
||||
|
@ -32,4 +32,4 @@
|
|||
<li><a href="https://github.com/twitter/bootstrap/blob/master/CHANGELOG.md">Changelog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</footer>
|
||||
</footer>
|
||||
|
|
|
@ -0,0 +1,226 @@
|
|||
<div class="bs-docs-sidebar">
|
||||
<ul class="nav bs-docs-sidenav">
|
||||
<h3 class="bs-docs-sidenav-heading"><a href="/">Bootstrap</a></h3>
|
||||
|
||||
<li><a href="#welcome">Welcome!</a></li>
|
||||
<li><a href="#getting-started">Getting started</a></li>
|
||||
<li><a href="#whats-included">What's included</a></li>
|
||||
<li><a href="#examples">Templates and examples</a></li>
|
||||
<li><a href="#customizing">Customizing Bootstrap</a></li>
|
||||
|
||||
<!-- CSS -->
|
||||
<li><a class="nav-header" href="#css">CSS</a></li>
|
||||
<li><a href="#css-overview">Overview</a></li>
|
||||
<li>
|
||||
<a href="#grid">Grid system</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#grid-example">Example usage</a></li>
|
||||
<li><a href="#grid-offsetting">Offset columns</a></li>
|
||||
<li><a href="#grid-nesting">Nested columns</a></li>
|
||||
<li><a href="#grid-column-ordering">Column ordering</a></li>
|
||||
<li><a href="#grid-small">Small device grid</a></li>
|
||||
<li><a href="#grid-less">LESS mixins and variables</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#type">Typography</a>
|
||||
<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-abbreviations">Abbreviations</a></li>
|
||||
<li><a href="#type-addresses">Addresses</a></li>
|
||||
<li><a href="#type-blockquotes">Blockquotes</a></li>
|
||||
<li><a href="#type-lists">Lists</a></li>
|
||||
<li><a href="#type-"></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#code">Code</a></li>
|
||||
<li>
|
||||
<a href="#tables">Tables</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#tables-example">Basic example</a></li>
|
||||
<li><a href="#tables-striped">Zebra striping</a></li>
|
||||
<li><a href="#tables-bordered">Bordered tables</a></li>
|
||||
<li><a href="#tables-hover-rows">Hover rows</a></li>
|
||||
<li><a href="#tables-condensed">Condensed tables</a></li>
|
||||
<li><a href="#tables-row-classes">Contextual row classes</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#forms">Forms</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#forms-example">Basic example</a></li>
|
||||
<li><a href="#forms-inline">Inline variation</a></li>
|
||||
<li><a href="#forms-horizontal">Horizontal variation</a></li>
|
||||
<li><a href="#forms-controls">Supported controls</a></li>
|
||||
<li><a href="#forms-control-states">Control states</a></li>
|
||||
<li><a href="#forms-input-groups">Input groups</a></li>
|
||||
<li><a href="#forms-control-sizes">Control sizing</a></li>
|
||||
<li><a href="#forms-actions">Form actions</a></li>
|
||||
<li><a href="#forms-help-text">Help text</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#buttons">Buttons</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#buttons-options">Button options</a></li>
|
||||
<li><a href="#buttons-sizes">Sizes</a></li>
|
||||
<li><a href="#buttons-disabled">Disabled</a></li>
|
||||
<li><a href="#buttons-tags">Button tags</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#images">Images</a></li>
|
||||
<li><a href="#helper-classes">Helper classes</a></li>
|
||||
<li><a href="#responsive-utilities">Responsive utilities</a></li>
|
||||
|
||||
<!-- Components -->
|
||||
<li><a class="nav-header" href="#components">Components</a></li>
|
||||
<li><a href="#icons">Glyphicons</a></li>
|
||||
<li>
|
||||
<a href="#dropdowns">Dropdowns</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#dropdowns-example">Example</a></li>
|
||||
<li><a href="#dropdowns-alignment">Alignment options</a></li>
|
||||
<li><a href="#dropdowns-disabled">Disabled menu items</a></li>
|
||||
<li><a href="#dropdowns-submenus">Submenus</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#btn-groups">Button groups</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#btn-groups-single">Basic button group</a></li>
|
||||
<li><a href="#btn-groups-toolbar">Button toolbar</a></li>
|
||||
<li><a href="#btn-groups-vertical">Vertical variation</a></li>
|
||||
<li><a href="#btn-groups-justified">Justified link buttons</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#btn-dropdowns">Button dropdowns</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#btn-dropdowns-single">Single button dropdown</a></li>
|
||||
<li><a href="#btn-dropdowns-split">Split button dropdown</a></li>
|
||||
<li><a href="#btn-dropdowns-sizes">Button sizes</a></li>
|
||||
<li><a href="#btn-dropdowns-dropup">Dropup variation</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#nav">Navs</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#nav-tabs">Tabs nav</a></li>
|
||||
<li><a href="#nav-pills">Pills nav</a></li>
|
||||
<li><a href="#nav-justified">Justified nav</a></li>
|
||||
<li><a href="#nav-disabled-links">Disabled links</a></li>
|
||||
<li><a href="#nav-alignment">Alignment options</a></li>
|
||||
<li><a href="#nav-dropdowns">Using dropdowns</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#navbar">Navbar</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#navbar-basic">Basic navbar</a></li>
|
||||
<li><a href="#navbar-nav">Nav links</a></li>
|
||||
<li><a href="#navbar-forms">Forms in navbars</a></li>
|
||||
<li><a href="#navbar-buttons">Buttons in navbars</a></li>
|
||||
<li><a href="#navbar-text">Text in navbars</a></li>
|
||||
<li><a href="#navbar-links">Links in navbars</a></li>
|
||||
<li><a href="#navbar-component-alignment">Component alignment</a></li>
|
||||
<li><a href="#navbar-fixed-top">Fixed top navbar</a></li>
|
||||
<li><a href="#navbar-fixed-bottom">Fixed bottom navbar</a></li>
|
||||
<li><a href="#navbar-static-top">Static top navbar</a></li>
|
||||
<li><a href="#navbar-responsive">Responsive navbar</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#breadcrumbs">Breadcrumbs</a></li>
|
||||
<li>
|
||||
<a href="#pagination">Pagination</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#pagination-default">Default pagination</a></li>
|
||||
<li><a href="#pagination-pager">Pager</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#labels">Labels</a></li>
|
||||
<li><a href="#badges">Badges</a></li>
|
||||
<li>
|
||||
<a href="#type-components">Typography</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#type-components-jumbotron">Jumbotron</a></li>
|
||||
<li><a href="#type-components-page-header">Page header</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#thumbnails">Thumbnails</a></li>
|
||||
<li>
|
||||
<a href="#alerts">Alerts</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#alerts-default">Default alert</a></li>
|
||||
<li><a href="#alerts-block">Block alerts</a></li>
|
||||
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#progress">Progress bars</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#progress-basic">Basic progress bar</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>
|
||||
<li><a href="#progress-stacked">Stacked</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#media">Media object</a></li>
|
||||
<li>
|
||||
<a href="#list-group">List group</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#list-group-basic">Basic list group</a></li>
|
||||
<li><a href="#list-group-chevrons">Chevrons</a></li>
|
||||
<li><a href="#list-group-badges">Badges</a></li>
|
||||
<li><a href="#list-group-badges-chevrons">Badges and chevrons</a></li>
|
||||
<li><a href="#list-group-linked">Linked items</a></li>
|
||||
<li><a href="#list-group-custom-content">Custom content</a></li>
|
||||
<!-- <li><a href="#list-group-pic">Leading picture</a></li> -->
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#panels">Panels</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#panels-basic">Basic panel</a></li>
|
||||
<li><a href="#panels-heading">Panel with heading</a></li>
|
||||
<li><a href="#panels-alternatives">Contextual alternatives</a></li>
|
||||
<li><a href="#panels-list-group">With list groups</a>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#wells">Wells</a></li>
|
||||
|
||||
<!-- JavaScript -->
|
||||
<li><a class="nav-header" href="#js">JavaScript</a></li>
|
||||
<li>
|
||||
<a href="#js-overview">Overview</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#js-individual-compiled">Individual or compiled</a></li>
|
||||
<li><a href="#js-data-attributes">Data attributes</a></li>
|
||||
<li><a href="#js-programmatic-api">Programmatic API</a></li>
|
||||
<li><a href="#js-noconflict">No Conflict</a></li>
|
||||
<li><a href="#js-events">Evens</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#transitions">Transitions</a></li>
|
||||
<li>
|
||||
<a href="#modals">Modal</a>
|
||||
<ul class="nav">
|
||||
<li><a href="#modals-examples">Examples</a></li>
|
||||
<li><a href="#modals-usage">Usage</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#dropdowns">Dropdown</a></li>
|
||||
<li><a href="#scrollspy">Scrollspy</a></li>
|
||||
<li><a href="#tabs">Tab</a></li>
|
||||
<li><a href="#tooltips">Tooltip</a></li>
|
||||
<li><a href="#popovers">Popover</a></li>
|
||||
<li><a href="#js-alerts">Alert</a></li>
|
||||
<li><a href="#js-buttons">Button</a></li>
|
||||
<li><a href="#collapse">Collapse</a></li>
|
||||
<li><a href="#carousel">Carousel</a></li>
|
||||
<li><a href="#typeahead">Typeahead</a></li>
|
||||
<li><a href="#affix">Affix</a></li>
|
||||
</ul>
|
||||
</div>
|
|
@ -35,4 +35,4 @@
|
|||
var s = document.getElementsByTagName('script')[0];
|
||||
s.parentNode.insertBefore(t, s);
|
||||
})();
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
<!-- Bootstrap core CSS -->
|
||||
<link href="/assets/css/bootstrap.css" rel="stylesheet">
|
||||
|
||||
{% if page.layout == "default" %}
|
||||
{% if page.layout != "example" %}
|
||||
<!-- Documentation extras -->
|
||||
<link href="/assets/css/docs.css" rel="stylesheet">
|
||||
<link href="/assets/css/pygments-manni.css" rel="stylesheet">
|
||||
|
|
|
@ -1,32 +1,32 @@
|
|||
<!-- Navbar
|
||||
================================================== -->
|
||||
<div class="navbar navbar-fixed-top bs-docs-navbar">
|
||||
<div class="navbar navbar-inverse navbar-fixed-left bs-docs-navbar">
|
||||
<div class="container">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse">
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="/">Bootstrap</a>
|
||||
<a class="navbar-brand" href="/">B</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<li {% if page.title == "Bootstrap" %}class="active"{% endif %}>
|
||||
<a href="/">Home</a>
|
||||
<!-- <li {% if page.title == "Bootstrap" %}class="active"{% endif %}>
|
||||
<a href="/"><span class="glyphicon glyphicon-home"></span></a>
|
||||
</li>
|
||||
<li {% if page.title == "Getting started" %}class="active"{% endif %}>
|
||||
<a href="/getting-started">Getting started</a>
|
||||
--> <li {% if page.title == "Getting started" %}class="active"{% endif %}>
|
||||
<a href="/getting-started" data-toggle="tooltip" data-placement="right" title="Getting started"><span class="glyphicon glyphicon-list"></span></a>
|
||||
</li>
|
||||
<li {% if page.title == "CSS" %}class="active"{% endif %}>
|
||||
<a href="/css">CSS</a>
|
||||
<a href="/css" data-toggle="tooltip" data-placement="right" title="CSS"><span class="glyphicon glyphicon-tint"></span></a>
|
||||
</li>
|
||||
<li {% if page.title == "Components" %}class="active"{% endif %}>
|
||||
<a href="/components">Components</a>
|
||||
<a href="/components" data-toggle="tooltip" data-placement="right" title="Components"><span class="glyphicon glyphicon-fire"></span></a>
|
||||
</li>
|
||||
<li {% if page.title == "JavaScript plugins" %}class="active"{% endif %}>
|
||||
<a href="/javascript">JavaScript</a>
|
||||
<a href="/javascript" data-toggle="tooltip" data-placement="right" title="JavaScript plugins"><span class="glyphicon glyphicon-dashboard"></span></a>
|
||||
</li>
|
||||
<li {% if page.title == "Customize and download" %}class="active"{% endif %}>
|
||||
<a href="/customize">Customize</a>
|
||||
<a href="/customize" data-toggle="tooltip" data-placement="right" title="Customize"><span class="glyphicon glyphicon-cog"></span></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -5,10 +5,10 @@
|
|||
{% include header.html %}
|
||||
<!-- Place anything custom after this. -->
|
||||
</head>
|
||||
<body class="bs-docs-body" data-spy="scroll" data-target=".bs-docs-sidebar">
|
||||
<body class="bs-docs-docs" data-spy="scroll" data-target=".bs-docs-sidebar">
|
||||
|
||||
<!-- Main navbar for all docs pages. -->
|
||||
{% include navbar.html %}
|
||||
<!-- Docs nav -->
|
||||
{% include docs-nav.html %}
|
||||
|
||||
<!-- Page content of course! -->
|
||||
{{ content }}
|
||||
|
|
|
@ -14,4 +14,4 @@
|
|||
{% include footer.html %}
|
||||
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- Meta, title, CSS, favicons, etc. -->
|
||||
{% include header.html %}
|
||||
<!-- Place anything custom after this. -->
|
||||
</head>
|
||||
<body class="bs-docs-home">
|
||||
|
||||
<!-- Page content of course! -->
|
||||
{{ content }}
|
||||
|
||||
<!-- JS and analytics only. -->
|
||||
{% include footer.html %}
|
||||
|
||||
</body>
|
||||
</html>
|
|
@ -9,24 +9,58 @@
|
|||
-------------------------------------------------- */
|
||||
|
||||
body {
|
||||
padding-top: 54px;
|
||||
position: relative; /* For scrollyspy */
|
||||
/* We add the padding to the body for >768px only */
|
||||
}
|
||||
|
||||
/* */
|
||||
.bs-docs-footer {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
hr {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.bs-docs-dl-options h4 {
|
||||
margin-top: 15px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.bs-docs-container,
|
||||
.bs-home-container {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
.bs-docs-container {
|
||||
max-width: 860px;
|
||||
}
|
||||
.bs-docs-container .row {
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
|
||||
/* Side notes for calling out things */
|
||||
.bs-docs-sidenote {
|
||||
margin: 20px 0;
|
||||
padding: 15px 30px 15px 15px;
|
||||
background-color: #fcf2f2;
|
||||
border-left: 5px solid #df7c7b;
|
||||
}
|
||||
.bs-docs-sidenote h4 {
|
||||
margin-top: 0;
|
||||
}
|
||||
.bs-docs-sidenote p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.bs-docs-sidenote code,
|
||||
.bs-docs-sidenote .highlight {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
|
||||
/* Sections
|
||||
-------------------------------------------------- */
|
||||
|
||||
/* Padding for in-page bookmarks */
|
||||
section {
|
||||
section,
|
||||
.bs-docs-section {
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
|
@ -41,69 +75,42 @@ section > ul li {
|
|||
|
||||
|
||||
|
||||
/* Navbar
|
||||
-------------------------------------------------- */
|
||||
|
||||
.bs-docs-navbar {
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #ccc; /* IE8 */
|
||||
border-bottom: 1px solid rgba(0,0,0,.1);
|
||||
}
|
||||
.bs-docs-navbar .nav > .active > a,
|
||||
.bs-docs-navbar .nav > .active > a:hover {
|
||||
font-weight: 500;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Jumbotrons
|
||||
-------------------------------------------------- */
|
||||
|
||||
.bs-docs-section-header {
|
||||
padding-top: 60px;
|
||||
color: #b94a48;
|
||||
border-bottom: 5px solid #b94a48;
|
||||
}
|
||||
|
||||
/* Base class */
|
||||
.bs-docs-jumbotron {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
padding: 30px 15px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background-color: #b94a48;
|
||||
}
|
||||
.bs-docs-jumbotron h1 {
|
||||
font-size: 50px;
|
||||
}
|
||||
|
||||
/* Link styles (used on .masthead-links as well) */
|
||||
.bs-docs-jumbotron a {
|
||||
color: #fff;
|
||||
color: rgba(255,255,255,.5);
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
transition: all .2s ease-in-out;
|
||||
}
|
||||
.bs-docs-jumbotron a:hover {
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/* Download button */
|
||||
.bs-docs-jumbotron .btn {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
padding: 18px 24px;
|
||||
font-size: 21px;
|
||||
color: #b94a48; /* redeclare to override the `.jumbotron a` */
|
||||
background-color: #fff;
|
||||
border-color: #e5e5e5;
|
||||
}
|
||||
.bs-docs-jumbotron .btn,
|
||||
.bs-docs-jumbotron .btn:hover,
|
||||
.bs-docs-jumbotron .btn:active {
|
||||
color: #b94a48; /* redeclare to override the `.jumbotron a` */
|
||||
background-color: #fff;
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
/* Masthead (docs home)
|
||||
------------------------- */
|
||||
.masthead h1 {
|
||||
line-height: 1;
|
||||
color: #fff; /* redeclare to override the `.jumbotron a` */
|
||||
background-color: #b94a48;
|
||||
border-color: #b94a48;
|
||||
}
|
||||
|
||||
/* Textual links in masthead */
|
||||
|
@ -113,42 +120,10 @@ section > ul li {
|
|||
}
|
||||
.masthead-links li {
|
||||
display: inline;
|
||||
padding: 0 10px;
|
||||
color: rgba(255,255,255,.25);
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Marketing section of Overview
|
||||
-------------------------------------------------- */
|
||||
|
||||
.bs-docs-marketing {
|
||||
text-align: center;
|
||||
color: #5a5a5a;
|
||||
}
|
||||
.bs-docs-marketing h1 {
|
||||
margin: 60px 0 10px;
|
||||
font-size: 50px;
|
||||
line-height: 1;
|
||||
}
|
||||
.bs-docs-marketing h2 {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.bs-docs-marketing p {
|
||||
font-size: 16px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.bs-docs-marketing .marketing-byline {
|
||||
margin-bottom: 40px;
|
||||
font-size: 21px;
|
||||
font-weight: 300;
|
||||
line-height: 1.25;
|
||||
color: #999;
|
||||
}
|
||||
.marketing-img {
|
||||
display: block;
|
||||
margin: 30px auto 10px;
|
||||
max-height: 145px;
|
||||
.masthead-links li + li {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
|
||||
|
@ -159,13 +134,13 @@ section > ul li {
|
|||
.show-grid {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.show-grid [class*="col-span-"] {
|
||||
.show-grid .col {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
background-color: #eee;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.show-grid [class*="col-span-"]:hover {
|
||||
.show-grid .col:hover {
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
|
@ -174,33 +149,84 @@ section > ul li {
|
|||
/* Sidenav
|
||||
-------------------------------------------------- */
|
||||
|
||||
/* Base styles are not affixable given mobile-first */
|
||||
.bs-docs-sidenav {
|
||||
margin: 20px 0 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.bs-docs-sidenav.affix {
|
||||
position: static;
|
||||
.bs-docs-sidebar {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 240px;
|
||||
overflow-y: scroll;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
background-color: #f5f5f5;
|
||||
box-shadow: inset -1px 0 0 #e5e5e5;
|
||||
}
|
||||
|
||||
/* Chevrons within each link */
|
||||
.bs-docs-sidenav .glyphicon-chevron-right {
|
||||
float: right;
|
||||
margin-top: 1px;
|
||||
margin-right: -6px;
|
||||
opacity: .25;
|
||||
color: #000;
|
||||
/* Nav: first level */
|
||||
.bs-docs-sidebar > .nav {
|
||||
margin: 0 0 25px 0;
|
||||
}
|
||||
.bs-docs-sidenav a:hover .glyphicon-chevron-right {
|
||||
opacity: .5;
|
||||
.bs-docs-sidebar .nav > li > a {
|
||||
display: block;
|
||||
color: #666;
|
||||
padding: 4px 25px;
|
||||
}
|
||||
.bs-docs-sidenav .active .glyphicon-chevron-right,
|
||||
.bs-docs-sidenav .active a:hover .glyphicon-chevron-right {
|
||||
color: #fff;
|
||||
opacity: 1;
|
||||
.bs-docs-sidebar .nav > li > a:hover,
|
||||
.bs-docs-sidebar .nav > li > a:focus {
|
||||
text-decoration: none;
|
||||
border-right: 1px solid #d5d5d5;
|
||||
}
|
||||
.bs-docs-sidebar .nav > .active > a,
|
||||
.bs-docs-sidebar .nav > .active:hover > a,
|
||||
.bs-docs-sidebar .nav > .active:focus > a {
|
||||
font-weight: 500;
|
||||
color: #b94a48;
|
||||
background-color: transparent;
|
||||
border-right: 1px solid #b94a48;
|
||||
}
|
||||
|
||||
/* Nav: second level (shown on .active) */
|
||||
.bs-docs-sidebar .nav .nav {
|
||||
display: none;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.bs-docs-sidebar .nav > .active > ul {
|
||||
display: block;
|
||||
}
|
||||
.bs-docs-sidebar .nav .nav > li > a {
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
padding-left: 40px;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
.bs-docs-sidenav-heading {
|
||||
margin: 0 0 25px;
|
||||
}
|
||||
.bs-docs-sidenav-heading a {
|
||||
display: block;
|
||||
padding: 15px 25px;
|
||||
color: #b94a48;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
box-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
.bs-docs-sidenav-heading a:hover {
|
||||
color: #a3403e;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Section headings for groups of links */
|
||||
.bs-docs-sidenav > li > .nav-header {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
.bs-docs-sidenav > .active > .nav-header,
|
||||
.bs-docs-sidenav > .active > .nav-header:hover {
|
||||
color: #333;
|
||||
border-color: #333;
|
||||
}
|
||||
|
||||
|
||||
|
@ -240,9 +266,6 @@ section > ul li {
|
|||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
.prettyprint .linenums {
|
||||
/*margin-left: 0;*/
|
||||
}
|
||||
|
||||
/* Tweak content of examples for optimum awesome */
|
||||
.bs-docs-example > p:last-child,
|
||||
|
@ -254,7 +277,10 @@ section > ul li {
|
|||
.bs-docs-example > textarea:last-child,
|
||||
.bs-docs-example > .table:last-child,
|
||||
.bs-docs-example > .jumbotron:last-child,
|
||||
.bs-docs-example > .alert:last-child {
|
||||
.bs-docs-example > .alert:last-child,
|
||||
.bs-docs-example > .panel:last-child,
|
||||
.bs-docs-example > .list-group:last-child,
|
||||
.bs-docs-example > .well:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
@ -282,20 +308,31 @@ section > ul li {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
/* List groups */
|
||||
.bs-docs-example > .list-group {
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
/* Navbar examples */
|
||||
.bs-navbar-top-example,
|
||||
.bs-navbar-bottom-example {
|
||||
z-index: 1;
|
||||
padding: 0;
|
||||
height: 90px;
|
||||
min-height: 110px;
|
||||
overflow: hidden; /* cut the drop shadows off */
|
||||
}
|
||||
.bs-navbar-top-example .navbar-fixed-top,
|
||||
.bs-navbar-bottom-example .navbar-fixed-bottom {
|
||||
position: relative;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
.bs-navbar-top-example .navbar-fixed-top {
|
||||
top: -1px;
|
||||
}
|
||||
.bs-navbar-bottom-example .navbar-fixed-bottom {
|
||||
bottom: -1px;
|
||||
}
|
||||
.bs-navbar-top-example {
|
||||
-webkit-border-radius: 0 0 4px 4px;
|
||||
-moz-border-radius: 0 0 4px 4px;
|
||||
|
@ -345,7 +382,7 @@ section > ul li {
|
|||
margin-bottom: 5px;
|
||||
}
|
||||
.bs-docs-example-submenu {
|
||||
min-height: 180px;
|
||||
min-height: 230px;
|
||||
}
|
||||
.bs-docs-example-submenu > .pull-left + .pull-left {
|
||||
margin-left: 20px;
|
||||
|
@ -356,6 +393,30 @@ section > ul li {
|
|||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* Tooltips */
|
||||
.bs-docs-tooltip-examples {
|
||||
text-align: center;
|
||||
margin: 0 0 10px;
|
||||
list-style: none;
|
||||
}
|
||||
.bs-docs-tooltip-examples li {
|
||||
display: inline;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
/* Popovers */
|
||||
.bs-docs-example-popover {
|
||||
padding-bottom: 24px;
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
.bs-docs-example-popover .popover {
|
||||
position: relative;
|
||||
display: block;
|
||||
float: left;
|
||||
width: 260px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
|
||||
/* Example templates
|
||||
-------------------------------------------------- */
|
||||
|
@ -485,8 +546,8 @@ section > ul li {
|
|||
-------------------------------------------------- */
|
||||
|
||||
.bs-docs-footer {
|
||||
text-align: center;
|
||||
padding: 30px 0;
|
||||
padding-top: 30px;
|
||||
padding-bottom: 30px;
|
||||
margin-top: 100px;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
}
|
||||
|
@ -507,22 +568,22 @@ section > ul li {
|
|||
|
||||
/* Social proof buttons from GitHub & Twitter */
|
||||
.bs-docs-social {
|
||||
margin-top: 10px;
|
||||
margin-top: 80px;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
/* Quick links on Home */
|
||||
.bs-docs-social-buttons {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0 10px;
|
||||
list-style: none;
|
||||
}
|
||||
.bs-docs-social-buttons li {
|
||||
display: inline-block;
|
||||
padding: 5px 8px;
|
||||
line-height: 1;
|
||||
}
|
||||
.bs-docs-social-buttons li + li {
|
||||
margin-left: 15px;
|
||||
}
|
||||
.bs-docs-social-buttons .twitter-follow-button {
|
||||
width: 225px !important;
|
||||
}
|
||||
|
@ -564,6 +625,7 @@ input.focused {
|
|||
margin-bottom: 0;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.highlight pre code {
|
||||
font-size: inherit;
|
||||
|
@ -605,9 +667,46 @@ input.focused {
|
|||
/* Tablets and up */
|
||||
@media screen and (min-width: 768px) {
|
||||
|
||||
/* Back to top link */
|
||||
.bs-docs-top {
|
||||
float: left;
|
||||
padding: 7px 15px;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
background-color: #eee;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.bs-docs-top:hover {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background-color: #999;
|
||||
}
|
||||
.bs-docs-top.affix {
|
||||
position: fixed;
|
||||
right: 15px;
|
||||
bottom: 15px;
|
||||
}
|
||||
|
||||
.bs-docs-section-header h1 {
|
||||
font-size: 80px;
|
||||
font-size: 8rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/* Account for fixed navbar (which is static to start) */
|
||||
body {
|
||||
padding-top: 50px; /* Default height of navbar */
|
||||
.bs-docs-docs {
|
||||
padding-left: 260px;
|
||||
}
|
||||
|
||||
/* Undo custom padding */
|
||||
.bs-docs-container {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
/* Show the docs nav */
|
||||
.bs-docs-sidebar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Tweak display of docs jumbotrons */
|
||||
|
@ -619,9 +718,9 @@ input.focused {
|
|||
font-size: 100px;
|
||||
}
|
||||
.masthead p {
|
||||
margin-left: 15%;
|
||||
margin-right: 15%;
|
||||
font-size: 30px;
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
}
|
||||
.subhead {
|
||||
padding-top: 60px;
|
||||
|
@ -629,37 +728,31 @@ input.focused {
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
/* From here, start to affix the nav because we keep columns here */
|
||||
.bs-docs-sidenav.affix {
|
||||
position: fixed;
|
||||
top: 54px;
|
||||
}
|
||||
.bs-docs-sidenav {
|
||||
width: 170px;
|
||||
}
|
||||
.bs-docs-sidenav.affix-bottom {
|
||||
.bs-navbar-top-example .navbar-fixed-top,
|
||||
.bs-navbar-bottom-example .navbar-fixed-bottom {
|
||||
position: absolute;
|
||||
top: auto;
|
||||
bottom: 270px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Tablets/desktops and up */
|
||||
@media screen and (min-width: 992px) {
|
||||
|
||||
.bs-docs-docs {
|
||||
padding-left: 280px;
|
||||
}
|
||||
|
||||
/* Icons */
|
||||
.the-icons li {
|
||||
width: 12.5%;
|
||||
}
|
||||
|
||||
.bs-docs-sidenav {
|
||||
width: 220px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Large desktops and up */
|
||||
@media screen and (min-width: 1200px) {
|
||||
.bs-docs-sidenav {
|
||||
width: 260px;
|
||||
.bs-docs-docs {
|
||||
padding-left: 300px;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Before Width: | Height: | Size: 30 KiB |
Before Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 6.3 KiB |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 30 KiB |
Before Width: | Height: | Size: 204 KiB |
After Width: | Height: | Size: 44 KiB |
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 16 KiB |
Before Width: | Height: | Size: 54 KiB |
Before Width: | Height: | Size: 172 KiB |
Before Width: | Height: | Size: 205 KiB |
Before Width: | Height: | Size: 81 KiB |
Before Width: | Height: | Size: 134 KiB |
Before Width: | Height: | Size: 134 KiB |
Before Width: | Height: | Size: 84 B |
|
@ -103,4 +103,4 @@ examples:
|
|||
|
||||
data-toggle="button"
|
||||
data-toggle="buttons-checkbox"
|
||||
data-toggle="buttons-radio"
|
||||
data-toggle="buttons-radio"
|
||||
|
|
|
@ -13,14 +13,18 @@
|
|||
e.preventDefault()
|
||||
})
|
||||
|
||||
// side bar
|
||||
// back to top
|
||||
// setTimeout(function () {
|
||||
// $('.bs-docs-sidenav').affix({
|
||||
// offset: {
|
||||
// top: function () { return $window.width() <= 980 ? 290 : 210 }
|
||||
// , bottom: 270
|
||||
// }
|
||||
// })
|
||||
// }, 100)
|
||||
|
||||
setTimeout(function () {
|
||||
$('.bs-docs-sidenav').affix({
|
||||
offset: {
|
||||
top: function () { return $window.width() <= 980 ? 290 : 210 }
|
||||
, bottom: 270
|
||||
}
|
||||
})
|
||||
$('.bs-docs-top').affix()
|
||||
}, 100)
|
||||
|
||||
// make code pretty
|
||||
|
@ -49,6 +53,11 @@
|
|||
$('.tooltip-test').tooltip()
|
||||
$('.popover-test').popover()
|
||||
|
||||
$('.bs-docs-navbar').tooltip({
|
||||
selector: "a[data-toggle=tooltip]",
|
||||
container: ".bs-docs-navbar .nav"
|
||||
})
|
||||
|
||||
// popover demo
|
||||
$("a[data-toggle=popover]")
|
||||
.popover()
|
||||
|
|
|
@ -114,4 +114,4 @@
|
|||
})
|
||||
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -96,4 +96,4 @@
|
|||
|
||||
$(document).on('click.alert.data-api', dismiss, Alert.prototype.close)
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -102,4 +102,4 @@
|
|||
$btn.button('toggle')
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -204,4 +204,4 @@
|
|||
e.preventDefault()
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -164,4 +164,4 @@
|
|||
$(target).collapse(option)
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -97,7 +97,7 @@
|
|||
this.activeTarget = target
|
||||
|
||||
$(this.selector)
|
||||
.parent('.active')
|
||||
.parents('.active')
|
||||
.removeClass('active')
|
||||
|
||||
selector = this.selector
|
||||
|
@ -105,7 +105,7 @@
|
|||
+ this.selector + '[href="' + target + '"]'
|
||||
|
||||
active = $(selector)
|
||||
.parent('li')
|
||||
.parents('li')
|
||||
.addClass('active')
|
||||
|
||||
if (active.parent('.dropdown-menu').length) {
|
||||
|
@ -159,4 +159,4 @@
|
|||
})
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -141,4 +141,4 @@
|
|||
$(this).tab('show')
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -57,4 +57,4 @@
|
|||
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -57,7 +57,8 @@
|
|||
|
||||
})
|
||||
|
||||
}(window.jQuery);/* ==========================================================
|
||||
}(window.jQuery);
|
||||
/* ==========================================================
|
||||
* bootstrap-alert.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#alerts
|
||||
* ==========================================================
|
||||
|
@ -155,7 +156,8 @@
|
|||
|
||||
$(document).on('click.alert.data-api', dismiss, Alert.prototype.close)
|
||||
|
||||
}(window.jQuery);/* ============================================================
|
||||
}(window.jQuery);
|
||||
/* ============================================================
|
||||
* bootstrap-button.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#buttons
|
||||
* ============================================================
|
||||
|
@ -259,7 +261,8 @@
|
|||
$btn.button('toggle')
|
||||
})
|
||||
|
||||
}(window.jQuery);/* ==========================================================
|
||||
}(window.jQuery);
|
||||
/* ==========================================================
|
||||
* bootstrap-carousel.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#carousel
|
||||
* ==========================================================
|
||||
|
@ -465,7 +468,8 @@
|
|||
e.preventDefault()
|
||||
})
|
||||
|
||||
}(window.jQuery);/* =============================================================
|
||||
}(window.jQuery);
|
||||
/* =============================================================
|
||||
* bootstrap-collapse.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#collapse
|
||||
* =============================================================
|
||||
|
@ -631,7 +635,8 @@
|
|||
$(target).collapse(option)
|
||||
})
|
||||
|
||||
}(window.jQuery);/* ============================================================
|
||||
}(window.jQuery);
|
||||
/* ============================================================
|
||||
* bootstrap-dropdown.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#dropdowns
|
||||
* ============================================================
|
||||
|
@ -1621,7 +1626,7 @@
|
|||
this.activeTarget = target
|
||||
|
||||
$(this.selector)
|
||||
.parent('.active')
|
||||
.parents('.active')
|
||||
.removeClass('active')
|
||||
|
||||
selector = this.selector
|
||||
|
@ -1629,7 +1634,7 @@
|
|||
+ this.selector + '[href="' + target + '"]'
|
||||
|
||||
active = $(selector)
|
||||
.parent('li')
|
||||
.parents('li')
|
||||
.addClass('active')
|
||||
|
||||
if (active.parent('.dropdown-menu').length) {
|
||||
|
@ -1683,7 +1688,8 @@
|
|||
})
|
||||
})
|
||||
|
||||
}(window.jQuery);/* ========================================================
|
||||
}(window.jQuery);
|
||||
/* ========================================================
|
||||
* bootstrap-tab.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#tabs
|
||||
* ========================================================
|
||||
|
@ -1826,7 +1832,8 @@
|
|||
$(this).tab('show')
|
||||
})
|
||||
|
||||
}(window.jQuery);/* =============================================================
|
||||
}(window.jQuery);
|
||||
/* =============================================================
|
||||
* bootstrap-typeahead.js v3.0.0
|
||||
* http://twitter.github.com/bootstrap/javascript.html#typeahead
|
||||
* =============================================================
|
||||
|
@ -2277,4 +2284,4 @@
|
|||
})
|
||||
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -398,4 +398,4 @@ if ( typeof define === "function" && define.amd ) {
|
|||
define( "Holder", [], function () { return app; } );
|
||||
}
|
||||
|
||||
})(Holder, window);
|
||||
})(Holder, window);
|
||||
|
|
|
@ -3,4 +3,4 @@
|
|||
window.matchMedia=window.matchMedia||function(a){"use strict";var c,d=a.documentElement,e=d.firstElementChild||d.firstChild,f=a.createElement("body"),g=a.createElement("div");return g.id="mq-test-1",g.style.cssText="position:absolute;top:-100em",f.style.background="none",f.appendChild(g),function(a){return g.innerHTML='­<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',d.insertBefore(f,e),c=42===g.offsetWidth,d.removeChild(f),{matches:c,media:a}}}(document);
|
||||
|
||||
/*! Respond.js v1.1.0: min/max-width media query polyfill. (c) Scott Jehl. MIT/GPLv2 Lic. j.mp/respondjs */
|
||||
(function(a){"use strict";function x(){u(!0)}var b={};a.respond=b,b.update=function(){},b.mediaQueriesSupported=a.matchMedia&&a.matchMedia("only all").matches,b.mediaQueriesSupported;var q,r,t,c=a.document,d=c.documentElement,e=[],f=[],g=[],h={},i=30,j=c.getElementsByTagName("head")[0]||d,k=c.getElementsByTagName("base")[0],l=j.getElementsByTagName("link"),m=[],n=function(){for(var b=0;l.length>b;b++){var c=l[b],d=c.href,e=c.media,f=c.rel&&"stylesheet"===c.rel.toLowerCase();d&&f&&!h[d]&&(c.styleSheet&&c.styleSheet.rawCssText?(p(c.styleSheet.rawCssText,d,e),h[d]=!0):(!/^([a-zA-Z:]*\/\/)/.test(d)&&!k||d.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&m.push({href:d,media:e}))}o()},o=function(){if(m.length){var a=m.shift();v(a.href,function(b){p(b,a.href,a.media),h[a.href]=!0,setTimeout(function(){o()},0)})}},p=function(a,b,c){var d=a.match(/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi),g=d&&d.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+b+"$2$3")},i=!g&&c;b.length&&(b+="/"),i&&(g=1);for(var j=0;g>j;j++){var k,l,m,n;i?(k=c,f.push(h(a))):(k=d[j].match(/@media *([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1,f.push(RegExp.$2&&h(RegExp.$2))),m=k.split(","),n=m.length;for(var o=0;n>o;o++)l=m[o],e.push({media:l.split("(")[0].match(/(only\s+)?([a-zA-Z]+)\s?/)&&RegExp.$2||"all",rules:f.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(/\(min\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(/\(max\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},s=function(){var a,b=c.createElement("div"),e=c.body,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",e||(e=f=c.createElement("body"),e.style.background="none"),e.appendChild(b),d.insertBefore(e,d.firstChild),a=b.offsetWidth,f?d.removeChild(e):e.removeChild(b),a=t=parseFloat(a)},u=function(a){var b="clientWidth",h=d[b],k="CSS1Compat"===c.compatMode&&h||c.body[b]||h,m={},n=l[l.length-1],o=(new Date).getTime();if(a&&q&&i>o-q)return clearTimeout(r),r=setTimeout(u,i),void 0;q=o;for(var p in e)if(e.hasOwnProperty(p)){var v=e[p],w=v.minw,x=v.maxw,y=null===w,z=null===x,A="em";w&&(w=parseFloat(w)*(w.indexOf(A)>-1?t||s():1)),x&&(x=parseFloat(x)*(x.indexOf(A)>-1?t||s():1)),v.hasquery&&(y&&z||!(y||k>=w)||!(z||x>=k))||(m[v.media]||(m[v.media]=[]),m[v.media].push(f[v.rules]))}for(var B in g)g.hasOwnProperty(B)&&g[B]&&g[B].parentNode===j&&j.removeChild(g[B]);for(var C in m)if(m.hasOwnProperty(C)){var D=c.createElement("style"),E=m[C].join("\n");D.type="text/css",D.media=C,j.insertBefore(D,n.nextSibling),D.styleSheet?D.styleSheet.cssText=E:D.appendChild(c.createTextNode(E)),g.push(D)}},v=function(a,b){var c=w();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},w=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}();n(),b.update=n,a.addEventListener?a.addEventListener("resize",x,!1):a.attachEvent&&a.attachEvent("onresize",x)})(this);
|
||||
(function(a){"use strict";function x(){u(!0)}var b={};a.respond=b,b.update=function(){},b.mediaQueriesSupported=a.matchMedia&&a.matchMedia("only all").matches,b.mediaQueriesSupported;var q,r,t,c=a.document,d=c.documentElement,e=[],f=[],g=[],h={},i=30,j=c.getElementsByTagName("head")[0]||d,k=c.getElementsByTagName("base")[0],l=j.getElementsByTagName("link"),m=[],n=function(){for(var b=0;l.length>b;b++){var c=l[b],d=c.href,e=c.media,f=c.rel&&"stylesheet"===c.rel.toLowerCase();d&&f&&!h[d]&&(c.styleSheet&&c.styleSheet.rawCssText?(p(c.styleSheet.rawCssText,d,e),h[d]=!0):(!/^([a-zA-Z:]*\/\/)/.test(d)&&!k||d.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&m.push({href:d,media:e}))}o()},o=function(){if(m.length){var a=m.shift();v(a.href,function(b){p(b,a.href,a.media),h[a.href]=!0,setTimeout(function(){o()},0)})}},p=function(a,b,c){var d=a.match(/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi),g=d&&d.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+b+"$2$3")},i=!g&&c;b.length&&(b+="/"),i&&(g=1);for(var j=0;g>j;j++){var k,l,m,n;i?(k=c,f.push(h(a))):(k=d[j].match(/@media *([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1,f.push(RegExp.$2&&h(RegExp.$2))),m=k.split(","),n=m.length;for(var o=0;n>o;o++)l=m[o],e.push({media:l.split("(")[0].match(/(only\s+)?([a-zA-Z]+)\s?/)&&RegExp.$2||"all",rules:f.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(/\(min\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(/\(max\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},s=function(){var a,b=c.createElement("div"),e=c.body,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",e||(e=f=c.createElement("body"),e.style.background="none"),e.appendChild(b),d.insertBefore(e,d.firstChild),a=b.offsetWidth,f?d.removeChild(e):e.removeChild(b),a=t=parseFloat(a)},u=function(a){var b="clientWidth",h=d[b],k="CSS1Compat"===c.compatMode&&h||c.body[b]||h,m={},n=l[l.length-1],o=(new Date).getTime();if(a&&q&&i>o-q)return clearTimeout(r),r=setTimeout(u,i),void 0;q=o;for(var p in e)if(e.hasOwnProperty(p)){var v=e[p],w=v.minw,x=v.maxw,y=null===w,z=null===x,A="em";w&&(w=parseFloat(w)*(w.indexOf(A)>-1?t||s():1)),x&&(x=parseFloat(x)*(x.indexOf(A)>-1?t||s():1)),v.hasquery&&(y&&z||!(y||k>=w)||!(z||x>=k))||(m[v.media]||(m[v.media]=[]),m[v.media].push(f[v.rules]))}for(var B in g)g.hasOwnProperty(B)&&g[B]&&g[B].parentNode===j&&j.removeChild(g[B]);for(var C in m)if(m.hasOwnProperty(C)){var D=c.createElement("style"),E=m[C].join("\n");D.type="text/css",D.media=C,j.insertBefore(D,n.nextSibling),D.styleSheet?D.styleSheet.cssText=E:D.appendChild(c.createTextNode(E)),g.push(D)}},v=function(a,b){var c=w();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},w=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}();n(),b.update=n,a.addEventListener?a.addEventListener("resize",x,!1):a.attachEvent&&a.attachEvent("onresize",x)})(this);
|
||||
|
|
1977
docs/components.html
2428
docs/css.html
|
@ -3,32 +3,17 @@ layout: default
|
|||
title: Customize and download
|
||||
---
|
||||
|
||||
<div class="bs-docs-sidebar">
|
||||
<h5 class="bs-docs-sidenav-heading">Customize and download</h5>
|
||||
<ul class="nav bs-docs-sidenav">
|
||||
<li><a href="#components">1. Choose components</a></li>
|
||||
<li><a href="#plugins">2. Select jQuery plugins</a></li>
|
||||
<li><a href="#variables">3. Customize variables</a></li>
|
||||
<li><a href="#download">4. Download</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Masthead
|
||||
================================================== -->
|
||||
<header class="bs-docs-jumbotron subhead">
|
||||
<div class="container">
|
||||
<h1>Customize and download</h1>
|
||||
<p class="lead"><a href="https://github.com/twitter/bootstrap/zipball/master">Download Bootstrap</a> or customize variables, components, JavaScript plugins, and more.</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container">
|
||||
|
||||
<!-- Docs nav
|
||||
================================================== -->
|
||||
<div class="row">
|
||||
<div class="col-span-3 bs-docs-sidebar">
|
||||
<ul class="nav nav-list bs-docs-sidenav">
|
||||
<li><a href="#components"><i class="glyphicon glyphicon-chevron-right"></i> 1. Choose components</a></li>
|
||||
<li><a href="#plugins"><i class="glyphicon glyphicon-chevron-right"></i> 2. Select jQuery plugins</a></li>
|
||||
<li><a href="#variables"><i class="glyphicon glyphicon-chevron-right"></i> 3. Customize variables</a></li>
|
||||
<li><a href="#download"><i class="glyphicon glyphicon-chevron-right"></i> 4. Download</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-span-9">
|
||||
|
||||
<div class="container bs-docs-container">
|
||||
|
||||
<!-- Customize form
|
||||
================================================== -->
|
||||
|
@ -41,7 +26,7 @@ title: Customize and download
|
|||
</h1>
|
||||
</div>
|
||||
<div class="row download-builder">
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<h3>Scaffolding</h3>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="reset.less"> Normalize and reset</label>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="print.less"> Print</label>
|
||||
|
@ -57,7 +42,7 @@ title: Customize and download
|
|||
<label class="checkbox"><input checked="checked" type="checkbox" value="buttons.less"> Buttons</label>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="sprites.less"> Icons</label>
|
||||
</div><!-- /span -->
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<h3>Components</h3>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="button-groups.less"> Button groups and dropdowns</label>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="navs.less"> Navs, tabs, and pills</label>
|
||||
|
@ -78,7 +63,7 @@ title: Customize and download
|
|||
<label class="checkbox"><input checked="checked" type="checkbox" value="accordion.less"> Collapse</label>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="carousel.less"> Carousel</label>
|
||||
</div><!-- /span -->
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<h3>Miscellaneous</h3>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="wells.less"> Wells</label>
|
||||
<label class="checkbox"><input checked="checked" type="checkbox" value="close.less"> Close icon</label>
|
||||
|
@ -102,7 +87,7 @@ title: Customize and download
|
|||
</h1>
|
||||
</div>
|
||||
<div class="row download-builder">
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<label class="checkbox">
|
||||
<input type="checkbox" checked="true" value="bootstrap-transition.js">
|
||||
Transitions <small>(required for any animation)</small>
|
||||
|
@ -132,7 +117,7 @@ title: Customize and download
|
|||
Popovers <small>(requires Tooltips)</small>
|
||||
</label>
|
||||
</div><!-- /span -->
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<label class="checkbox">
|
||||
<input type="checkbox" checked="true" value="bootstrap-affix.js">
|
||||
Affix
|
||||
|
@ -158,7 +143,7 @@ title: Customize and download
|
|||
Typeahead
|
||||
</label>
|
||||
</div><!-- /span -->
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<h4 class="muted">Heads up!</h4>
|
||||
<p class="muted">All checked plugins will be compiled into a single file, bootstrap.js. All plugins require the latest version of <a href="http://jquery.com/" target="_blank">jQuery</a> to be included.</p>
|
||||
</div><!-- /span -->
|
||||
|
@ -174,183 +159,183 @@ title: Customize and download
|
|||
</h1>
|
||||
</div>
|
||||
<div class="row download-builder">
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
<h3>Scaffolding</h3>
|
||||
<label>@body-background</label>
|
||||
<input type="text" class="span3" placeholder="#fff">
|
||||
<input type="text" placeholder="#fff">
|
||||
<label>@text-color</label>
|
||||
<input type="text" class="span3" placeholder="@grayDark">
|
||||
<input type="text" placeholder="@grayDark">
|
||||
|
||||
<h3>Links</h3>
|
||||
<label>@link-color</label>
|
||||
<input type="text" class="span3" placeholder="#08c">
|
||||
<input type="text" placeholder="#08c">
|
||||
<label>@link-color-hover</label>
|
||||
<input type="text" class="span3" placeholder="darken(@link-color, 15%)">
|
||||
<input type="text" placeholder="darken(@link-color, 15%)">
|
||||
|
||||
<h3>Grid system</h3>
|
||||
<label>@grid-columns</label>
|
||||
<input type="text" class="span3" placeholder="12">
|
||||
<input type="text" placeholder="12">
|
||||
<label>@grid-column-width</label>
|
||||
<input type="text" class="span3" placeholder="60px">
|
||||
<input type="text" placeholder="60px">
|
||||
<label>@grid-gutter-width</label>
|
||||
<input type="text" class="span3" placeholder="20px">
|
||||
<input type="text" placeholder="20px">
|
||||
<label>@grid-column-width-1200</label>
|
||||
<input type="text" class="span3" placeholder="70px">
|
||||
<input type="text" placeholder="70px">
|
||||
<label>@grid-gutter-width-1200</label>
|
||||
<input type="text" class="span3" placeholder="30px">
|
||||
<input type="text" placeholder="30px">
|
||||
<label>@grid-column-width-768</label>
|
||||
<input type="text" class="span3" placeholder="42px">
|
||||
<input type="text" placeholder="42px">
|
||||
<label>@grid-gutter-width-768</label>
|
||||
<input type="text" class="span3" placeholder="20px">
|
||||
<input type="text" placeholder="20px">
|
||||
|
||||
</div><!-- /span -->
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
|
||||
<h3>Typography</h3>
|
||||
<label>@font-family-sans-serif</label>
|
||||
<input type="text" class="span3" placeholder="'Helvetica Neue', Helvetica, Arial, sans-serif">
|
||||
<input type="text" placeholder="'Helvetica Neue', Helvetica, Arial, sans-serif">
|
||||
<label>@font-family-serif</label>
|
||||
<input type="text" class="span3" placeholder="Georgia, 'Times New Roman', Times, serif">
|
||||
<input type="text" placeholder="Georgia, 'Times New Roman', Times, serif">
|
||||
<label>@font-family-monospace</label>
|
||||
<input type="text" class="span3" placeholder="Menlo, Monaco, 'Courier New', monospace">
|
||||
<input type="text" placeholder="Menlo, Monaco, 'Courier New', monospace">
|
||||
|
||||
<label>@font-size-base</label>
|
||||
<input type="text" class="span3" placeholder="14px">
|
||||
<input type="text" placeholder="14px">
|
||||
<label>@font-family-base</label>
|
||||
<input type="text" class="span3" placeholder="@font-family-sans-serif">
|
||||
<input type="text" placeholder="@font-family-sans-serif">
|
||||
<label>@line-height-base</label>
|
||||
<input type="text" class="span3" placeholder="20px">
|
||||
<input type="text" placeholder="20px">
|
||||
|
||||
<label>@headings-font-family</label>
|
||||
<input type="text" class="span3" placeholder="inherit">
|
||||
<input type="text" placeholder="inherit">
|
||||
<label>@headings-font-weight</label>
|
||||
<input type="text" class="span3" placeholder="bold">
|
||||
<input type="text" placeholder="bold">
|
||||
<label>@headingsColor</label>
|
||||
<input type="text" class="span3" placeholder="inherit">
|
||||
<input type="text" placeholder="inherit">
|
||||
|
||||
<label>@font-size-large</label>
|
||||
<input type="text" class="span3" placeholder="@font-size-base * 1.25">
|
||||
<input type="text" placeholder="@font-size-base * 1.25">
|
||||
<label>@font-size-small</label>
|
||||
<input type="text" class="span3" placeholder="@font-size-base * 0.85">
|
||||
<input type="text" placeholder="@font-size-base * 0.85">
|
||||
<label>@font-size-mini</label>
|
||||
<input type="text" class="span3" placeholder="@font-size-base * 0.75">
|
||||
<input type="text" placeholder="@font-size-base * 0.75">
|
||||
|
||||
<label>@padding-large</label>
|
||||
<input type="text" class="span3" placeholder="11px 19px">
|
||||
<input type="text" placeholder="11px 19px">
|
||||
<label>@padding-small</label>
|
||||
<input type="text" class="span3" placeholder="2px 10px">
|
||||
<input type="text" placeholder="2px 10px">
|
||||
<label>@padding-mini</label>
|
||||
<input type="text" class="span3" placeholder="1px 6px">
|
||||
<input type="text" placeholder="1px 6px">
|
||||
|
||||
<label>@border-radius-base</label>
|
||||
<input type="text" class="span3" placeholder="4px">
|
||||
<input type="text" placeholder="4px">
|
||||
<label>@border-radius-large</label>
|
||||
<input type="text" class="span3" placeholder="6px">
|
||||
<input type="text" placeholder="6px">
|
||||
<label>@border-radius-small</label>
|
||||
<input type="text" class="span3" placeholder="3px">
|
||||
<input type="text" placeholder="3px">
|
||||
|
||||
<label>@hero-background</label>
|
||||
<input type="text" class="span3" placeholder="@grayLighter">
|
||||
<input type="text" placeholder="@grayLighter">
|
||||
<label>@hero-heading-color</label>
|
||||
<input type="text" class="span3" placeholder="inherit">
|
||||
<input type="text" placeholder="inherit">
|
||||
<label>@hero-lead-color</label>
|
||||
<input type="text" class="span3" placeholder="inherit">
|
||||
<input type="text" placeholder="inherit">
|
||||
|
||||
<h3>Tables</h3>
|
||||
<label>@table-background</label>
|
||||
<input type="text" class="span3" placeholder="transparent">
|
||||
<input type="text" placeholder="transparent">
|
||||
<label>@table-background-accent</label>
|
||||
<input type="text" class="span3" placeholder="#f9f9f9">
|
||||
<input type="text" placeholder="#f9f9f9">
|
||||
<label>@table-background-hover</label>
|
||||
<input type="text" class="span3" placeholder="#f5f5f5">
|
||||
<label>@table-border</label>
|
||||
<input type="text" class="span3" placeholder="#ddd">
|
||||
<input type="text" placeholder="#f5f5f5">
|
||||
<label>@table-border-color</label>
|
||||
<input type="text" placeholder="#ddd">
|
||||
|
||||
<h3>Forms</h3>
|
||||
<label>@input-color-placeholder</label>
|
||||
<input type="text" class="span3" placeholder="@grayLight">
|
||||
<input type="text" placeholder="@grayLight">
|
||||
<label>@input-background</label>
|
||||
<input type="text" class="span3" placeholder="#fff">
|
||||
<input type="text" placeholder="#fff">
|
||||
<label>@input-border</label>
|
||||
<input type="text" class="span3" placeholder="#ccc">
|
||||
<input type="text" placeholder="#ccc">
|
||||
<label>@input-border-radius</label>
|
||||
<input type="text" class="span3" placeholder="3px">
|
||||
<input type="text" placeholder="3px">
|
||||
<label>@input-background-disabled</label>
|
||||
<input type="text" class="span3" placeholder="@grayLighter">
|
||||
<input type="text" placeholder="@grayLighter">
|
||||
<label>@form-actions-background</label>
|
||||
<input type="text" class="span3" placeholder="#f5f5f5">
|
||||
<input type="text" placeholder="#f5f5f5">
|
||||
<label>@btn-backround-primary</label>
|
||||
<input type="text" class="span3" placeholder="@link-color">
|
||||
<input type="text" placeholder="@link-color">
|
||||
<label>@btn-backround-primary-highlight</label>
|
||||
<input type="text" class="span3" placeholder="darken(#fff, 10%)">
|
||||
<input type="text" placeholder="darken(#fff, 10%)">
|
||||
|
||||
</div><!-- /span -->
|
||||
<div class="span3">
|
||||
<div class="col-span-3">
|
||||
|
||||
<h3>Form states & alerts</h3>
|
||||
<label>@state-warning-text</label>
|
||||
<input type="text" class="span3" placeholder="#c09853">
|
||||
<input type="text" placeholder="#c09853">
|
||||
<label>@state-warning-background</label>
|
||||
<input type="text" class="span3" placeholder="#fcf8e3">
|
||||
<input type="text" placeholder="#fcf8e3">
|
||||
<label>@state-error-text</label>
|
||||
<input type="text" class="span3" placeholder="#b94a48">
|
||||
<input type="text" placeholder="#b94a48">
|
||||
<label>@state-error-background</label>
|
||||
<input type="text" class="span3" placeholder="#f2dede">
|
||||
<input type="text" placeholder="#f2dede">
|
||||
<label>@state-success-text</label>
|
||||
<input type="text" class="span3" placeholder="#468847">
|
||||
<input type="text" placeholder="#468847">
|
||||
<label>@state-success-background</label>
|
||||
<input type="text" class="span3" placeholder="#dff0d8">
|
||||
<input type="text" placeholder="#dff0d8">
|
||||
<label>@state-info-text</label>
|
||||
<input type="text" class="span3" placeholder="#3a87ad">
|
||||
<input type="text" placeholder="#3a87ad">
|
||||
<label>@state-info-background</label>
|
||||
<input type="text" class="span3" placeholder="#d9edf7">
|
||||
<input type="text" placeholder="#d9edf7">
|
||||
|
||||
<h3>Navbar</h3>
|
||||
<label>@navbar-height</label>
|
||||
<input type="text" class="span3" placeholder="40px">
|
||||
<input type="text" placeholder="40px">
|
||||
<label>@navbar-background</label>
|
||||
<input type="text" class="span3" placeholder="@grayDarker">
|
||||
<input type="text" placeholder="@grayDarker">
|
||||
<label>@navbar-background-highlight</label>
|
||||
<input type="text" class="span3" placeholder="@grayDark">
|
||||
<label>@navbar-text</label>
|
||||
<input type="text" class="span3" placeholder="@grayLight">
|
||||
<input type="text" placeholder="@grayDark">
|
||||
<label>@navbar-color</label>
|
||||
<input type="text" placeholder="@grayLight">
|
||||
<label>@navbar-brand-color</label>
|
||||
<input type="text" class="span3" placeholder="@navbar-link-color">
|
||||
<input type="text" placeholder="@navbar-link-color">
|
||||
<label>@navbar-link-color</label>
|
||||
<input type="text" class="span3" placeholder="@grayLight">
|
||||
<input type="text" placeholder="@grayLight">
|
||||
<label>@navbar-link-color-hover</label>
|
||||
<input type="text" class="span3" placeholder="#fff">
|
||||
<input type="text" placeholder="#fff">
|
||||
<label>@navbar-link-color-active</label>
|
||||
<input type="text" class="span3" placeholder="@navbar-link-color-hover">
|
||||
<input type="text" placeholder="@navbar-link-color-hover">
|
||||
<label>@navbar-link-background-hover</label>
|
||||
<input type="text" class="span3" placeholder="transparent">
|
||||
<input type="text" placeholder="transparent">
|
||||
<label>@navbar-link-background-active</label>
|
||||
<input type="text" class="span3" placeholder="@navbar-background">
|
||||
<input type="text" placeholder="@navbar-background">
|
||||
<label>@navbarSearchBackground</label>
|
||||
<input type="text" class="span3" placeholder="lighten(@navbar-background, 25%)">
|
||||
<input type="text" placeholder="lighten(@navbar-background, 25%)">
|
||||
<label>@navbarSearchBackgroundFocus</label>
|
||||
<input type="text" class="span3" placeholder="#fff">
|
||||
<input type="text" placeholder="#fff">
|
||||
<label>@navbarSearchBorder</label>
|
||||
<input type="text" class="span3" placeholder="darken(@navbarSearchBackground, 30%)">
|
||||
<input type="text" placeholder="darken(@navbarSearchBackground, 30%)">
|
||||
<label>@navbarSearchPlaceholderColor</label>
|
||||
<input type="text" class="span3" placeholder="#ccc">
|
||||
<input type="text" placeholder="#ccc">
|
||||
|
||||
<label>@navbar-collapse-width</label>
|
||||
<input type="text" class="span3" placeholder="979px">
|
||||
<input type="text" placeholder="979px">
|
||||
<label>@navbar-collapse-width-desktop</label>
|
||||
<input type="text" class="span3" placeholder="@navbar-collapse-width + 1">
|
||||
<input type="text" placeholder="@navbar-collapse-width + 1">
|
||||
|
||||
<h3>Dropdowns</h3>
|
||||
<label>@dropdown-background</label>
|
||||
<input type="text" class="span3" placeholder="#fff">
|
||||
<input type="text" placeholder="#fff">
|
||||
<label>@dropdown-border</label>
|
||||
<input type="text" class="span3" placeholder="rgba(0,0,0,.2)">
|
||||
<input type="text" placeholder="rgba(0,0,0,.2)">
|
||||
<label>@dropdown-link-color</label>
|
||||
<input type="text" class="span3" placeholder="@grayDark">
|
||||
<input type="text" placeholder="@grayDark">
|
||||
<label>@dropdown-link-color-hover</label>
|
||||
<input type="text" class="span3" placeholder="#fff">
|
||||
<input type="text" placeholder="#fff">
|
||||
<label>@dropdown-link-background-hover</label>
|
||||
<input type="text" class="span3" placeholder="@link-color">
|
||||
<input type="text" placeholder="@link-color">
|
||||
</div><!-- /span -->
|
||||
</div><!-- /row -->
|
||||
</section>
|
||||
|
@ -370,8 +355,4 @@ title: Customize and download
|
|||
</form>
|
||||
|
||||
|
||||
|
||||
</div><!-- /span9 -->
|
||||
</div><!-- row -->
|
||||
|
||||
</div><!-- /.container -->
|
||||
|
|
|
@ -27,37 +27,6 @@ body {
|
|||
left: 0;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
margin-top: 20px;
|
||||
margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
|
||||
}
|
||||
.navbar-wrapper .navbar {
|
||||
|
||||
}
|
||||
|
||||
/* Remove border and change up box shadow for more contrast */
|
||||
.navbar .navbar-inner {
|
||||
border: 0;
|
||||
-webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25);
|
||||
-moz-box-shadow: 0 2px 10px rgba(0,0,0,.25);
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,.25);
|
||||
}
|
||||
|
||||
/* Downsize the brand/project name a bit */
|
||||
.navbar .brand {
|
||||
padding: 14px 20px 16px; /* Increase vertical padding to match navbar links */
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.5);
|
||||
}
|
||||
|
||||
/* Navbar links: increase padding for taller navbar */
|
||||
.navbar .nav > li > a {
|
||||
padding: 15px 20px;
|
||||
}
|
||||
|
||||
/* Offset the responsive button for proper vertical alignment */
|
||||
.navbar .navbar-toggle {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
@ -69,22 +38,12 @@ body {
|
|||
.carousel {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.carousel .container {
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.carousel-control {
|
||||
height: 80px;
|
||||
margin-top: 0;
|
||||
font-size: 120px;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.4);
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
/* Since positioning the image, we need to help out the caption */
|
||||
.carousel-caption {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* Declare heights because of positioning of img element */
|
||||
.carousel .item {
|
||||
height: 500px;
|
||||
}
|
||||
|
@ -96,37 +55,26 @@ body {
|
|||
height: 500px;
|
||||
}
|
||||
|
||||
.carousel-caption {
|
||||
background-color: transparent;
|
||||
position: static;
|
||||
max-width: 550px;
|
||||
padding: 0 20px;
|
||||
margin-top: 200px;
|
||||
}
|
||||
.carousel-caption h1,
|
||||
.carousel-caption .lead {
|
||||
margin: 0;
|
||||
line-height: 1.25;
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.4);
|
||||
}
|
||||
.carousel-caption .btn {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* MARKETING CONTENT
|
||||
-------------------------------------------------- */
|
||||
|
||||
/* Pad the edges of the mobile views a bit */
|
||||
.marketing {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
/* Center align the text within the three columns below the carousel */
|
||||
.marketing .col-span-4 {
|
||||
.marketing .col-lg-4 {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.marketing h2 {
|
||||
font-weight: normal;
|
||||
}
|
||||
.marketing .col-span-4 p {
|
||||
.marketing .col-lg-4 p {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
@ -167,16 +115,40 @@ body {
|
|||
/* RESPONSIVE CSS
|
||||
-------------------------------------------------- */
|
||||
|
||||
@media (max-width: 979px) {
|
||||
@media (min-width: 768px) {
|
||||
|
||||
/* Remve the edge padding needed for mobile */
|
||||
.marketing {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
/* Navbar positioning foo */
|
||||
.navbar-wrapper {
|
||||
margin-top: 20px;
|
||||
margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
|
||||
}
|
||||
/* The navbar becomes detached from the top, so we round the corners */
|
||||
.navbar-wrapper .navbar {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* Bump up size of carousel content */
|
||||
.carousel-caption p {
|
||||
margin-bottom: 20px;
|
||||
font-size: 21px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*@media (max-width: 979px) {
|
||||
|
||||
.container.navbar-wrapper {
|
||||
margin-bottom: 0;
|
||||
width: auto;
|
||||
}
|
||||
.navbar-inner {
|
||||
border-radius: 0;
|
||||
margin: -20px 0;
|
||||
}
|
||||
|
||||
.carousel .item {
|
||||
height: 500px;
|
||||
|
@ -202,10 +174,6 @@ body {
|
|||
|
||||
@media (max-width: 767px) {
|
||||
|
||||
.navbar-inner {
|
||||
margin: -20px;
|
||||
}
|
||||
|
||||
.carousel {
|
||||
margin-left: -20px;
|
||||
margin-right: -20px;
|
||||
|
@ -244,7 +212,19 @@ body {
|
|||
line-height: 1.5;
|
||||
}
|
||||
|
||||
}
|
||||
.navbar-wrapper {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
#myCarousel {
|
||||
margin-top: 54px;
|
||||
}
|
||||
|
||||
}*/
|
||||
</style>
|
||||
|
||||
|
||||
|
@ -252,25 +232,21 @@ body {
|
|||
<!-- NAVBAR
|
||||
================================================== -->
|
||||
<div class="navbar-wrapper">
|
||||
<!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
|
||||
<div class="container">
|
||||
|
||||
<div class="navbar navbar-inverse">
|
||||
<div class="navbar-inner">
|
||||
<!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse">
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<div class="navbar navbar-inverse navbar-static-top">
|
||||
<div class="container">
|
||||
<a class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse">
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</a>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
<!-- Read about Bootstrap dropdowns at http://twitter.github.com/bootstrap/javascript.html#dropdowns -->
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
|
@ -284,52 +260,57 @@ body {
|
|||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div><!-- /.navbar-inner -->
|
||||
</div><!-- /.navbar -->
|
||||
|
||||
</div> <!-- /.container -->
|
||||
</div><!-- /.navbar-wrapper -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Carousel
|
||||
================================================== -->
|
||||
<div id="myCarousel" class="carousel slide">
|
||||
<!-- Indicators -->
|
||||
<ol class="carousel-indicators">
|
||||
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
|
||||
<li data-target="#myCarousel" data-slide-to="1"></li>
|
||||
<li data-target="#myCarousel" data-slide-to="2"></li>
|
||||
</ol>
|
||||
<div class="carousel-inner">
|
||||
<div class="item active">
|
||||
<img src="../assets/img/examples/slide-01.jpg" alt="">
|
||||
<img data-src="holder.js/1500x500/auto/#777:#7a7a7a/text:First slide" alt="">
|
||||
<div class="container">
|
||||
<div class="carousel-caption">
|
||||
<h1>Example headline.</h1>
|
||||
<p class="lead">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>
|
||||
<a class="btn btn-large btn-primary" href="#">Sign up today</a>
|
||||
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
|
||||
<p><a class="btn btn-large btn-primary" href="#">Sign up today</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="../assets/img/examples/slide-02.jpg" alt="">
|
||||
<img data-src="holder.js/1500x500/auto/#777:#7a7a7a/text:Second slide" alt="">
|
||||
<div class="container">
|
||||
<div class="carousel-caption">
|
||||
<h1>Another example headline.</h1>
|
||||
<p class="lead">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>
|
||||
<a class="btn btn-large btn-primary" href="#">Learn more</a>
|
||||
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
|
||||
<p><a class="btn btn-large btn-primary" href="#">Learn more</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="../assets/img/examples/slide-03.jpg" alt="">
|
||||
<img data-src="holder.js/1500x500/auto/#777:#7a7a7a/text:Third slide" alt="">
|
||||
<div class="container">
|
||||
<div class="carousel-caption">
|
||||
<h1>One more for good measure.</h1>
|
||||
<p class="lead">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>
|
||||
<a class="btn btn-large btn-primary" href="#">Browse gallery</a>
|
||||
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
|
||||
<p><a class="btn btn-large btn-primary" href="#">Browse gallery</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
|
||||
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
|
||||
<a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
|
||||
<a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
|
||||
</div><!-- /.carousel -->
|
||||
|
||||
|
||||
|
@ -342,24 +323,24 @@ body {
|
|||
|
||||
<!-- Three columns of text below the carousel -->
|
||||
<div class="row">
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<img class="img-circle" data-src="holder.js/140x140">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
|
||||
<p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div><!-- /.col-span-4 -->
|
||||
<div class="col-span-4">
|
||||
</div><!-- /.col-lg-4 -->
|
||||
<div class="col col-lg-4">
|
||||
<img class="img-circle" data-src="holder.js/140x140">
|
||||
<h2>Heading</h2>
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||||
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div><!-- /.col-span-4 -->
|
||||
<div class="col-span-4">
|
||||
</div><!-- /.col-lg-4 -->
|
||||
<div class="col col-lg-4">
|
||||
<img class="img-circle" data-src="holder.js/140x140">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div><!-- /.col-span-4 -->
|
||||
</div><!-- /.col-lg-4 -->
|
||||
</div><!-- /.row -->
|
||||
|
||||
|
||||
|
@ -368,24 +349,24 @@ body {
|
|||
<hr class="featurette-divider">
|
||||
|
||||
<div class="featurette">
|
||||
<img class="featurette-image pull-right" src="../assets/img/examples/browser-icon-chrome.png">
|
||||
<h2 class="featurette-heading">First featurette headling. <span class="muted">It'll blow your mind.</span></h2>
|
||||
<img class="featurette-image img-circle pull-right" data-src="holder.js/512x512">
|
||||
<h2 class="featurette-heading">First featurette heading. <span class="text-muted">It'll blow your mind.</span></h2>
|
||||
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
|
||||
</div>
|
||||
|
||||
<hr class="featurette-divider">
|
||||
|
||||
<div class="featurette">
|
||||
<img class="featurette-image pull-left" src="../assets/img/examples/browser-icon-firefox.png">
|
||||
<h2 class="featurette-heading">Oh yeah, it's that good. <span class="muted">See for yourself.</span></h2>
|
||||
<img class="featurette-image img-circle pull-left" data-src="holder.js/512x512">
|
||||
<h2 class="featurette-heading">Oh yeah, it's that good. <span class="text-muted">See for yourself.</span></h2>
|
||||
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
|
||||
</div>
|
||||
|
||||
<hr class="featurette-divider">
|
||||
|
||||
<div class="featurette">
|
||||
<img class="featurette-image pull-right" src="../assets/img/examples/browser-icon-safari.png">
|
||||
<h2 class="featurette-heading">And lastly, this one. <span class="muted">Checkmate.</span></h2>
|
||||
<img class="featurette-image img-circle pull-right" data-src="holder.js/512x512">
|
||||
<h2 class="featurette-heading">And lastly, this one. <span class="text-muted">Checkmate.</span></h2>
|
||||
<p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -0,0 +1,56 @@
|
|||
---
|
||||
layout: example
|
||||
title: Grid template
|
||||
---
|
||||
|
||||
<!-- Custom styles for this template -->
|
||||
<style>
|
||||
|
||||
.container {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.row {
|
||||
margin-bottom: 20px;
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
[class*="col-lg-"] {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #e5e5e5;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<div class="container">
|
||||
|
||||
<h2>Bootstrap grids</h2>
|
||||
<p class="lead">Basic grid layouts to get you familiar with building within the Bootstrap grid system.</p>
|
||||
|
||||
<h4>Three equal columns</h4>
|
||||
<div class="row">
|
||||
<div class="col col-lg-4">.col .col-lg-4</div>
|
||||
<div class="col col-lg-4">.col .col-lg-4</div>
|
||||
<div class="col col-lg-4">.col .col-lg-4</div>
|
||||
</div>
|
||||
|
||||
<h4>Three unequal columns</h4>
|
||||
<div class="row">
|
||||
<div class="col col-lg-3">.col .col-lg-3</div>
|
||||
<div class="col col-lg-6">.col .col-lg-6</div>
|
||||
<div class="col col-lg-3">.col .col-lg-3</div>
|
||||
</div>
|
||||
|
||||
<h4>Two columns</h4>
|
||||
<div class="row">
|
||||
<div class="col col-lg-8">.col .col-lg-8</div>
|
||||
<div class="col col-lg-4">.col .col-lg-4</div>
|
||||
</div>
|
||||
|
||||
<h4>Full width, single column</h4>
|
||||
<p class="text-muted">No grid classes are necessary for full-width elements.</p>
|
||||
|
||||
</div> <!-- /container -->
|
|
@ -94,7 +94,7 @@ title: Narrow page template
|
|||
<li><a href="#">About</a></li>
|
||||
<li><a href="#">Contact</a></li>
|
||||
</ul>
|
||||
<h3 class="muted">Project name</h3>
|
||||
<h3 class="text-muted">Project name</h3>
|
||||
</div>
|
||||
|
||||
<div class="jumbotron">
|
||||
|
@ -104,7 +104,7 @@ title: Narrow page template
|
|||
</div>
|
||||
|
||||
<div class="row marketing">
|
||||
<div class="col-span-6">
|
||||
<div class="col col-lg-6">
|
||||
<h4>Subheading</h4>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
|
||||
|
||||
|
@ -115,7 +115,7 @@ title: Narrow page template
|
|||
<p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
|
||||
</div>
|
||||
|
||||
<div class="col-span-6">
|
||||
<div class="col col-lg-6">
|
||||
<h4>Subheading</h4>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
|
||||
|
||||
|
|
|
@ -46,7 +46,7 @@ title: Jumbotron template
|
|||
</a>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
|
@ -85,17 +85,17 @@ title: Jumbotron template
|
|||
|
||||
<!-- Example row of columns -->
|
||||
<div class="row">
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div>
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div>
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
|
|
|
@ -42,7 +42,7 @@ title: Justified nav template
|
|||
border-radius: 5px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
.nav-justified li a {
|
||||
.nav-justified > li > a {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
color: #777;
|
||||
|
@ -60,17 +60,17 @@ title: Justified nav template
|
|||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
|
||||
background-image: linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* W3C */
|
||||
}
|
||||
.nav-justified .active a {
|
||||
.nav-justified > .active > a {
|
||||
background-color: #ddd;
|
||||
background-image: none;
|
||||
box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
|
||||
}
|
||||
.nav-justified li:first-child a {
|
||||
.nav-justified > li:first-child > a {
|
||||
border-left: 0;
|
||||
border-top-left-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
}
|
||||
.nav-justified li:last-child a {
|
||||
.nav-justified > li:last-child > a {
|
||||
border-right: 0;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
|
@ -86,7 +86,6 @@ title: Justified nav template
|
|||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
/* Make the nav on the same line */
|
||||
}
|
||||
|
||||
</style>
|
||||
|
@ -96,8 +95,8 @@ title: Justified nav template
|
|||
<div class="container">
|
||||
|
||||
<div class="masthead">
|
||||
<h3 class="muted">Project name</h3>
|
||||
<ul class="nav nav-justified">
|
||||
<h3 class="text-muted">Project name</h3>
|
||||
<ul class="nav navbar-nav nav-justified">
|
||||
<li class="active"><a href="#">Home</a></li>
|
||||
<li><a href="#">Projects</a></li>
|
||||
<li><a href="#">Services</a></li>
|
||||
|
@ -119,17 +118,17 @@ title: Justified nav template
|
|||
|
||||
<!-- Example row of columns -->
|
||||
<div class="row">
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div>
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
</div>
|
||||
<div class="col-span-4">
|
||||
<div class="col col-lg-4">
|
||||
<h2>Heading</h2>
|
||||
<p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.</p>
|
||||
<p><a class="btn" href="#">View details »</a></p>
|
||||
|
|
|
@ -27,7 +27,7 @@ title: Fixed navbar template
|
|||
</a>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
|
@ -44,7 +44,7 @@ title: Fixed navbar template
|
|||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav pull-right">
|
||||
<ul class="nav navbar-nav pull-right">
|
||||
<li><a href="/examples/navbar/">Default</a></li>
|
||||
<li><a href="/examples/navbar-static-top/">Static top</a></li>
|
||||
<li class="active"><a href="/examples/navbar-fixed-top/">Fixed top</a></li>
|
||||
|
@ -60,7 +60,7 @@ title: Fixed navbar template
|
|||
<h1>Navbar example</h1>
|
||||
<p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
|
||||
<p>
|
||||
<a class="btn btn-large btn-primary" href="../../components/#navbar">View navbar docs »</a>
|
||||
<a class="btn btn-large btn-primary" href="../../docs/#navbar">View navbar docs »</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -23,7 +23,7 @@ title: Static navbar template
|
|||
</a>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
|
@ -40,11 +40,11 @@ title: Static navbar template
|
|||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav pull-right">
|
||||
<li><a href="/examples/navbar/">Default</a></li>
|
||||
<li class="active"><a href="/examples/navbar-static-top/">Static top</a></li>
|
||||
<li><a href="/examples/navbar-fixed-top/">Fixed top</a></li>
|
||||
</ul>
|
||||
<ul class="nav navbar-nav pull-right">
|
||||
<li><a href="/examples/navbar/">Default</a></li>
|
||||
<li class="active"><a href="/examples/navbar-static-top/">Static top</a></li>
|
||||
<li><a href="/examples/navbar-fixed-top/">Fixed top</a></li>
|
||||
</ul>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div>
|
||||
</div>
|
||||
|
@ -57,7 +57,7 @@ title: Static navbar template
|
|||
<h1>Navbar example</h1>
|
||||
<p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
|
||||
<p>
|
||||
<a class="btn btn-large btn-primary" href="../../components/#navbar">View navbar docs »</a>
|
||||
<a class="btn btn-large btn-primary" href="../../docs/#navbar">View navbar docs »</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -29,7 +29,7 @@ title: Navbar template
|
|||
</a>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
|
@ -46,7 +46,7 @@ title: Navbar template
|
|||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav pull-right">
|
||||
<ul class="nav navbar-nav pull-right">
|
||||
<li class="active"><a href="/examples/navbar/">Default</a></li>
|
||||
<li><a href="/examples/navbar-static-top/">Static top</a></li>
|
||||
<li><a href="/examples/navbar-fixed-top/">Fixed top</a></li>
|
||||
|
@ -60,7 +60,7 @@ title: Navbar template
|
|||
<h1>Navbar example</h1>
|
||||
<p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
|
||||
<p>
|
||||
<a class="btn btn-large btn-primary" href="../../components/#navbar">View navbar docs »</a>
|
||||
<a class="btn btn-large btn-primary" href="../../docs/#navbar">View navbar docs »</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -13,8 +13,8 @@ title: Sign in form template
|
|||
}
|
||||
|
||||
.form-signin {
|
||||
max-width: 300px;
|
||||
padding: 30px;
|
||||
max-width: 330px;
|
||||
padding: 15px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.form-signin .form-signin-heading,
|
||||
|
|
|
@ -24,7 +24,7 @@ title: Starter template
|
|||
</button>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
|
|
|
@ -22,14 +22,13 @@ title: Sticky footer with navbar template
|
|||
height: 100%;
|
||||
/* Negative indent footer by its height */
|
||||
margin: 0 auto -60px;
|
||||
/* Pad bottom by footer height */
|
||||
padding: 0 0 60px;
|
||||
}
|
||||
|
||||
/* Set the fixed height of the footer here */
|
||||
#push,
|
||||
#footer {
|
||||
height: 60px;
|
||||
}
|
||||
#footer {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
|
@ -50,7 +49,7 @@ title: Sticky footer with navbar template
|
|||
/* Not required for template or sticky footer method. */
|
||||
|
||||
#wrap > .container {
|
||||
padding-top: 60px;
|
||||
padding: 60px 15px 0;
|
||||
}
|
||||
.container .credit {
|
||||
margin: 20px 0;
|
||||
|
@ -77,7 +76,7 @@ title: Sticky footer with navbar template
|
|||
</button>
|
||||
<a class="navbar-brand" href="#">Project name</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<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>
|
||||
|
@ -104,14 +103,12 @@ title: Sticky footer with navbar template
|
|||
<h1>Sticky footer with fixed navbar</h1>
|
||||
</div>
|
||||
<p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added within <code>#wrap</code> with <code>padding-top: 60px;</code> on the <code>.container</code>.</p>
|
||||
<p>Back to <a href="./sticky-footer.html">the default sticky footer</a> minus the navbar.</p>
|
||||
<p>Back to <a href="../sticky-footer">the default sticky footer</a> minus the navbar.</p>
|
||||
</div>
|
||||
|
||||
<div id="push"></div>
|
||||
</div>
|
||||
|
||||
<div id="footer">
|
||||
<div class="container">
|
||||
<p class="muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
|
||||
<p class="text-muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -22,14 +22,13 @@ title: Sticky footer template
|
|||
height: 100%;
|
||||
/* Negative indent footer by its height */
|
||||
margin: 0 auto -60px;
|
||||
/* Pad bottom by footer height */
|
||||
padding: 0 0 60px;
|
||||
}
|
||||
|
||||
/* Set the fixed height of the footer here */
|
||||
#push,
|
||||
#footer {
|
||||
height: 60px;
|
||||
}
|
||||
#footer {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
|
@ -50,6 +49,7 @@ title: Sticky footer template
|
|||
.container {
|
||||
width: auto;
|
||||
max-width: 680px;
|
||||
padding: 0 15px;
|
||||
}
|
||||
.container .credit {
|
||||
margin: 20px 0;
|
||||
|
@ -68,14 +68,12 @@ title: Sticky footer template
|
|||
<h1>Sticky footer</h1>
|
||||
</div>
|
||||
<p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
|
||||
<p>Use <a href="./sticky-footer-navbar.html">the sticky footer with a fixed navbar</a> if need be, too.</p>
|
||||
<p>Use <a href="../sticky-footer-navbar">the sticky footer with a fixed navbar</a> if need be, too.</p>
|
||||
</div>
|
||||
|
||||
<div id="push"></div>
|
||||
</div>
|
||||
|
||||
<div id="footer">
|
||||
<div class="container">
|
||||
<p class="muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
|
||||
<p class="text-muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,291 +0,0 @@
|
|||
---
|
||||
layout: default
|
||||
title: Getting started
|
||||
description: Overview of the project, its contents, and how to get started with a simple template.
|
||||
---
|
||||
|
||||
<!-- Subhead
|
||||
================================================== -->
|
||||
<header class="bs-docs-jumbotron subhead">
|
||||
<div class="container">
|
||||
<h1>Getting started</h1>
|
||||
<p class="lead">Overview of the project, its contents, and how to get started with a simple template.</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container">
|
||||
|
||||
<!-- Docs nav
|
||||
================================================== -->
|
||||
<div class="row">
|
||||
<div class="col-span-3 bs-docs-sidebar">
|
||||
<ul class="nav nav-list bs-docs-sidenav">
|
||||
<li><a href="#download-bootstrap"><i class="glyphicon glyphicon-chevron-right"></i> Download</a></li>
|
||||
<li><a href="#file-structure"><i class="glyphicon glyphicon-chevron-right"></i> File structure</a></li>
|
||||
<li><a href="#contents"><i class="glyphicon glyphicon-chevron-right"></i> What's included</a></li>
|
||||
<li><a href="#html-template"><i class="glyphicon glyphicon-chevron-right"></i> HTML template</a></li>
|
||||
<li><a href="#examples"><i class="glyphicon glyphicon-chevron-right"></i> Examples</a></li>
|
||||
<li><a href="#what-next"><i class="glyphicon glyphicon-chevron-right"></i> What next?</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-span-9">
|
||||
|
||||
|
||||
|
||||
<!-- Download
|
||||
================================================== -->
|
||||
<section id="download-bootstrap">
|
||||
<div class="page-header">
|
||||
<h1>1. Download</h1>
|
||||
</div>
|
||||
<p class="lead">Before downloading, be sure to have a code editor (we recommend <a href="http://sublimetext.com/2">Sublime Text 2</a>) and some working knowledge of HTML and CSS. We won't walk through the source files here, but they are available for download. We'll focus on getting started with the compiled Bootstrap files.</p>
|
||||
|
||||
<div class="row">
|
||||
<div class="span6">
|
||||
<h2>Compiled</h2>
|
||||
<p><strong>Fastest way to get started:</strong> get the compiled and minified versions of our CSS, JS, and images. No docs or original source files.</p>
|
||||
<p><a class="btn btn-large btn-primary" href="assets/bootstrap.zip" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);">Download Bootstrap</a></p>
|
||||
</div>
|
||||
<div class="span6">
|
||||
<h2>Source</h2>
|
||||
<p>Get the original files for all CSS and JavaScript, along with a local copy of the docs by downloading the latest version directly from GitHub.</p>
|
||||
<p><a class="btn btn-large" href="https://github.com/twitter/bootstrap/zipball/master" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download source']);">Download Bootstrap source</a></p>
|
||||
</div>
|
||||
<div class="span6">
|
||||
<h2>Bower</h2>
|
||||
<p>Install and manage the original files for all CSS and JavaScript, along with a local copy of the docs, using <a href="http://twitter.github.com/bower">Bower</a>.</p>
|
||||
{% highlight bash %}bower install bootstrap{% endhighlight %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
<!-- File structure
|
||||
================================================== -->
|
||||
<section id="file-structure">
|
||||
<div class="page-header">
|
||||
<h1>2. File structure</h1>
|
||||
</div>
|
||||
<p class="lead">Within the download you'll find the following file structure and contents, logically grouping common assets and providing both compiled and minified variations.</p>
|
||||
<p>Once downloaded, unzip the compressed folder to see the structure of (the compiled) Bootstrap. You'll see something like this:</p>
|
||||
|
||||
{% highlight bash %}
|
||||
bootstrap/
|
||||
├── css/
|
||||
│ ├── bootstrap.css
|
||||
│ ├── bootstrap.min.css
|
||||
├── js/
|
||||
│ ├── bootstrap.js
|
||||
│ ├── bootstrap.min.js
|
||||
└── fonts/
|
||||
├── glyphiconshalflings-regular.eot
|
||||
├── glyphiconshalflings-regular.otf
|
||||
├── glyphiconshalflings-regular.svg
|
||||
├── glyphiconshalflings-regular.ttf
|
||||
└── glyphiconshalflings-regular.woff
|
||||
{% endhighlight %}
|
||||
|
||||
<p>This is the most basic form of Bootstrap: compiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (<code>bootstrap.*</code>), as well as compiled and minified CSS and JS (<code>bootstrap.min.*</code>). The image files are compressed using <a href="http://imageoptim.com/">ImageOptim</a>, a Mac app for compressing PNGs.</p>
|
||||
<p>Please note that <strong>all JavaScript plugins require jQuery</strong> to be included.</p>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
<!-- Contents
|
||||
================================================== -->
|
||||
<section id="contents">
|
||||
<div class="page-header">
|
||||
<h1>3. What's included</h1>
|
||||
</div>
|
||||
<p class="lead">Bootstrap comes equipped with HTML, CSS, and JS for all sorts of things, but they can be summarized with a handful of categories visible at the top of the <a href="http://getbootstrap.com">Bootstrap documentation</a>.</p>
|
||||
|
||||
<h2>Docs sections</h2>
|
||||
<p>In addition to the getting started documentation you're reading now, the Bootstrap docs are broken into a few key pages.</p>
|
||||
|
||||
<h4><a href="http://twitter.github.com/bootstrap/css.html">Core CSS</a></h4>
|
||||
<p>Global styles for the body, Normalize, links, grid system, tables, forms, buttons, icons, and more.</p>
|
||||
<h4><a href="http://twitter.github.com/bootstrap/components.html">Components</a></h4>
|
||||
<p>Basic styles for common interface components like tabs and pills, navbar, alerts, page headers, and more. Head here to see what kind of custom components Bootstrap has to offer beyond basic HTML elements.</p>
|
||||
<h4><a href="http://twitter.github.com/bootstrap/javascript.html">JavaScript plugins</a></h4>
|
||||
<p>Similar to Components, these JavaScript plugins are interactive components for things like tooltips, popovers, modals, and more.</p>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
<!-- HTML template
|
||||
================================================== -->
|
||||
<section id="html-template">
|
||||
<div class="page-header">
|
||||
<h1>4. Basic HTML template</h1>
|
||||
</div>
|
||||
<p class="lead">With a brief intro into the contents out of the way, we can focus on putting Bootstrap to use. To do that, we'll utilize a basic HTML template that includes everything we mentioned in the <a href="./getting-started.html#file-structure">File structure</a>.</p>
|
||||
<p>Now, here's a look at a <strong>typical HTML file</strong>:</p>
|
||||
|
||||
{% highlight html linenos %}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Bootstrap 101 Template</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello, world!</h1>
|
||||
<script src="http://code.jquery.com/jquery.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
{% endhighlight %}
|
||||
|
||||
<p>To make this <strong>a Bootstrapped template</strong>, just include the appropriate CSS and JS files:</p>
|
||||
|
||||
{% highlight html linenos %}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Bootstrap 101 Template</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<!-- Bootstrap -->
|
||||
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello, world!</h1>
|
||||
<script src="http://code.jquery.com/jquery.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
{% endhighlight %}
|
||||
|
||||
<p><strong>And you're set!</strong> With those two files added, you can begin to develop any site or application with Bootstrap.</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<h4>Responsive features in IE8</h4>
|
||||
<p>Internet Explorer 8 lacks support for media queries, the method by which we deliver responsive CSS to folks. To enable that, you need to include a third party tool (which we include in the project repository) called <a href="https://github.com/scottjehl/Respond">Respond.js</a>.</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<!--[if lt IE 9]>
|
||||
<script src="/assets/js/respond/respond.js"></script>
|
||||
<![endif]-->
|
||||
</pre>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
<!-- Examples
|
||||
================================================== -->
|
||||
<section id="examples">
|
||||
<div class="page-header">
|
||||
<h1>5. Examples</h1>
|
||||
</div>
|
||||
<p class="lead">Move beyond the base template with a few example layouts. We encourage folks to iterate on these examples and not simply use them as an end result.</p>
|
||||
<div class="row bs-docs-examples">
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/starter-template/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-starter.png" alt="">
|
||||
</a>
|
||||
<h4>Starter template</h4>
|
||||
<p>A barebones HTML document with all the Bootstrap CSS and JavaScript included.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/jumbotron/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-marketing.png" alt="">
|
||||
</a>
|
||||
<h4>Basic marketing site</h4>
|
||||
<p>Featuring a hero unit for a primary message and three supporting elements.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/jumbotron-narrow/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-jumbotron-narrow.png" alt="">
|
||||
</a>
|
||||
<h4>Narrow marketing</h4>
|
||||
<p>Slim, lightweight marketing template for small projects or teams.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/justified-nav/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-justified-nav.png" alt="">
|
||||
</a>
|
||||
<h4>Justified nav</h4>
|
||||
<p>Marketing page with equal-width navigation links in a modified navbar.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/signin/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-signin.png" alt="">
|
||||
</a>
|
||||
<h4>Sign in</h4>
|
||||
<p>Barebones sign in form with custom, larger form controls and a flexible layout.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/sticky-footer/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-sticky-footer.png" alt="">
|
||||
</a>
|
||||
<h4>Sticky footer</h4>
|
||||
<p>Pin a fixed-height footer to the bottom of the user's viewport.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/sticky-footer-navbar/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-sticky-footer-navbar.png" alt="">
|
||||
</a>
|
||||
<h4>Sticky footer w/ navbar</h4>
|
||||
<p>Add a fixed navbar to the default sticky footer template.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/carousel/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-carousel.png" alt="">
|
||||
</a>
|
||||
<h4>Carousel jumbotron</h4>
|
||||
<p>An interactive riff on the basic marketing site featuring a prominent carousel.</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/navbar/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-navbar.png" alt="">
|
||||
</a>
|
||||
<h4>Navbar</h4>
|
||||
<p>Basic template for showcasing how the navbar works.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/navbar-static-top/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-navbar-static-top.png" alt="">
|
||||
</a>
|
||||
<h4>Static top navbar</h4>
|
||||
<p>Basic template for showcasing the static navbar variation.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/navbar-fixed-top/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-navbar-fixed-top.png" alt="">
|
||||
</a>
|
||||
<h4>Fixed top navbar</h4>
|
||||
<p>Basic template for showcasing the fixed navbar variation.</p>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<a class="thumbnail" href="/examples/grid/" target="_blank">
|
||||
<img src="/assets/img/examples/bootstrap-example-.png" alt="">
|
||||
</a>
|
||||
<h4>Grid examples</h4>
|
||||
<p></p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- Next
|
||||
================================================== -->
|
||||
<section id="what-next">
|
||||
<div class="page-header">
|
||||
<h1>What next?</h1>
|
||||
</div>
|
||||
<p class="lead">Head to the docs for information, examples, and code snippets, or take the next leap and customize Bootstrap for any upcoming project.</p>
|
||||
<a class="btn btn-large btn-primary" href="./css.html" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Next steps', 'Visit docs']);">Visit the Bootstrap docs</a>
|
||||
<a class="btn btn-large" href="./customize.html" style="margin-left: 5px;" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Next steps', 'Customize']);">Customize Bootstrap</a>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
|
||||
</div><!-- /span9 -->
|
||||
</div><!-- row -->
|
||||
|
||||
</div><!-- /.container -->
|
|
@ -1,77 +1,50 @@
|
|||
---
|
||||
layout: default
|
||||
layout: home
|
||||
title: Bootstrap
|
||||
---
|
||||
|
||||
<div class="bs-docs-jumbotron masthead">
|
||||
<div class="container">
|
||||
|
||||
<h1>Bootstrap</h1>
|
||||
<p class="lead">Sleek, intuitive, and powerful mobile-first front-end framework for faster and easier web development.</p>
|
||||
<p>
|
||||
<a href="assets/bootstrap.zip" class="btn btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0']);">Download Bootstrap</a>
|
||||
<a href="./docs/" class="btn btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Docs', 'View docs']);">View docs</a>
|
||||
</p>
|
||||
|
||||
<div class="bs-docs-social">
|
||||
<ul class="bs-docs-social-buttons">
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
|
||||
</li>
|
||||
<li class="follow-btn">
|
||||
<a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
|
||||
</li>
|
||||
<li class="tweet-btn">
|
||||
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twitter.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<ul class="masthead-links">
|
||||
<li>
|
||||
<a href="./customize/" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Customize']);">Customize</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="http://github.com/twitter/bootstrap" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'GitHub project']);">GitHub project</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./getting-started/#examples" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
|
||||
<a href="./docs/#examples" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="http://expo.getbootstrap.com" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Expo']);">Bootstrap Expo</a>
|
||||
</li>
|
||||
<li>Version 3.0.0</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="bs-docs-marketing">
|
||||
|
||||
<h1>Introducing Bootstrap.</h1>
|
||||
<p class="marketing-byline">Need reasons to love Bootstrap? Look no further.</p>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-span-4">
|
||||
<img class="marketing-img" src="assets/img/bs-docs-twitter-github.png">
|
||||
<h2>By nerds, for nerds.</h2>
|
||||
<p>Built at Twitter by <a href="http://twitter.com/mdo">@mdo</a> and <a href="http://twitter.com/fat">@fat</a>, Bootstrap utilizes <a href="http://lesscss.org">LESS CSS</a>, is compiled via <a href="http://nodejs.org">Node</a>, and is managed through <a href="http://github.com">GitHub</a> to help nerds do awesome stuff on the web.</p>
|
||||
</div>
|
||||
<div class="col-span-4">
|
||||
<img class="marketing-img" src="assets/img/bs-docs-responsive-illustrations.png">
|
||||
<h2>Made for everyone.</h2>
|
||||
<p>Bootstrap 3 has been rebuilt from the ground up to push the Web forward. It looks and behaves great on the latest smartphones, tablets, and desktops (including support for IE8+).</p>
|
||||
</div>
|
||||
<div class="col-span-4">
|
||||
<img class="marketing-img" src="assets/img/bs-docs-bootstrap-features.png">
|
||||
<h2>Packed with features.</h2>
|
||||
<p>A 12-column responsive <a href="./css/#grid-system">grid</a>, dozens of components, <a href="./javascript/">JavaScript plugins</a>, typography, form controls, and even a <a href="./customize/">web-based Customizer</a> to make Bootstrap your own.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h1>Built with Bootstrap.</h1>
|
||||
<p class="marketing-byline">For more sites built with Bootstrap, <a href="http://expo.getbootstrap.com">visit the Expo</a> or <a href="./getting-started/#examples">browse the examples</a>.</p>
|
||||
<div class="row bs-docs-gallery">
|
||||
<div class="col-span-3">
|
||||
<a class="thumbnail" href="http://delicious.com" target="_blank">
|
||||
<img src="http://expo.getbootstrap.com/screenshots/delicious.jpg" alt="Delicious">
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-span-3">
|
||||
<a class="thumbnail" href="https://yourkarma.com" target="_blank">
|
||||
<img src="http://expo.getbootstrap.com/screenshots/karma.jpg" alt="Karma">
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-span-3">
|
||||
<a class="thumbnail" href="http://soundready.fm/" target="_blank">
|
||||
<img src="http://expo.getbootstrap.com/screenshots/soundready.jpg" alt="SoundReady">
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-span-3">
|
||||
<a class="thumbnail" href="http://kippt.com/" target="_blank">
|
||||
<img src="http://expo.getbootstrap.com/screenshots/kippt.jpg" alt="Kippt">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
1864
docs/javascript.html
|
@ -9,4 +9,4 @@
|
|||
"boss" : true,
|
||||
"expr" : true,
|
||||
"asi" : true
|
||||
}
|
||||
}
|
||||
|
|
|
@ -114,4 +114,4 @@
|
|||
})
|
||||
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -96,4 +96,4 @@
|
|||
|
||||
$(document).on('click.alert.data-api', dismiss, Alert.prototype.close)
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -102,4 +102,4 @@
|
|||
$btn.button('toggle')
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -204,4 +204,4 @@
|
|||
e.preventDefault()
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -170,4 +170,4 @@
|
|||
$(target).collapse(option)
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -97,7 +97,7 @@
|
|||
this.activeTarget = target
|
||||
|
||||
$(this.selector)
|
||||
.parent('.active')
|
||||
.parents('.active')
|
||||
.removeClass('active')
|
||||
|
||||
selector = this.selector
|
||||
|
@ -105,7 +105,7 @@
|
|||
+ this.selector + '[href="' + target + '"]'
|
||||
|
||||
active = $(selector)
|
||||
.parent('li')
|
||||
.parents('li')
|
||||
.addClass('active')
|
||||
|
||||
if (active.parent('.dropdown-menu').length) {
|
||||
|
@ -159,4 +159,4 @@
|
|||
})
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -141,4 +141,4 @@
|
|||
$(this).tab('show')
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -57,4 +57,4 @@
|
|||
|
||||
})
|
||||
|
||||
}(window.jQuery);
|
||||
}(window.jQuery);
|
||||
|
|
|
@ -53,4 +53,4 @@
|
|||
<div id="qunit-fixture"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
@ -60,4 +60,4 @@ page.open(phantom.args[0], function(status){
|
|||
phantom.exit((parseInt(failedNum, 10) > 0) ? 1 : 0)
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
|
|
@ -11,4 +11,4 @@ var connect = require('connect')
|
|||
|
||||
http.createServer(app).listen(3000);
|
||||
|
||||
fs.writeFileSync(__dirname + '/pid.txt', process.pid, 'utf-8')
|
||||
fs.writeFileSync(__dirname + '/pid.txt', process.pid, 'utf-8')
|
||||
|
|
|
@ -22,4 +22,4 @@ $(function () {
|
|||
ok(!$affix.hasClass('affix'), 'affix class was not added')
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -59,4 +59,4 @@ $(function () {
|
|||
.alert('close')
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -99,4 +99,4 @@ $(function () {
|
|||
ok(btn2.hasClass('active'), 'btn2 has active class')
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -78,4 +78,4 @@ $(function () {
|
|||
ok($('#myCarousel').data('carousel').options.interval == 1814, "attributes should be read only on intitialization");
|
||||
$('#myCarousel').remove();
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
|
@ -148,4 +148,4 @@ $(function () {
|
|||
$("#qunit-fixture").html("")
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -134,4 +134,4 @@ $(function () {
|
|||
})
|
||||
.modal("show")
|
||||
})
|
||||
})
|
||||
})
|
||||
|
|
|
@ -18,4 +18,4 @@ QUnit.done = function (opts) {
|
|||
console.log("\n================================================")
|
||||
console.log("Tests completed in " + opts.runtime + " milliseconds")
|
||||
console.log(opts.passed + " tests of " + opts.total + " passed, " + opts.failed + " failed.")
|
||||
}
|
||||
}
|
||||
|
|
|
@ -110,4 +110,4 @@ $(function () {
|
|||
ok(!$._data(popover[0], 'events').mouseover && !$._data(popover[0], 'events').mouseout, 'popover does not have any events')
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -34,4 +34,4 @@ $(function () {
|
|||
ok($topbar.find('.active', true))
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -83,4 +83,4 @@ $(function () {
|
|||
}).tab('show')
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -10,4 +10,4 @@ $(function () {
|
|||
ok($.support.transition ? $.support.transition.end : true, 'end string is defined')
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
|
|
@ -229,4 +229,4 @@
|
|||
|
||||
#qunit-fixture {
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1507,4 +1507,4 @@ QUnit.diff = (function() {
|
|||
};
|
||||
})();
|
||||
|
||||
})(this);
|
||||
})(this);
|
||||
|
|
|
@ -9,10 +9,10 @@
|
|||
.alert {
|
||||
padding: 8px 35px 8px 14px;
|
||||
margin-bottom: @line-height-base;
|
||||
color: @state-warning-text;
|
||||
background-color: @state-warning-background;
|
||||
border: 1px solid @state-warning-border;
|
||||
border-radius: @border-radius-base;
|
||||
color: @alert-text;
|
||||
background-color: @alert-bg;
|
||||
border: 1px solid @alert-border;
|
||||
border-radius: @alert-border-radius;
|
||||
|
||||
// Headings for larger alerts
|
||||
h4 {
|
||||
|
@ -22,63 +22,61 @@
|
|||
}
|
||||
// Match the hr to the border of the alert
|
||||
hr {
|
||||
border-top-color: darken(@state-warning-border, 5%);
|
||||
border-top-color: darken(@alert-border, 5%);
|
||||
}
|
||||
// Inherit color for immediate links and bolden them some
|
||||
> a,
|
||||
> p > a {
|
||||
font-weight: 500;
|
||||
color: darken(@state-warning-text, 10%);
|
||||
color: darken(@alert-text, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
// Adjust close link position
|
||||
.close {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
right: -21px;
|
||||
line-height: @line-height-base;
|
||||
color: inherit;
|
||||
// Adjust close link position
|
||||
.close {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
right: -21px;
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
// Alternate styles
|
||||
// -------------------------
|
||||
|
||||
.alert-success {
|
||||
background-color: @state-success-background;
|
||||
border-color: @state-success-border;
|
||||
color: @state-success-text;
|
||||
background-color: @alert-success-bg;
|
||||
border-color: @alert-success-border;
|
||||
color: @alert-success-text;
|
||||
hr {
|
||||
border-top-color: darken(@state-success-border, 5%);
|
||||
border-top-color: darken(@alert-success-border, 5%);
|
||||
}
|
||||
> a,
|
||||
> p > a {
|
||||
color: darken(@state-success-text, 10%);
|
||||
color: darken(@alert-success-text, 10%);
|
||||
}
|
||||
}
|
||||
.alert-danger,
|
||||
.alert-error {
|
||||
background-color: @state-error-background;
|
||||
border-color: @state-error-border;
|
||||
color: @state-error-text;
|
||||
.alert-danger {
|
||||
background-color: @alert-danger-bg;
|
||||
border-color: @alert-danger-border;
|
||||
color: @alert-danger-text;
|
||||
hr {
|
||||
border-top-color: darken(@state-error-border, 5%);
|
||||
border-top-color: darken(@alert-danger-border, 5%);
|
||||
}
|
||||
> a,
|
||||
> p > a {
|
||||
color: darken(@state-error-text, 10%);
|
||||
color: darken(@alert-danger-text, 10%);
|
||||
}
|
||||
}
|
||||
.alert-info {
|
||||
background-color: @state-info-background;
|
||||
border-color: @state-info-border;
|
||||
color: @state-info-text;
|
||||
background-color: @alert-info-bg;
|
||||
border-color: @alert-info-border;
|
||||
color: @alert-info-text;
|
||||
hr {
|
||||
border-top-color: darken(@state-info-border, 5%);
|
||||
border-top-color: darken(@alert-info-border, 5%);
|
||||
}
|
||||
> a,
|
||||
> p > a {
|
||||
color: darken(@state-info-text, 10%);
|
||||
color: darken(@alert-info-text, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -8,14 +8,14 @@
|
|||
display: inline-block;
|
||||
min-width: 10px;
|
||||
padding: 3px 7px;
|
||||
font-size: 12px;
|
||||
font-size: @font-size-small;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
line-height: 1;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
background-color: @grayLight;
|
||||
background-color: @gray-light;
|
||||
border-radius: 10px;
|
||||
|
||||
// Empty labels/badges collapse
|
||||
|
@ -48,7 +48,7 @@ a.badge {
|
|||
}
|
||||
|
||||
// Account for counters in navs
|
||||
.nav-list > .active > a > .badge,
|
||||
a.list-group-item.active > .badge,
|
||||
.nav-pills > .active > a > .badge {
|
||||
color: @link-color;
|
||||
background-color: #fff;
|
||||
|
|
|
@ -30,6 +30,8 @@
|
|||
@import "component-animations.less";
|
||||
@import "glyphicons.less";
|
||||
@import "dropdowns.less";
|
||||
@import "list-group.less";
|
||||
@import "panels.less";
|
||||
@import "wells.less";
|
||||
@import "close.less";
|
||||
|
||||
|
|
|
@ -18,8 +18,11 @@
|
|||
padding: 0 5px;
|
||||
color: #ccc;
|
||||
}
|
||||
&:last-child:after {
|
||||
display: none; // No divider after last element
|
||||
}
|
||||
}
|
||||
> .active {
|
||||
color: @grayLight;
|
||||
color: @gray-light;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
|
||||
// Optional: Group multiple button groups together for a toolbar
|
||||
.btn-toolbar {
|
||||
.clear_float();
|
||||
.clearfix();
|
||||
|
||||
.btn-group {
|
||||
float: left;
|
||||
|
@ -73,6 +73,21 @@
|
|||
.border-right-radius(@border-radius-large);
|
||||
}
|
||||
|
||||
// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group)
|
||||
.btn-group > .btn-group {
|
||||
float: left;
|
||||
}
|
||||
.btn-group > .btn-group > .btn {
|
||||
border-radius: 0;
|
||||
}
|
||||
.btn-group > .btn-group:last-child > .btn {
|
||||
.border-right-radius(@border-radius-base);
|
||||
}
|
||||
.btn-group > .btn-group:first-child > .btn {
|
||||
margin-left: 0;
|
||||
.border-left-radius(@border-radius-base);
|
||||
}
|
||||
|
||||
// On active and open, don't show outline
|
||||
.btn-group .dropdown-toggle:active,
|
||||
.btn-group.open .dropdown-toggle {
|
||||
|
|
|
@ -110,26 +110,26 @@ input[type="button"] {
|
|||
|
||||
.btn {
|
||||
color: @btn-color;
|
||||
.btn-pseudo-states(@btn-background, @btn-border);
|
||||
.btn-pseudo-states(@btn-bg, @btn-border);
|
||||
}
|
||||
.btn-primary {
|
||||
.btn-pseudo-states(@btn-background-primary, @btn-border-primary);
|
||||
.btn-pseudo-states(@btn-primary-bg, @btn-primary-border);
|
||||
}
|
||||
// Warning appears as orange
|
||||
.btn-warning {
|
||||
.btn-pseudo-states(@btn-background-warning, @btn-border-warning);
|
||||
.btn-pseudo-states(@btn-warning-bg, @btn-warning-border);
|
||||
}
|
||||
// Danger and error appear as red
|
||||
.btn-danger {
|
||||
.btn-pseudo-states(@btn-background-danger, @btn-border-danger);
|
||||
.btn-pseudo-states(@btn-danger-bg, @btn-danger-border);
|
||||
}
|
||||
// Success appears as green
|
||||
.btn-success {
|
||||
.btn-pseudo-states(@btn-background-success, @btn-border-success);
|
||||
.btn-pseudo-states(@btn-success-bg, @btn-success-border);
|
||||
}
|
||||
// Info appears as blue-green
|
||||
.btn-info {
|
||||
.btn-pseudo-states(@btn-background-info, @btn-border-info);
|
||||
.btn-pseudo-states(@btn-info-bg, @btn-info-border);
|
||||
}
|
||||
|
||||
|
||||
|
@ -159,7 +159,7 @@ fieldset[disabled] .btn-link {
|
|||
}
|
||||
.btn-link:hover,
|
||||
.btn-link:focus {
|
||||
color: @link-color-hover;
|
||||
color: @link-hover-color;
|
||||
text-decoration: underline;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
@ -168,7 +168,7 @@ fieldset[disabled] .btn-link {
|
|||
fieldset[disabled] & {
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: @grayDark;
|
||||
color: @gray-dark;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
|