mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-02 16:04:07 +03:00
Merge branch 'master' into equal-height-experiment
This commit is contained in:
@@ -13,6 +13,11 @@
|
||||
description: Bootstrap auf Deutsch
|
||||
url: http://holdirbootstrap.de/
|
||||
|
||||
- name: Italian
|
||||
code: it
|
||||
description: Bootstrap in Italiano
|
||||
url: http://www.hackerstribe.com/guide/IT-bootstrap-3.1.1/
|
||||
|
||||
- name: Korean
|
||||
code: ko
|
||||
description: Bootstrap 한국어
|
||||
|
||||
@@ -21,6 +21,10 @@
|
||||
<h4>Don't mix with other components</h4>
|
||||
<p>Icon classes cannot be directly combined with other components. They should not be used along with other classes on the same element. Instead, add a nested <code><span></code> and apply the icon classes to the <code><span></code>.</p>
|
||||
</div>
|
||||
<div class="bs-callout bs-callout-danger">
|
||||
<h4>Only for use on empty elements</h4>
|
||||
<p>Icon classes should only be used on elements that contain no text content and have no child elements.</p>
|
||||
</div>
|
||||
{% highlight html %}
|
||||
<span class="glyphicon glyphicon-search"></span>
|
||||
{% endhighlight %}
|
||||
|
||||
@@ -17,6 +17,10 @@
|
||||
<h4>Requires JavaScript</h4>
|
||||
<p>If JavaScript is disabled and the viewport is narrow enough that the navbar collapses, it will be impossible to expand the navbar and view the content within the <code>.navbar-collapse</code>.</p>
|
||||
</div>
|
||||
<div class="bs-callout bs-callout-info">
|
||||
<h4>Changing the collapsed mobile navbar breakpoint</h4>
|
||||
<p>The navbar collapses into its vertical mobile view when the viewport is narrower than <code>@grid-float-breakpoint</code>, and expands into its horizontal non-mobile view when the viewport is at least <code>@grid-float-breakpoint</code> in width. Adjust this variable in the Less source to control when the navbar collapses/expands. The default value is <code>768px</code> (the smallest "small" or "tablet" screen).</p>
|
||||
</div>
|
||||
|
||||
<div class="bs-example">
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
@@ -38,7 +42,7 @@
|
||||
<li class="active"><a href="#">Link</a></li>
|
||||
<li><a href="#">Link</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -59,7 +63,7 @@
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a href="#">Link</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -93,7 +97,7 @@
|
||||
<li class="active"><a href="#">Link</a></li>
|
||||
<li><a href="#">Link</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -114,7 +118,7 @@
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a href="#">Link</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -348,7 +348,7 @@
|
||||
|
||||
|
||||
<h2 id="tables-responsive">Responsive tables</h2>
|
||||
<p>Create responsive tables by wrapping any <code>.table</code> in <code>.table-responsive</code> to make them scroll horizontally up to small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.</p>
|
||||
<p>Create responsive tables by wrapping any <code>.table</code> in <code>.table-responsive</code> to make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.</p>
|
||||
<div class="bs-example">
|
||||
<div class="table-responsive">
|
||||
<table class="table">
|
||||
|
||||
@@ -146,10 +146,10 @@ You can use the mark tag to <mark>highlight</mark> text.
|
||||
<h3>Underlined text</h3>
|
||||
<p>To underline text use the <code><u></code> tag.</p>
|
||||
<div class="bs-example">
|
||||
<p><u>This line of text is will render as underlined</u></p>
|
||||
<p><u>This line of text will render as underlined</u></p>
|
||||
</div>
|
||||
{% highlight html %}
|
||||
<u>This line of text is will render as underlined</u>
|
||||
<u>This line of text will render as underlined</u>
|
||||
{% endhighlight %}
|
||||
|
||||
<p>Make use of HTML's default emphasis tags with lightweight styles.</p>
|
||||
|
||||
@@ -176,11 +176,13 @@ if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
|
||||
<p>On <code><select></code> elements, the Android stock browser will not display the side controls if there is a <code>border-radius</code> and/or <code>border</code> applied. Use the snippet of code below to remove the offending CSS and render the <code><select></code> as an unstyled element on the Android stock browser. The user agent sniffing avoids interference with Chrome, Safari, and Mozilla browsers.</p>
|
||||
{% highlight html %}
|
||||
<script>
|
||||
var nua = navigator.userAgent
|
||||
var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
|
||||
if (isAndroid) {
|
||||
$('select.form-control').removeClass('form-control').css('width', '100%')
|
||||
}
|
||||
$(function () {
|
||||
var nua = navigator.userAgent
|
||||
var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
|
||||
if (isAndroid) {
|
||||
$('select.form-control').removeClass('form-control').css('width', '100%')
|
||||
}
|
||||
})
|
||||
</script>
|
||||
{% endhighlight %}
|
||||
<p>Want to see an example? <a href="http://jsbin.com/OyaqoDO/2">Check out this JS Bin demo.</a></p>
|
||||
|
||||
@@ -8,21 +8,21 @@
|
||||
<h3 id="download-bootstrap">Bootstrap</h3>
|
||||
<p>Compiled and minified CSS, JavaScript, and fonts. No docs or original source files are included.</p>
|
||||
<p>
|
||||
<a href="{{ site.download.dist }}" class="btn btn-lg btn-outline" role="button" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);">Download Bootstrap</a>
|
||||
<a href="{{ site.download.dist }}" class="btn btn-lg btn-outline" role="button" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download compiled');">Download Bootstrap</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<h3 id="download-source">Source code</h3>
|
||||
<p>Source Less, JavaScript, and font files, along with our docs. <strong>Requires a Less compiler and <a href="{{ site.repo }}#compiling-css-and-javascript">some setup.</a></strong></p>
|
||||
<p>
|
||||
<a href="{{ site.download.source }}" class="btn btn-lg btn-outline" role="button" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download source']);">Download source</a>
|
||||
<a href="{{ site.download.source }}" class="btn btn-lg btn-outline" role="button" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download source');">Download source</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<h3 id="download-sass">Sass</h3>
|
||||
<p><a href="{{ site.sass_repo }}">Bootstrap ported from Less to Sass</a> for easy inclusion in Rails, Compass, or Sass-only projects.</p>
|
||||
<p>
|
||||
<a href="{{ site.download.sass }}" class="btn btn-lg btn-outline" role="button" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download Sass']);">Download Sass</a>
|
||||
<a href="{{ site.download.sass }}" class="btn btn-lg btn-outline" role="button" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download Sass');">Download Sass</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -35,6 +35,8 @@
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-146052-10', 'getbootstrap.com');
|
||||
ga('send', 'pageview');
|
||||
|
||||
</script>
|
||||
|
||||
@@ -64,7 +64,7 @@
|
||||
</table>
|
||||
</div><!-- /.table-responsive -->
|
||||
{% highlight js %}
|
||||
$('#my-alert').bind('closed.bs.alert', function () {
|
||||
$('#my-alert').on('closed.bs.alert', function () {
|
||||
// do something…
|
||||
})
|
||||
{% endhighlight %}
|
||||
|
||||
@@ -37,10 +37,14 @@
|
||||
|
||||
<h4>Checkbox</h4>
|
||||
<p>Add <code>data-toggle="buttons"</code> to a group of checkboxes for checkbox style toggling on btn-group.</p>
|
||||
<div class="bs-callout bs-callout-warning">
|
||||
<h4>Pre-checked options need <code>.active</code></h4>
|
||||
<p>For pre-checked options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
|
||||
</div>
|
||||
<div class="bs-example" style="padding-bottom: 24px;">
|
||||
<div class="btn-group" data-toggle="buttons">
|
||||
<label class="btn btn-primary">
|
||||
<input type="checkbox"> Option 1
|
||||
<label class="btn btn-primary active">
|
||||
<input type="checkbox" checked> Option 1 (pre-checked)
|
||||
</label>
|
||||
<label class="btn btn-primary">
|
||||
<input type="checkbox"> Option 2
|
||||
@@ -52,8 +56,8 @@
|
||||
</div><!-- /example -->
|
||||
{% highlight html %}
|
||||
<div class="btn-group" data-toggle="buttons">
|
||||
<label class="btn btn-primary">
|
||||
<input type="checkbox"> Option 1
|
||||
<label class="btn btn-primary active">
|
||||
<input type="checkbox" checked> Option 1 (pre-checked)
|
||||
</label>
|
||||
<label class="btn btn-primary">
|
||||
<input type="checkbox"> Option 2
|
||||
@@ -66,10 +70,14 @@
|
||||
|
||||
<h4>Radio</h4>
|
||||
<p>Add <code>data-toggle="buttons"</code> to a group of radio inputs for radio style toggling on btn-group.</p>
|
||||
<div class="bs-callout bs-callout-warning">
|
||||
<h4>Preselected options need <code>.active</code></h4>
|
||||
<p>For preselected options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
|
||||
</div>
|
||||
<div class="bs-example" style="padding-bottom: 24px;">
|
||||
<div class="btn-group" data-toggle="buttons">
|
||||
<label class="btn btn-primary">
|
||||
<input type="radio" name="options" id="option1"> Option 1
|
||||
<label class="btn btn-primary active">
|
||||
<input type="radio" name="options" id="option1" checked> Option 1 (preselected)
|
||||
</label>
|
||||
<label class="btn btn-primary">
|
||||
<input type="radio" name="options" id="option2"> Option 2
|
||||
@@ -81,8 +89,8 @@
|
||||
</div><!-- /example -->
|
||||
{% highlight html %}
|
||||
<div class="btn-group" data-toggle="buttons">
|
||||
<label class="btn btn-primary">
|
||||
<input type="radio" name="options" id="option1"> Option 1
|
||||
<label class="btn btn-primary active">
|
||||
<input type="radio" name="options" id="option1" checked> Option 1 (preselected)
|
||||
</label>
|
||||
<label class="btn btn-primary">
|
||||
<input type="radio" name="options" id="option2"> Option 2
|
||||
|
||||
@@ -46,6 +46,12 @@
|
||||
...
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="..." alt="...">
|
||||
<div class="carousel-caption">
|
||||
...
|
||||
</div>
|
||||
</div>
|
||||
...
|
||||
</div>
|
||||
|
||||
@@ -105,7 +111,7 @@
|
||||
</div>
|
||||
</div><!-- /example -->
|
||||
{% highlight html %}
|
||||
<div class="item active">
|
||||
<div class="item">
|
||||
<img src="..." alt="...">
|
||||
<div class="carousel-caption">
|
||||
<h3>...</h3>
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
<div class="collapse navbar-collapse bs-example-js-navbar-collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
<li class="dropdown">
|
||||
<a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@@ -30,7 +30,7 @@
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
|
||||
<a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@@ -42,7 +42,7 @@
|
||||
</ul>
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li id="fat-menu" class="dropdown">
|
||||
<a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
|
||||
<a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@@ -62,7 +62,7 @@
|
||||
<ul class="nav nav-pills">
|
||||
<li class="active"><a href="#">Regular link</a></li>
|
||||
<li class="dropdown">
|
||||
<a id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
|
||||
<a id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <span class="caret"></span></a>
|
||||
<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@@ -72,7 +72,7 @@
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
|
||||
<a id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <span class="caret"></span></a>
|
||||
<ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
@@ -82,7 +82,7 @@
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
<a id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3 <b class="caret"></b></a>
|
||||
<a id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3 <span class="caret"></span></a>
|
||||
<ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop6">
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
|
||||
|
||||
@@ -193,7 +193,10 @@ $('.popover-dismiss').popover({
|
||||
<td>content</td>
|
||||
<td>string | function</td>
|
||||
<td>''</td>
|
||||
<td>Default content value if <code>data-content</code> attribute isn't present</td>
|
||||
<td>
|
||||
<p>Default content value if <code>data-content</code> attribute isn't present.</p>
|
||||
<p>If a function is given, it will be called with 1 argument, which is the element that the popover is attached to.</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>delay</td>
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
<li><a href="#fat">@fat</a></li>
|
||||
<li><a href="#mdo">@mdo</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" id="navbarDrop1" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" id="navbarDrop1" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="navbarDrop1">
|
||||
<li><a href="#one" tabindex="-1">one</a></li>
|
||||
<li><a href="#two" tabindex="-1">two</a></li>
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<li class="active"><a href="#home" data-toggle="tab">Home</a></li>
|
||||
<li><a href="#profile" data-toggle="tab">Profile</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" id="myTabDrop1" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" id="myTabDrop1" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
|
||||
<li><a href="#dropdown1" tabindex="-1" data-toggle="tab">@fat</a></li>
|
||||
<li><a href="#dropdown2" tabindex="-1" data-toggle="tab">@mdo</a></li>
|
||||
|
||||
@@ -28,8 +28,8 @@
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li><a href="{{ site.expo }}" onclick="_gaq.push(['_trackEvent', 'Navbar', 'Community links', 'Expo']);">Expo</a></li>
|
||||
<li><a href="{{ site.blog }}" onclick="_gaq.push(['_trackEvent', 'Navbar', 'Community links', 'Blog']);">Blog</a></li>
|
||||
<li><a href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a></li>
|
||||
<li><a href="{{ site.blog }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Blog');">Blog</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
@@ -43,7 +43,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
return match && decodeURIComponent(match[1].replace(/\+/g, ' '))
|
||||
}
|
||||
|
||||
function createGist(configJson) {
|
||||
function createGist(configJson, callback) {
|
||||
var data = {
|
||||
description: 'Bootstrap Customizer Config',
|
||||
'public': true,
|
||||
@@ -61,10 +61,18 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
})
|
||||
.success(function (result) {
|
||||
var origin = window.location.protocol + '//' + window.location.host
|
||||
history.replaceState(false, document.title, origin + window.location.pathname + '?id=' + result.id)
|
||||
var newUrl = origin + window.location.pathname + '?id=' + result.id
|
||||
history.replaceState(false, document.title, newUrl)
|
||||
callback(result.html_url, newUrl)
|
||||
})
|
||||
.error(function (err) {
|
||||
showError('<strong>Ruh roh!</strong> Could not save gist file, configuration not saved.', err)
|
||||
try {
|
||||
showError('<strong>Ruh roh!</strong> Could not save gist file, configuration not saved.', err)
|
||||
}
|
||||
catch (sameErr) {
|
||||
// deliberately ignore the error
|
||||
}
|
||||
callback('<none>', '<none>')
|
||||
})
|
||||
}
|
||||
|
||||
@@ -155,7 +163,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
complete(content)
|
||||
}
|
||||
|
||||
function generateCustomCSS(vars) {
|
||||
function generateCustomLess(vars) {
|
||||
var result = ''
|
||||
|
||||
for (var key in vars) {
|
||||
@@ -178,10 +186,20 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
var IMPORT_REGEX = /^@import \"(.*?)\";$/
|
||||
var lessLines = __less[lessFilename].split('\n')
|
||||
|
||||
for (var i = 0, imports = []; i < lessLines.length; i++) {
|
||||
var match = IMPORT_REGEX.exec(lessLines[i])
|
||||
if (match) imports.push(match[1])
|
||||
}
|
||||
var imports = []
|
||||
$.each(lessLines, function (index, lessLine) {
|
||||
var match = IMPORT_REGEX.exec(lessLine)
|
||||
if (match) {
|
||||
var importee = match[1]
|
||||
var transitiveImports = includedLessFilenames(importee)
|
||||
$.each(transitiveImports, function (index, transitiveImportee) {
|
||||
if ($.inArray(transitiveImportee, imports) === -1) {
|
||||
imports.push(transitiveImportee)
|
||||
}
|
||||
})
|
||||
imports.push(importee)
|
||||
}
|
||||
})
|
||||
|
||||
return imports
|
||||
}
|
||||
@@ -189,7 +207,8 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
function generateLESS(lessFilename, lessFileIncludes, vars) {
|
||||
var lessSource = __less[lessFilename]
|
||||
|
||||
$.each(includedLessFilenames(lessFilename), function(index, filename) {
|
||||
var lessFilenames = includedLessFilenames(lessFilename)
|
||||
$.each(lessFilenames, function(index, filename) {
|
||||
var fileInclude = lessFileIncludes[filename]
|
||||
|
||||
// Files not explicitly unchecked are compiled into the final stylesheet.
|
||||
@@ -200,7 +219,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
|
||||
// Custom variables are added after Bootstrap variables so the custom
|
||||
// ones take precedence.
|
||||
if (('variables.less' === filename) && vars) lessSource += generateCustomCSS(vars)
|
||||
if (('variables.less' === filename) && vars) lessSource += generateCustomLess(vars)
|
||||
})
|
||||
|
||||
lessSource = lessSource.replace(/@import[^\n]*/gi, '') //strip any imports
|
||||
@@ -221,7 +240,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
})
|
||||
}
|
||||
|
||||
function generateCSS() {
|
||||
function generateCSS(preamble) {
|
||||
var oneChecked = false
|
||||
var lessFileIncludes = {}
|
||||
$('#less-section input').each(function() {
|
||||
@@ -242,8 +261,8 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
$(this).val() && (vars[$(this).prev().text()] = $(this).val())
|
||||
})
|
||||
|
||||
var bsLessSource = generateLESS('bootstrap.less', lessFileIncludes, vars)
|
||||
var themeLessSource = generateLESS('theme.less', lessFileIncludes, vars)
|
||||
var bsLessSource = preamble + generateLESS('bootstrap.less', lessFileIncludes, vars)
|
||||
var themeLessSource = preamble + generateLESS('theme.less', lessFileIncludes, vars)
|
||||
|
||||
try {
|
||||
compileLESS(bsLessSource, 'bootstrap', result)
|
||||
@@ -255,7 +274,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
return result
|
||||
}
|
||||
|
||||
function generateJavascript() {
|
||||
function generateJavascript(preamble) {
|
||||
var $checked = $('#plugin-section input:checked')
|
||||
if (!$checked.length) return false
|
||||
|
||||
@@ -265,8 +284,8 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
.join('\n')
|
||||
|
||||
return {
|
||||
'bootstrap.js': js,
|
||||
'bootstrap.min.js': cw + uglify(js)
|
||||
'bootstrap.js': preamble + js,
|
||||
'bootstrap.min.js': preamble + cw + uglify(js)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -322,10 +341,19 @@ window.onload = function () { // wait for load in a dumb way because B-0
|
||||
|
||||
$compileBtn.attr('disabled', 'disabled')
|
||||
|
||||
generateZip(generateCSS(), generateJavascript(), generateFonts(), configJson, function (blob) {
|
||||
$compileBtn.removeAttr('disabled')
|
||||
saveAs(blob, 'bootstrap.zip')
|
||||
createGist(configJson)
|
||||
createGist(configJson, function (gistUrl, customizerUrl) {
|
||||
configData.customizerUrl = customizerUrl
|
||||
configJson = JSON.stringify(configData, null, 2)
|
||||
|
||||
var preamble = '/*!\n' +
|
||||
' * Generated using the Bootstrap Customizer (' + customizerUrl + ')\n' +
|
||||
' * Config saved to config.json and ' + gistUrl + '\n' +
|
||||
' */\n'
|
||||
|
||||
generateZip(generateCSS(preamble), generateJavascript(preamble), generateFonts(), configJson, function (blob) {
|
||||
$compileBtn.removeAttr('disabled')
|
||||
saveAs(blob, 'bootstrap.zip')
|
||||
})
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
Vendored
+3
-3
File diff suppressed because one or more lines are too long
Vendored
+2
-2
File diff suppressed because one or more lines are too long
+1
-1
@@ -356,7 +356,7 @@ lead: Customize Bootstrap's components, Less variables, and jQuery plugins to ge
|
||||
|
||||
<p class="lead">Hooray! Your custom version of Bootstrap is now ready to be compiled. Just click the button below to finish the process.</p>
|
||||
<div class="bs-customize-download">
|
||||
<button type="submit" id="btn-compile" disabled class="btn btn-block btn-lg btn-outline" onclick="_gaq.push(['_trackEvent', 'Customize', 'Download', 'Customize and Download']);">Compile and Download</button>
|
||||
<button type="submit" id="btn-compile" disabled class="btn btn-block btn-lg btn-outline" onclick="ga('send', 'event', 'Customize', 'Download', 'Customize and Download');">Compile and Download</button>
|
||||
</div>
|
||||
</div><!-- /download -->
|
||||
</form>
|
||||
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
File diff suppressed because one or more lines are too long
@@ -48,7 +48,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
<li><a href="#">Link</a></li>
|
||||
<li><a href="#">Link</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -343,7 +343,7 @@
|
||||
<h1>Dropdown menus</h1>
|
||||
</div>
|
||||
<div class="dropdown theme-dropdown clearfix">
|
||||
<a id="dropdownMenu1" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a id="dropdownMenu1" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
|
||||
<li class="active" role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
|
||||
@@ -392,7 +392,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -425,7 +425,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -345,7 +345,7 @@
|
||||
<h1>Dropdown menus</h1>
|
||||
</div>
|
||||
<div class="dropdown theme-dropdown clearfix">
|
||||
<a id="dropdownMenu1" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a id="dropdownMenu1" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
|
||||
<li class="active" role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
|
||||
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
|
||||
@@ -394,7 +394,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
@@ -427,7 +427,7 @@
|
||||
<li><a href="#about">About</a></li>
|
||||
<li><a href="#contact">Contact</a></li>
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#">Action</a></li>
|
||||
<li><a href="#">Another action</a></li>
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
<link rel="icon" href="../../assets/ico/favicon.ico">
|
||||
|
||||
<title>Tooltip Viewport Example for Bootstrap</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link href="../../dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
<!-- Custom styles for this template -->
|
||||
<link href="tooltip-viewport.css" rel="stylesheet">
|
||||
|
||||
<!-- Just for debugging purposes. Don't actually copy this line! -->
|
||||
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
|
||||
|
||||
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
||||
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<button class="btn pull-right tooltip-bottom" title="This should be shifted to the left">Shift Left</button>
|
||||
<button class="btn tooltip-bottom" title="This should be shifted to the right">Shift Right</button>
|
||||
<button class="btn tooltip-right" title="This should be shifted down">Shift Down</button>
|
||||
|
||||
<div class="placeholder">There is a button down there ↓</div>
|
||||
|
||||
<button class="btn tooltip-right" title="This should be shifted up">Shift Up</button>
|
||||
|
||||
<div class="container-viewport">
|
||||
<button class="btn tooltip-viewport-bottom" title="This should be shifted to the left">Shift Left</button>
|
||||
<button class="btn tooltip-viewport-right" title="This should be shifted down">Shift Down</button>
|
||||
|
||||
<button class="btn pull-right tooltip-viewport-bottom" title="This should be shifted to the right">Shift Right</button>
|
||||
|
||||
<button class="btn tooltip-viewport-right btn-bottom" title="This should be shifted up">Shift Up</button>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Bootstrap core JavaScript
|
||||
================================================== -->
|
||||
<!-- Placed at the end of the document so the pages load faster -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script src="../../dist/js/bootstrap.min.js"></script>
|
||||
<script src="tooltip-viewport.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,28 @@
|
||||
body {
|
||||
height: 1200px;
|
||||
}
|
||||
.tooltip {
|
||||
min-width: 250px;
|
||||
max-width: 500px;
|
||||
}
|
||||
.tooltip .tooltip-inner {
|
||||
min-width: 250px;
|
||||
max-width: 500px;
|
||||
min-height: 200px;
|
||||
}
|
||||
.placeholder {
|
||||
height: 900px;
|
||||
}
|
||||
.container-viewport {
|
||||
position: absolute;
|
||||
top: 600px;
|
||||
left: 200px;
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
background: #c00;
|
||||
}
|
||||
.btn-bottom {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
$(document).ready(function () {
|
||||
$('.tooltip-right').tooltip({
|
||||
placement: 'right',
|
||||
viewport: {selector: 'body', padding: 2}
|
||||
})
|
||||
$('.tooltip-bottom').tooltip({
|
||||
placement: 'bottom',
|
||||
viewport: {selector: 'body', padding: 2}
|
||||
})
|
||||
$('.tooltip-viewport-right').tooltip({
|
||||
placement: 'right',
|
||||
viewport: {selector: '.container-viewport', padding: 2}
|
||||
})
|
||||
$('.tooltip-viewport-bottom').tooltip({
|
||||
placement: 'bottom',
|
||||
viewport: {selector: '.container-viewport', padding: 2}
|
||||
})
|
||||
})
|
||||
+1
-1
@@ -9,7 +9,7 @@ title: Bootstrap
|
||||
<!-- <h1>Bootstrap</h1> -->
|
||||
<p class="lead">The most popular front-end framework for developing responsive, mobile first projects on the web.</p>
|
||||
<p class="lead">
|
||||
<a href="getting-started#download" class="btn btn-outline-inverse btn-lg" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download {{ site.current_version }}']);">Download Bootstrap</a>
|
||||
<a href="getting-started#download" class="btn btn-outline-inverse btn-lg" onclick="ga('send', 'event', 'Jumbotron actions', 'Download', 'Download {{ site.current_version }}');">Download Bootstrap</a>
|
||||
</p>
|
||||
<p class="version">Currently v{{ site.current_version }}</p>
|
||||
{% include ads.html %}
|
||||
|
||||
Reference in New Issue
Block a user