Skip to content

B
bootstrap
Commit f0d07183 authored by Mark Otto's avatar Mark Otto
Browse files
Options

Merge branch '3.0.0-wip' into bs3_remove_examples 

Conflicts:
	docs/_includes/nav-getting-started.html
	docs/examples/navbar-fixed-top.html
	docs/examples/navbar-static-top.html
	docs/examples/navbar.html
	docs/getting-started.html
parents c5fb401a bfebf0e4
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1543 additions and 10041 deletions
CHANGELOG.md deleted 100644 → 0
View file @ c5fb401a
This diff is collapsed.
Makefile
View file @ f0d07183
......@@ -22,7 +22,6 @@ build:
@recess --compile ${BOOTSTRAP_LESS} > ${BOOTSTRAP}
@echo " ${CHECK}"
@printf "Prepping documentation assets..."
@cp fonts/* docs/assets/fonts/
@cp js/tests/vendor/jquery.js docs/assets/js/
@echo " ${CHECK}"
@printf "Compiling and minifying JavaScript..."
......@@ -61,7 +60,7 @@ clean:
# recess & uglifyjs are required
#
bootstrap: bootstrap-fonts bootstrap-css bootstrap-js
bootstrap: bootstrap-css bootstrap-js
#
......@@ -88,17 +87,6 @@ bootstrap/css/*.css: less/*.less
recess --compile ${BOOTSTRAP_LESS} > bootstrap/css/bootstrap.css
recess --compress ${BOOTSTRAP_LESS} > bootstrap/css/bootstrap.min.css
#
# FONTS
#
bootstrap-fonts: bootstrap/fonts/*
bootstrap/fonts/*: fonts/*
mkdir -p bootstrap/fonts
cp fonts/* bootstrap/fonts/
#
# WATCH LESS FILES
#
......@@ -114,4 +102,4 @@ watch:
run: build
jekyll build && jekyll server
.PHONY: docs watch gh-pages bootstrap-img bootstrap-css bootstrap-js
.PHONY: docs watch gh-pages bootstrap-css bootstrap-js
README.md
View file @ f0d07183
......@@ -40,7 +40,7 @@ Learn more about using Jekyll by reading their [documentation](http://jekyllrb.c
Documentation for v2.3.2 has been made available for the time being at [http://getbootstrap.com/2.3.2/docs](http://getbootstrap.com/2.3.2/docs) while folks transition to Bootstrap 3.
For previous releases, documentation is available for [download via Git tags](https://github.com/twitter/bootstrap/tags).
[Previous releases](https://github.com/twbs/bootstrap/releases) and their documentation are also available for download.
......
_config.yml
View file @ f0d07183
......@@ -9,4 +9,3 @@ permalink: pretty
source: ./docs
destination: ./_gh_pages
port: 9001
url: http://getbootstrap.dev:9001
docs/_includes/colophon.html
View file @ f0d07183
......@@ -5,7 +5,6 @@
<p>Designed and built with all the love in the world by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.</p>
<p>Code licensed under <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
<p><a href="http://glyphicons.com">Glyphicons Free</a> licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
<ul class="footer-links">
<li><a href="http://blog.getbootstrap.com">Blog</a></li>
<li class="muted">&middot;</li>
......
docs/_includes/footer.html
View file @ f0d07183
......@@ -4,10 +4,6 @@
<script src="/assets/js/jquery.js"></script>
<script src="/assets/js/bootstrap.js"></script>
<!-- Offcanvas example
================================================== -->
<script src="/assets/js/examples/bootstrap-offcanvas.js"></script>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script src="/assets/js/holder/holder.js"></script>
......
docs/_includes/nav-components.html
View file @ f0d07183
<li>
<a href="#icons">Glyphicons</a>
<ul class="nav">
<li><a href="#icons-list">Icon list</a></li>
<li><a href="#icons-how-to">How to use</a></li>
<li><a href="#icons-examples">Examples</a></li>
</ul>
</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>
......@@ -102,9 +93,7 @@
<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> -->
......
docs/_includes/nav-css.html
View file @ f0d07183
......@@ -9,6 +9,9 @@
<li><a href="#overview-container">Container</a></li>
</ul>
</li>
<li>
<a href="#glyphicons">Glyphicons</a>
</li>
<li>
<a href="#grid">Grid system</a>
<ul class="nav">
......@@ -19,7 +22,6 @@
<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>
......
docs/_includes/nav-customize.html
View file @ f0d07183
......@@ -5,7 +5,7 @@
<a href="#plugins">jQuery plugins</a>
</li>
<li>
<a href="#variables">LESS variables</a>
<a href="#less-variables">LESS variables</a>
<ul class="nav">
<li><a href="#variables-basics">Basics</a></li>
<li><a href="#variables-buttons">Buttons</a></li>
......
docs/_includes/nav-getting-started.html
View file @ f0d07183
......@@ -11,6 +11,12 @@
<li>
<a href="#template">Basic template</a>
</li>
<li>
<a href="#browsers">Browser support</a>
</li>
<li>
<a href="#license-faqs">License FAQs</a>
</li>
<li>
<a href="#customizing">Customizing Bootstrap</a>
</li>
\ No newline at end of file
docs/_includes/nav-javascript.html
View file @ f0d07183
......@@ -2,7 +2,7 @@
<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-data-attrs">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">Events</a></li>
......
docs/assets/css/bootstrap.css
View file @ f0d07183
This diff is collapsed.
docs/assets/css/docs.css
View file @ f0d07183
......@@ -81,7 +81,9 @@ body {
/* Textual links */
.bs-masthead-links {
margin: 20px 0;
margin-top: 20px;
margin-bottom: 20px;
padding-left: 0;
list-style: none;
}
.bs-masthead-links li {
......@@ -93,7 +95,6 @@ body {
}
/* Customize and Download button
-------------------------------------------------- */
......@@ -221,11 +222,10 @@ body {
/* Side notes for calling out things
-------------------------------------------------- */
/* Base styles (regardless of theme) */
.bs-callout {
margin: 20px 0;
padding: 15px 30px 15px 15px;
background-color: #fcf2f2;
border-left: 5px solid #df7c7b;
}
.bs-callout h4 {
margin-top: 0;
......@@ -238,6 +238,20 @@ body {
background-color: #fff;
}
/* Themes for different contexts */
.bs-callout-danger {
background-color: #fcf2f2;
border-left: 5px solid #df7c7b;
}
.bs-callout-warning {
background-color: #fefbed;
border-left: 5px solid #f5d659;
}
.bs-callout-info {
background-color: #f0f7fd;
border-left: 5px solid #55a9e1;
}
/* Special grid styles
......@@ -311,7 +325,7 @@ body {
.bs-example > .well:last-child {
margin-bottom: 0;
}
.bs-example > .close {
.bs-example > p > .close {
float: none;
}
......@@ -478,43 +492,6 @@ body {
/* Icons
-------------------------------------------------- */
.the-icons {
padding-bottom: 1px;
margin-left: 0;
list-style: none;
margin-bottom: 20px;
overflow: hidden;
}
.the-icons li {
float: left;
width: 100px;
height: 110px;
padding: 10px;
border: 1px solid #ddd;
font-size: 12px;
line-height: 1.25;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0 -1px -1px 0;
}
.the-icons .glyphicon {
display: block;
margin: 5px auto;
vertical-align: middle;
margin-right: 3px;
font-size: 24px;
}
.the-icons li:hover {
background-color: rgba(255,0,0,.1);
}
/* Responsive docs
-------------------------------------------------- */
......@@ -601,6 +578,7 @@ body {
}
.footer-links {
margin: 10px 0;
padding-left: 0;
}
.footer-links li {
display: inline;
......@@ -616,7 +594,8 @@ body {
}
.bs-social-buttons {
display: inline-block;
margin: 0;
margin-bottom: 0;
padding-left: 0;
list-style: none;
}
.bs-social-buttons li {
......@@ -711,13 +690,6 @@ input.focused {
/* Tablets and up */
@media screen and (min-width: 768px) {
/* Reaffix the fixed sidebar */
.bs-sidebar.affix {
position: fixed; /* Undo the static from mobile-first approach */
top: 50px;
width: 160px;
}
/* Back to top link */
.bs-top {
display: block; /* Unhide */
......@@ -779,6 +751,8 @@ input.focused {
/* Widen the fixed sidebar */
.bs-sidebar.affix {
position: fixed; /* Undo the static from mobile-first approach */
top: 50px;
width: 213px;
}
......
docs/assets/fonts/glyphiconshalflings-regular.svg deleted 100755 → 0
View file @ c5fb401a
This diff is collapsed.
docs/assets/js/application.js
View file @ f0d07183
......@@ -92,7 +92,6 @@
.map(function () { return this.value })
.toArray()
, vars = {}
, img = ['glyphicons-halflings.png', 'glyphicons-halflings-white.png']
$("#less-variables input")
.each(function () {
......@@ -107,7 +106,6 @@
js: js
, css: css
, vars: vars
, img: img
}
})
})
......
docs/assets/js/bootstrap.js
View file @ f0d07183
......@@ -502,6 +502,10 @@
Collapse.prototype.show = function () {
if (this.transitioning || this.$element.hasClass('in')) return
var startEvent = $.Event('show.bs.collapse')
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension()
var scroll = $.camelCase(['scroll', dimension].join('-'))
var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
......@@ -514,16 +518,21 @@
}
this.$element[dimension](0)
this.transition('addClass', $.Event('show.bs.collapse'), 'shown.bs.collapse')
this.transition('addClass', 'shown.bs.collapse')
if ($.support.transition) this.$element[dimension](this.$element[0][scroll])
}
Collapse.prototype.hide = function () {
if (this.transitioning || !this.$element.hasClass('in')) return
var startEvent = $.Event('hide.bs.collapse')
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension()
this.reset(this.$element[dimension]())
this.transition('removeClass', $.Event('hide.bs.collapse'), 'hidden')
this.transition('removeClass', 'shown.bs.hidden')
this.$element[dimension](0)
}
......@@ -535,23 +544,19 @@
[dimension](size || 'auto')
[0].offsetWidth
this.$element[size !== null ? 'addClass' : 'removeClass']('collapse')
this.$element[size != null ? 'addClass' : 'removeClass']('collapse')
return this
}
Collapse.prototype.transition = function (method, startEvent, completeEvent) {
Collapse.prototype.transition = function (method, completeEvent) {
var that = this
var complete = function () {
if (startEvent.type == 'show') that.reset()
if (completeEvent == 'shown.bs.collapse') that.reset()
that.transitioning = 0
that.$element.trigger(completeEvent)
}
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
this.transitioning = 1
this.$element[method]('in')
......@@ -603,7 +608,10 @@
|| e.preventDefault()
|| (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
var option = $(target).data('collapse') ? 'toggle' : $this.data()
var parent = $this.attr('data-parent')
var $parent = parent && $(parent)
if ($parent) $parent.find('[data-toggle=collapse][data-parent=' + parent + ']').not($this).addClass('collapsed')
$this[$(target).hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
$(target).collapse(option)
})
......@@ -1420,6 +1428,8 @@
$tip.find('.popover-content')[this.options.html ? 'html' : 'text'](content)
$tip.removeClass('fade top bottom left right in')
$tip.find('.popover-title:empty').hide()
}
Popover.prototype.hasContent = function () {
......
docs/assets/js/bootstrap.min.js
View file @ f0d07183
This diff is collapsed.
docs/components.html
View file @ f0d07183
This diff is collapsed.
docs/css.html
View file @ f0d07183
This diff is collapsed.
docs/customize.html
View file @ f0d07183
......@@ -206,12 +206,6 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
<div class="row">
<div class="col-lg-4">
<h4>Media</h4>
<div class="checkbox">
<label>
<input type="checkbox" checked value="glyphicons.less">
Glyphicons
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="thumbnails.less">
......@@ -355,9 +349,15 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
</div>
</div>
</div>
<div class="bs-callout">
<h4>Heads up!</h4>
<p>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 class="bs-callout bs-callout-info">
<h4>Produces two files</h4>
<p>All checked plugins will be compiled into a readable <code>bootstrap.js</code> and a minified <code>bootstrap.min.js</code>. We recommend you use the minified version in production.</p>
</div>
<div class="bs-callout bs-callout-danger">
<h4>jQuery required</h4>
<p>All plugins require the latest version of <a href="http://jquery.com/" target="_blank">jQuery</a> to be included.</p>
</div>
</div>
......@@ -404,9 +404,20 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
<label>@line-height-base</label>
<input type="text" placeholder="1.428571429">
<p class="help-block">Used to calculate line-height throughout Bootstrap.</p>
</div>
</div>
<h4>Headings</h4>
<div class="row">
<div class="col-lg-6">
<label>@headings-font-family</label>
<input type="text" placeholder="@font-family-base">
<p class="help-block">Choose a separate font-family for headings.</p>
<label>@headings-font-weight</label>
<input type="text" placeholder="500">
<p class="help-block">Choose a separate font-weight for headings.</p>
</div>
<div class="col-lg-6">
<label>@headings-line-height</label>
<input type="text" placeholder="1.1">
<p class="help-block">Choose a separate line-height for headings.</p>
......@@ -464,6 +475,24 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
</div>
</div>
<h3>Container sizes</h3>
<p>Define the maximum width of <code>.container</code> for different screen sizes.</p>
<div class="row">
<div class="col-lg-6">
<label>@container-tablet</label>
<input type="text" placeholder="728px">
<p class="help-block">For <code>@screen-small</code> and up.</p>
<label>@container-desktop</label>
<input type="text" placeholder="940px">
<p class="help-block">For <code>@screen-medium</code> and up.</p>
</div>
<div class="col-lg-6">
<label>@container-large-desktop</label>
<input type="text" placeholder="1170px">
<p class="help-block">For <code>@screen-large</code> and up.</p>
</div>
</div>
<h3>Grid system</h3>
<p>Define your custom responsive grid.</p>
<div class="row">
......@@ -528,7 +557,7 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
<label>@btn-default-color</label>
<input type="text" placeholder="#fff">
<label>@btn-default-bg</label>
<input type="text" placeholder="#a7a99aa">
<input type="text" placeholder="#474949">
<label>@btn-default-border</label>
<input type="text" placeholder="@btn-default-bg">
<h4>Primary</h4>
......@@ -1128,7 +1157,7 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
<div class="bs-customize-download">
<a class="btn" href="#" onclick="_gaq.push(['_trackEvent', 'Customize', 'Download', 'Customize and Download']);">Customize and Download</a>
</div>
<div class="bs-callout">
<div class="bs-callout bs-callout-danger">
<h4>What's included?</h4>
<p>Downloads include compiled CSS, compiled and minified CSS, and compiled jQuery plugins, all nicely packed up into a zipball for your convenience.</p>
</div>
......
docs/docs.html deleted 100644 → 0
View file @ c5fb401a
This diff is collapsed.
docs/getting-started.html
View file @ f0d07183
......@@ -15,7 +15,7 @@ lead: "An overview of Bootstrap, how to download and use, basic templates and ex
<p class="lead">There are a few easy ways to quickly get started with Bootstrap, each one appealing to a different skill level and use case. Read through to see what suits your particular needs.</p>
<h3>Download compiled CSS and JS</h3>
<p class="lead">The fastest way to get started is to get the compiled and minified versions of our CSS, JavaScript, and fonts. No documentation or original source files are included.</p>
<p class="lead">The fastest way to get started is to get the compiled and minified versions of our CSS and JavaScript. No documentation or original source files are included.</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>
<hr>
......@@ -48,6 +48,11 @@ lead: "An overview of Bootstrap, how to download and use, basic templates and ex
<!-- Latest compiled and minified JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
{% endhighlight %}
<div class="bs-callout bs-callout-warning" id="callout-less-compilation">
<h4>LESS compilation</h4>
<p>If you download the original files, you need to compile Bootstrap's LESS files into usable CSS. To do that, Bootstrap only officially supports <a href="http://twitter.github.io/recess/">Recess</a>, Twitter's CSS hinter built on top of <a href="http://lesscss.org">less.js</a>.</p>
</div>
</div>
<!-- File structure
......@@ -67,21 +72,39 @@ bootstrap/
├── 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>
<div class="bs-callout">
<div class="bs-callout bs-callout-danger">
<h4>jQuery required</h4>
<p>Please note that <strong>all JavaScript plugins require jQuery</strong> to be included, as shown in the <a href="#examples">starter template</a>.</p>
</div>
</div>
<!-- Browser compatibility
================================================== -->
<div class="bs-docs-section" id="browsers">
<div class="page-header">
<h1>Browser compatibility</h1>
</div>
<p class="lead">Bootstrap is built to work best in the latest desktop and mobile browsers, meaning older and less advanced browsers might receive a less stylized, though fully functional, version of certain components.</p>
<h4>Supported browsers</h4>
<p>Specifically, we support the latest versions of the following:</p>
<ul>
<li>Chrome (Mac, Windows, iOS, and Android)</li>
<li>Safari (Mac and iOS only, as Windows has more or less been discontinued)</li>
<li>Firefox (Mac, Windows)</li>
<li>Internet Explorer</li>
<li>Opera (Mac, Windows)</li>
</ul>
<p>Unofficially, Bootstrap should look and behave just fine in Chromium for Linux and Internet Explorer 7-8, though full support is not guaranteed.</p>
<h4>IE Compatibility modes</h4>
<p>Bootstrap is not supported in the old Internet Explorer compatibility modes. To be sure you're using the latest rendering mode for IE, consider including <code>&lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;</code> in your pages. See <a href="http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge">this StackOverflow question</a> for more information.</p>
</div>
<!-- Template
================================================== -->
<div class="bs-docs-section" id="template">
......@@ -123,6 +146,52 @@ bootstrap/
<!-- License FAQs
================================================== -->
<div class="bs-docs-section" id="license-faqs">
<div class="page-header">
<h1>License FAQs</h1>
</div>
<p class="lead">Bootstrap is released under the Apache 2 license. Boiled down to smaller chunks, it can be described with the following conditions.</p>
<div class="row">
<div class="col-12 col-lg-6">
<h4>It allows you to:</h4>
<ul>
<li>Freely download and use Twitter open source software, in whole or in part, for personal, company internal or commercial purposes</li>
<li>Use Twitter open source software in packages or distributions that you create</li>
</ul>
</div>
<div class="col-12 col-lg-6">
<h4>It forbids you to:</h4>
<ul>
<li>Redistribute any piece of Twitter open source originated software without proper attribution</li>
<li>Use any marks owned by Twitter in any way that might state or imply that Twitter endorses your distribution</li>
<li>Use any marks owned by Twitter in any way that might state or imply that you created the Twitter software in question</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-12 col-lg-6">
<h4>It requires you to:</h4>
<ul>
<li>Include a copy of the license in any redistribution you may make that includes Twitter software</li>
<li>Provide clear attribution to Twitter for any distributions that include Twitter open source software</li>
</ul>
</div>
<div class="col-12 col-lg-6">
<h4>It does not require you to:</h4>
<ul>
<li>Include the source of the Twitter software itself, or of any modifications you may have made to it, in any redistribution you may assemble that includes it</li>
<li>Submit changes that you make to the software back to Twitter (though such feedback is encouraged)</li>
</ul>
</div>
</div>
<p>The full Bootstrap license is located <a href="https://github.com/twbs/bootstrap/blob/master/README.md">in the project repository</a> for more information.</p>
</div><!-- /.bs-docs-section -->
<div class="bs-docs-section" id="customizing">
<div class="page-header">
......@@ -132,7 +201,7 @@ bootstrap/
<p>Once you've downloaded and included Bootstrap's CSS into your templates, you can move on to customizing the included components. To do so, create a new stylesheet (LESS, if you like, or just plain CSS) to house your customizations.</p>
<div class="bs-callout">
<div class="bs-callout bs-callout-info">
<h4>Compiled or minified?</h4>
<p>Unless you plan on reading a good chunk of the compiled CSS, go with the minified. It's the same code, just compacted. Less bandwidth is good, especially in production environments.</p>
</div>
......@@ -186,7 +255,7 @@ bootstrap/
</ul>
<p>Going beyond light customizations and into visual overhauls is just as straightforward as the above custom button. For a site like <a href="http://yourkarma.com">Karma</a>, which uses Bootstrap as a CSS reset with heavy modifications, more extensive work is involved, but well worth it in the end.</p>
<div class="bs-callout">
<div class="bs-callout bs-callout-info">
<h4>Alternate customization methods</h4>
<p>While not recommended for folks new to Bootstrap, you may use one of two alternate methods for customization. The first is modifying the source .less files (making upgrades super difficult), and the second is mapping source LESS code to <a href="http://ruby.bvision.com/blog/please-stop-embedding-bootstrap-classes-in-your-html">your own classes via mixins</a>. For the time being, neither options are documented here.</p>
</div>
......
docs/index.html
View file @ f0d07183
......@@ -15,15 +15,15 @@ title: Bootstrap
{% include social-buttons.html %}
<ul class="bs-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="http://examples.getbootstrap.com" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
</li>
<li>
<a href="http://glyphicons.getbootstrap.com" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Glyphicons']);">Glyphicons</a>
</li>
<li>
<a href="http://expo.getbootstrap.com" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Expo']);">Bootstrap Expo</a>
</li>
......
docs/javascript.html
View file @ f0d07183
This diff is collapsed.
fonts/glyphiconshalflings-regular.svg deleted 100755 → 0
View file @ c5fb401a
This diff is collapsed.
js/collapse.js
View file @ f0d07183
......@@ -44,6 +44,10 @@
Collapse.prototype.show = function () {
if (this.transitioning || this.$element.hasClass('in')) return
var startEvent = $.Event('show.bs.collapse')
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension()
var scroll = $.camelCase(['scroll', dimension].join('-'))
var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
......@@ -56,16 +60,21 @@
}
this.$element[dimension](0)
this.transition('addClass', $.Event('show.bs.collapse'), 'shown.bs.collapse')
this.transition('addClass', 'shown.bs.collapse')
if ($.support.transition) this.$element[dimension](this.$element[0][scroll])
}
Collapse.prototype.hide = function () {
if (this.transitioning || !this.$element.hasClass('in')) return
var startEvent = $.Event('hide.bs.collapse')
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
var dimension = this.dimension()
this.reset(this.$element[dimension]())
this.transition('removeClass', $.Event('hide.bs.collapse'), 'hidden')
this.transition('removeClass', 'shown.bs.hidden')
this.$element[dimension](0)
}
......@@ -77,23 +86,19 @@
[dimension](size || 'auto')
[0].offsetWidth
this.$element[size !== null ? 'addClass' : 'removeClass']('collapse')
this.$element[size != null ? 'addClass' : 'removeClass']('collapse')
return this
}
Collapse.prototype.transition = function (method, startEvent, completeEvent) {
Collapse.prototype.transition = function (method, completeEvent) {
var that = this
var complete = function () {
if (startEvent.type == 'show') that.reset()
if (completeEvent == 'shown.bs.collapse') that.reset()
that.transitioning = 0
that.$element.trigger(completeEvent)
}
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
this.transitioning = 1
this.$element[method]('in')
......@@ -145,7 +150,10 @@
|| e.preventDefault()
|| (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') //strip for ie7
var option = $(target).data('collapse') ? 'toggle' : $this.data()
var parent = $this.attr('data-parent')
var $parent = parent && $(parent)
if ($parent) $parent.find('[data-toggle=collapse][data-parent=' + parent + ']').not($this).addClass('collapsed')
$this[$(target).hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
$(target).collapse(option)
})
......
js/popover.js
View file @ f0d07183
......@@ -55,6 +55,8 @@
$tip.find('.popover-content')[this.options.html ? 'html' : 'text'](content)
$tip.removeClass('fade top bottom left right in')
$tip.find('.popover-title:empty').hide()
}
Popover.prototype.hasContent = function () {
......
js/tests/unit/collapse.js
View file @ f0d07183
......@@ -91,4 +91,39 @@ $(function () {
target.click()
})
test("should remove active class from inactive accordion targets", function () {
$.support.transition = false
stop()
var accordion = $('<div id="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
.appendTo($('#qunit-fixture'))
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var collapsible1 = $('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var collapsible2 = $('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var collapsible3 = $('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
start()
})
target3.click()
})
})
less/accordion.less
View file @ f0d07183
......@@ -16,15 +16,12 @@
}
.accordion-heading {
border-bottom: 0;
}
.accordion-heading .accordion-toggle {
.accordion-toggle {
display: block;
padding: 8px 15px;
}
// General toggle styles
.accordion-toggle {
cursor: pointer;
}
}
// Inner needs the styles because you can't animate properly with any styles on the element
......
less/alerts.less
View file @ f0d07183
......@@ -43,37 +43,13 @@
// -------------------------
.alert-success {
background-color: @alert-success-bg;
border-color: @alert-success-border;
color: @alert-success-text;
hr {
border-top-color: darken(@alert-success-border, 5%);
}
.alert-link {
color: darken(@alert-success-text, 10%);
}
.alert-variant(@alert-success-bg, @alert-success-border, @alert-success-text);
}
.alert-danger {
background-color: @alert-danger-bg;
border-color: @alert-danger-border;
color: @alert-danger-text;
hr {
border-top-color: darken(@alert-danger-border, 5%);
}
.alert-link {
color: darken(@alert-danger-text, 10%);
}
.alert-variant(@alert-danger-bg, @alert-danger-border, @alert-danger-text);
}
.alert-info {
background-color: @alert-info-bg;
border-color: @alert-info-border;
color: @alert-info-text;
hr {
border-top-color: darken(@alert-info-border, 5%);
}
.alert-link {
color: darken(@alert-info-text, 10%);
}
.alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text);
}
// Block alerts
......@@ -82,11 +58,12 @@
.alert-block {
padding-top: 15px;
padding-bottom: 15px;
}
.alert-block > p,
.alert-block > ul {
> p,
> ul {
margin-bottom: 0;
}
.alert-block p + p {
}
p + p {
margin-top: 5px;
}
}
less/badges.less
View file @ f0d07183
......@@ -35,16 +35,9 @@ a.badge {
}
// Quick fix for labels/badges in buttons
.btn {
.badge {
.btn .badge {
position: relative;
top: -1px;
}
}
.btn-mini {
.badge {
top: 0;
}
}
// Account for counters in navs
......
less/bootstrap.less
View file @ f0d07183
......@@ -28,7 +28,6 @@
// Components: common
@import "component-animations.less";
@import "glyphicons.less";
@import "dropdowns.less";
@import "list-group.less";
@import "panels.less";
......
less/breadcrumbs.less
View file @ f0d07183
......@@ -12,15 +12,12 @@
> li {
display: inline-block;
text-shadow: 0 1px 0 #fff;
&:after {
&+li:before {
display: inline-block;
content: "\00a0 /"; // Unicode space added since inline-block means non-collapsing white-space
content: "/\00a0"; // Unicode space added since inline-block means non-collapsing white-space
padding: 0 5px;
color: #ccc;
}
&:last-child:after {
display: none; // No divider after last element
}
}
> .active {
color: @gray-light;
......
less/button-groups.less
View file @ f0d07183
......@@ -72,9 +72,11 @@
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0;
}
.btn-group > .btn-group:first-child > .btn:last-child,
.btn-group > .btn-group:first-child > .dropdown-toggle {
.btn-group > .btn-group:first-child {
> .btn:last-child,
> .dropdown-toggle {
.border-right-radius(0);
}
}
.btn-group > .btn-group:last-child > .btn:first-child {
.border-left-radius(0);
......@@ -96,10 +98,6 @@
padding-left: 8px;
padding-right: 8px;
}
.btn-group > .btn-mini + .dropdown-toggle {
padding-left: 5px;
padding-right: 5px;
}
.btn-group > .btn-large + .dropdown-toggle {
padding-left: 12px;
padding-right: 12px;
......@@ -138,14 +136,16 @@
margin-top: -1px;
}
}
.btn-group-vertical .btn:not(:first-child):not(:last-child) {
.btn-group-vertical .btn {
&:not(:first-child):not(:last-child) {
border-radius: 0;
}
.btn-group-vertical .btn:first-child {
}
&:first-child {
.border-bottom-radius(0);
}
.btn-group-vertical .btn:last-child {
}
&:last-child {
.border-top-radius(0);
}
}
......
less/buttons.less
View file @ f0d07183
......@@ -81,33 +81,32 @@
// -------------------------
// Make a button look and behave like a link
.btn-link,
.btn-link:active,
.btn-link[disabled],
fieldset[disabled] .btn-link {
background-color: transparent;
background-image: none;
.box-shadow(none);
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
border-color: transparent;
}
.btn-link {
color: @link-color;
font-weight: normal;
cursor: pointer;
border-radius: 0;
}
.btn-link:hover,
.btn-link:focus {
&,
&:active,
&[disabled],
fieldset[disabled] & {
background-color: transparent;
background-image: none;
.box-shadow(none);
}
&,
&:hover,
&:focus,
&:active {
border-color: transparent;
}
&:hover,
&:focus {
color: @link-hover-color;
text-decoration: underline;
background-color: transparent;
}
.btn-link {
}
&[disabled],
fieldset[disabled] & {
&:hover,
......
less/carousel.less
View file @ f0d07183
......@@ -8,15 +8,10 @@
position: relative;
}
// Wrap all slides, but only show the active one
.carousel-inner {
position: relative;
overflow: hidden;
width: 100%;
}
// Immediate parent of all slides
.carousel-inner {
> .item {
display: none;
......@@ -26,7 +21,7 @@
// Account for jankitude on images
> img,
> a > img {
display: block;
.img-responsive();
line-height: 1;
}
}
......@@ -80,13 +75,8 @@
color: #fff;
text-align: center;
text-shadow: 0 1px 2px rgba(0,0,0,.6);
// we can't have this transition here
// because webkit cancels the carousel
// animation if you trip this while
// in the middle of another animation
// ;_;
// .transition(opacity .2s linear);
// We can't have this transition here because webkit cancels the carousel
// animation if you trip this while in the middle of another animation.
// Set gradients for backgrounds
&.left {
......@@ -130,22 +120,25 @@
left: 50%;
z-index: 15;
width: 100px;
margin: 0 0 0 -50px;
margin-left: -50px;
padding-left: 0;
list-style: none;
text-align: center;
li {
display: inline-block;
width: 8px;
height: 8px;
margin-left: 0;
margin-right: 0;
width: 10px;
height: 10px;
margin: 1px;
text-indent: -999px;
border: 1px solid #fff;
border-radius: 5px;
border-radius: 10px;
cursor: pointer;
}
.active {
margin: 0;
width: 12px;
height: 12px;
background-color: #fff;
}
}
......
less/close.less
View file @ f0d07183
This diff is collapsed.
less/code.less
View file @ f0d07183
This diff is collapsed.
less/dropdowns.less
View file @ f0d07183
This diff is collapsed.
less/forms.less
View file @ f0d07183
This diff is collapsed.
less/glyphicons.less deleted 100644 → 0
View file @ c5fb401a
This diff is collapsed.
less/grid.less
View file @ f0d07183
This diff is collapsed.
less/jumbotron.less
View file @ f0d07183
This diff is collapsed.
less/labels.less
View file @ f0d07183
This diff is collapsed.
less/list-group.less
View file @ f0d07183
This diff is collapsed.
less/media.less
View file @ f0d07183
This diff is collapsed.
less/mixins.less
View file @ f0d07183
This diff is collapsed.
less/modals.less
View file @ f0d07183
......@@ -23,7 +23,6 @@
bottom: 0;
left: 0;
z-index: @zindex-modal-background;
-webkit-overflow-scrolling: touch;
// When fading in the modal, animate it to slide down
&.fade {
......
less/navbar.less
View file @ f0d07183
This diff is collapsed.
less/navs.less
View file @ f0d07183
This diff is collapsed.
less/pager.less
View file @ f0d07183
This diff is collapsed.
less/pagination.less
View file @ f0d07183
This diff is collapsed.
less/popovers.less
View file @ f0d07183
This diff is collapsed.
less/print.less
View file @ f0d07183
This diff is collapsed.
less/progress-bars.less
View file @ f0d07183
This diff is collapsed.
less/responsive-utilities.less
View file @ f0d07183
This diff is collapsed.
less/scaffolding.less
View file @ f0d07183
This diff is collapsed.
less/tables.less
View file @ f0d07183
This diff is collapsed.
less/thumbnails.less
View file @ f0d07183
This diff is collapsed.
less/tooltip.less
View file @ f0d07183
This diff is collapsed.
less/type.less
View file @ f0d07183
This diff is collapsed.
less/variables.less
View file @ f0d07183
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment