Skip to content

B
bootstrap
Commit 6f2f947a authored by Jacob Thornton's avatar Jacob Thornton
Browse files
Options

add build tool for js + rename twipsy to tooltip + lots of little doc cleanup

parent 51e4e770
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 297 additions and 172 deletions
Makefile
View file @ 6f2f947a
...@@ -31,7 +31,7 @@ uglify: ...@@ -31,7 +31,7 @@ uglify:
uglifyjs -o js/min/bootstrap-scrollspy.js js/bootstrap-scrollspy.js;\ uglifyjs -o js/min/bootstrap-scrollspy.js js/bootstrap-scrollspy.js;\
uglifyjs -o js/min/bootstrap-tabs.js js/bootstrap-tab.js;\ uglifyjs -o js/min/bootstrap-tabs.js js/bootstrap-tab.js;\
uglifyjs -o js/min/bootstrap-transitions.js js/bootstrap-transition.js;\ uglifyjs -o js/min/bootstrap-transitions.js js/bootstrap-transition.js;\
uglifyjs -o js/min/bootstrap-twipsy.js js/bootstrap-twipsy.js;\ uglifyjs -o js/min/bootstrap-tooltip.js js/bootstrap-tooltip.js;\
else \ else \
echo "You must have the UGLIFYJS minifier installed in order to minify Bootstrap's js."; \ echo "You must have the UGLIFYJS minifier installed in order to minify Bootstrap's js."; \
echo "You can install it by running: npm install uglify-js -g"; \ echo "You can install it by running: npm install uglify-js -g"; \
......
bootstrap.css
View file @ 6f2f947a
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
* http://www.apache.org/licenses/LICENSE-2.0 * http://www.apache.org/licenses/LICENSE-2.0
* *
* Designed and built with all the love in the world @twitter by @mdo and @fat. * Designed and built with all the love in the world @twitter by @mdo and @fat.
* Date: Mon Jan 9 09:15:32 PST 2012 * Date: Wed Jan 11 20:37:24 PST 2012
*/ */
html, body { html, body {
margin: 0; margin: 0;
...@@ -2208,7 +2208,7 @@ i { ...@@ -2208,7 +2208,7 @@ i {
float: right; float: right;
margin-left: 5px; margin-left: 5px;
} }
.twipsy { .tooltip {
position: absolute; position: absolute;
z-index: 1020; z-index: 1020;
display: block; display: block;
...@@ -2219,24 +2219,24 @@ i { ...@@ -2219,24 +2219,24 @@ i {
-moz-opacity: 0; -moz-opacity: 0;
opacity: 0; opacity: 0;
} }
.twipsy.in { .tooltip.in {
filter: alpha(opacity=80); filter: alpha(opacity=80);
-moz-opacity: 0.8; -moz-opacity: 0.8;
opacity: 0.8; opacity: 0.8;
} }
.twipsy.top { .tooltip.top {
margin-top: -2px; margin-top: -2px;
} }
.twipsy.right { .tooltip.right {
margin-left: 2px; margin-left: 2px;
} }
.twipsy.bottom { .tooltip.bottom {
margin-top: 2px; margin-top: 2px;
} }
.twipsy.left { .tooltip.left {
margin-left: -2px; margin-left: -2px;
} }
.twipsy.top .twipsy-arrow { .tooltip.top .tooltip-arrow {
bottom: 0; bottom: 0;
left: 50%; left: 50%;
margin-left: -5px; margin-left: -5px;
...@@ -2244,7 +2244,7 @@ i { ...@@ -2244,7 +2244,7 @@ i {
border-right: 5px solid transparent; border-right: 5px solid transparent;
border-top: 5px solid #000000; border-top: 5px solid #000000;
} }
.twipsy.left .twipsy-arrow { .tooltip.left .tooltip-arrow {
top: 50%; top: 50%;
right: 0; right: 0;
margin-top: -5px; margin-top: -5px;
...@@ -2252,7 +2252,7 @@ i { ...@@ -2252,7 +2252,7 @@ i {
border-bottom: 5px solid transparent; border-bottom: 5px solid transparent;
border-left: 5px solid #000000; border-left: 5px solid #000000;
} }
.twipsy.bottom .twipsy-arrow { .tooltip.bottom .tooltip-arrow {
top: 0; top: 0;
left: 50%; left: 50%;
margin-left: -5px; margin-left: -5px;
...@@ -2260,7 +2260,7 @@ i { ...@@ -2260,7 +2260,7 @@ i {
border-right: 5px solid transparent; border-right: 5px solid transparent;
border-bottom: 5px solid #000000; border-bottom: 5px solid #000000;
} }
.twipsy.right .twipsy-arrow { .tooltip.right .tooltip-arrow {
top: 50%; top: 50%;
left: 0; left: 0;
margin-top: -5px; margin-top: -5px;
...@@ -2268,7 +2268,7 @@ i { ...@@ -2268,7 +2268,7 @@ i {
border-bottom: 5px solid transparent; border-bottom: 5px solid transparent;
border-right: 5px solid #000000; border-right: 5px solid #000000;
} }
.twipsy-inner { .tooltip-inner {
max-width: 200px; max-width: 200px;
padding: 3px 8px; padding: 3px 8px;
color: white; color: white;
...@@ -2279,7 +2279,7 @@ i { ...@@ -2279,7 +2279,7 @@ i {
-moz-border-radius: 4px; -moz-border-radius: 4px;
border-radius: 4px; border-radius: 4px;
} }
.twipsy-arrow { .tooltip-arrow {
position: absolute; position: absolute;
width: 0; width: 0;
height: 0; height: 0;
...@@ -2619,6 +2619,9 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { ...@@ -2619,6 +2619,9 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
-moz-border-radius: 5px; -moz-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
} }
.btn-group.open .dropdown-menu.large {
top: 40px;
}
.btn-group.open .dropdown-toggle { .btn-group.open .dropdown-toggle {
background-image: none; background-image: none;
-webkit-box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); -webkit-box-shadow: inset 0 1px 6px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
......
bootstrap.min.css
View file @ 6f2f947a
...@@ -412,17 +412,17 @@ i{background-image:url(docs/assets/img/glyphicons-halflings-sprite.png);backgrou ...@@ -412,17 +412,17 @@ i{background-image:url(docs/assets/img/glyphicons-halflings-sprite.png);backgrou
.modal-footer{padding:14px 15px 15px;margin-bottom:0;background-color:#f5f5f5;border-top:1px solid #ddd;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:inset 0 1px 0 #ffffff;-moz-box-shadow:inset 0 1px 0 #ffffff;box-shadow:inset 0 1px 0 #ffffff;zoom:1;}.modal-footer:before,.modal-footer:after{display:table;*display:inline;content:"";zoom:1;} .modal-footer{padding:14px 15px 15px;margin-bottom:0;background-color:#f5f5f5;border-top:1px solid #ddd;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:inset 0 1px 0 #ffffff;-moz-box-shadow:inset 0 1px 0 #ffffff;box-shadow:inset 0 1px 0 #ffffff;zoom:1;}.modal-footer:before,.modal-footer:after{display:table;*display:inline;content:"";zoom:1;}
.modal-footer:after{clear:both;} .modal-footer:after{clear:both;}
.modal-footer .btn{float:right;margin-left:5px;} .modal-footer .btn{float:right;margin-left:5px;}
.twipsy{position:absolute;z-index:1020;display:block;visibility:visible;padding:5px;font-size:11px;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}.twipsy.in{filter:alpha(opacity=80);-moz-opacity:0.8;opacity:0.8;} .tooltip{position:absolute;z-index:1020;display:block;visibility:visible;padding:5px;font-size:11px;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}.tooltip.in{filter:alpha(opacity=80);-moz-opacity:0.8;opacity:0.8;}
.twipsy.top{margin-top:-2px;} .tooltip.top{margin-top:-2px;}
.twipsy.right{margin-left:2px;} .tooltip.right{margin-left:2px;}
.twipsy.bottom{margin-top:2px;} .tooltip.bottom{margin-top:2px;}
.twipsy.left{margin-left:-2px;} .tooltip.left{margin-left:-2px;}
.twipsy.top .twipsy-arrow{bottom:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #000000;} .tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-top:5px solid #000000;}
.twipsy.left .twipsy-arrow{top:50%;right:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid #000000;} .tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid #000000;}
.twipsy.bottom .twipsy-arrow{top:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000000;} .tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #000000;}
.twipsy.right .twipsy-arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;} .tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;}
.twipsy-inner{max-width:200px;padding:3px 8px;color:white;text-align:center;text-decoration:none;background-color:#000000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;} .tooltip-inner{max-width:200px;padding:3px 8px;color:white;text-align:center;text-decoration:none;background-color:#000000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.twipsy-arrow{position:absolute;width:0;height:0;} .tooltip-arrow{position:absolute;width:0;height:0;}
.popover{position:absolute;top:0;left:0;z-index:1010;display:none;padding:5px;}.popover.top{margin-top:-5px;} .popover{position:absolute;top:0;left:0;z-index:1010;display:none;padding:5px;}.popover.top{margin-top:-5px;}
.popover.right{margin-left:5px;} .popover.right{margin-left:5px;}
.popover.bottom{margin-top:5px;} .popover.bottom{margin-top:5px;}
...@@ -460,7 +460,7 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0; ...@@ -460,7 +460,7 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
.btn-group .btn.large:last-child,.btn-group .large.dropdown-toggle{-webkit-border-top-right-radius:6px;-moz-border-radius-topright:6px;border-top-right-radius:6px;-webkit-border-bottom-right-radius:6px;-moz-border-radius-bottomright:6px;border-bottom-right-radius:6px;} .btn-group .btn.large:last-child,.btn-group .large.dropdown-toggle{-webkit-border-top-right-radius:6px;-moz-border-radius-topright:6px;border-top-right-radius:6px;-webkit-border-bottom-right-radius:6px;-moz-border-radius-bottomright:6px;border-bottom-right-radius:6px;}
.btn-group .btn:hover,.btn-group .btn:focus,.btn-group .btn:active{z-index:2;} .btn-group .btn:hover,.btn-group .btn:focus,.btn-group .btn:active{z-index:2;}
.btn-group .dropdown-toggle{padding-left:8px;padding-right:8px;-webkit-box-shadow:inset 1px 0 0 rgba(255, 255, 255, 0.125),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 1px 0 0 rgba(255, 255, 255, 0.125),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 1px 0 0 rgba(255, 255, 255, 0.125),0 1px 2px rgba(0, 0, 0, 0.05);} .btn-group .dropdown-toggle{padding-left:8px;padding-right:8px;-webkit-box-shadow:inset 1px 0 0 rgba(255, 255, 255, 0.125),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 1px 0 0 rgba(255, 255, 255, 0.125),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 1px 0 0 rgba(255, 255, 255, 0.125),0 1px 2px rgba(0, 0, 0, 0.05);}
.btn-group.open .dropdown-menu{display:block;top:30px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;} .btn-group.open .dropdown-menu{display:block;top:30px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}.btn-group.open .dropdown-menu.large{top:40px;}
.btn-group.open .dropdown-toggle{background-image:none;-webkit-box-shadow:inset 0 1px 6px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 6px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 6px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);} .btn-group.open .dropdown-toggle{background-image:none;-webkit-box-shadow:inset 0 1px 6px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 6px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 6px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);}
.btn .caret{margin-top:6px;margin-left:0;} .btn .caret{margin-top:6px;margin-left:0;}
.primary .caret,.danger .caret,.info .caret,.success .caret{border-top-color:#fff;filter:alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;} .primary .caret,.danger .caret,.info .caret,.success .caret{border-top-color:#fff;filter:alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;}
...@@ -518,4 +518,4 @@ a.thumbnail:hover{border-color:#0088cc;-webkit-box-shadow:0 1px 4px rgba(0, 105, ...@@ -518,4 +518,4 @@ a.thumbnail:hover{border-color:#0088cc;-webkit-box-shadow:0 1px 4px rgba(0, 105,
.show{display:block;} .show{display:block;}
.invisible{visibility:hidden;} .invisible{visibility:hidden;}
.hidden{display:none;visibility:hidden;} .hidden{display:none;visibility:hidden;}
@media (max-width: 480px){.navbar .nav{position:absolute;top:0;left:0;width:180px;padding-top:40px;list-style:none;} .navbar .nav,.navbar .nav>li:last-child a{-webkit-border-radius:0 0 4px 0;-moz-border-radius:0 0 4px 0;border-radius:0 0 4px 0;} .navbar .nav>li{float:none;display:none;} .navbar .nav>li>a{float:none;background-color:#222;} .navbar .nav>.active{display:block;position:absolute;top:0;left:0;} .navbar .nav>.active>a{background-color:transparent;} .navbar .nav>.active>a:hover{background-color:#333;} .navbar .nav>.active>a:after{display:inline-block;width:0;height:0;margin-top:8px;margin-left:6px;text-indent:-99999px;vertical-align:top;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #ffffff;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;content:"↓";} .navbar .nav:hover>li{display:block;} .navbar .nav:hover>li>a:hover{background-color:#333;} .horizontal-form .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .horizontal-form .controls{margin-left:0;} .horizontal-form .control-list{padding-top:0;} .horizontal-form .form-actions{padding-left:0;} .modal{position:fixed;top:20px;left:20px;right:20px;width:auto;}.modal.fade.in{top:auto;} .modal-header .close{padding:10px;}}@media (max-width: 768px){.navbar-fixed{position:absolute;} .navbar-fixed .nav{float:none;} .container{width:auto;padding:0 20px;} .row{margin-left:0;} .row>[class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}} @media (max-width:480px){.navbar .nav{position:absolute;top:0;left:0;width:180px;padding-top:40px;list-style:none;} .navbar .nav,.navbar .nav>li:last-child a{-webkit-border-radius:0 0 4px 0;-moz-border-radius:0 0 4px 0;border-radius:0 0 4px 0;} .navbar .nav>li{float:none;display:none;} .navbar .nav>li>a{float:none;background-color:#222;} .navbar .nav>.active{display:block;position:absolute;top:0;left:0;} .navbar .nav>.active>a{background-color:transparent;} .navbar .nav>.active>a:hover{background-color:#333;} .navbar .nav>.active>a:after{display:inline-block;width:0;height:0;margin-top:8px;margin-left:6px;text-indent:-99999px;vertical-align:top;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #ffffff;filter:alpha(opacity=100);-moz-opacity:1;opacity:1;content:"↓";} .navbar .nav:hover>li{display:block;} .navbar .nav:hover>li>a:hover{background-color:#333;} .horizontal-form .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .horizontal-form .controls{margin-left:0;} .horizontal-form .control-list{padding-top:0;} .horizontal-form .form-actions{padding-left:0;} .modal{position:fixed;top:20px;left:20px;right:20px;width:auto;}.modal.fade.in{top:auto;} .modal-header .close{padding:10px;}}@media (max-width:768px){.navbar-fixed{position:absolute;} .navbar-fixed .nav{float:none;} .container{width:auto;padding:0 20px;} .row{margin-left:0;} .row>[class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width:768px) and (max-width:940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}}
docs/assets/css/docs.css
View file @ 6f2f947a
...@@ -466,7 +466,7 @@ form.well { ...@@ -466,7 +466,7 @@ form.well {
/* Icons /* Icons
------------------------- */ ------------------------- */
.the-icons { .the-icons {
} }
.the-icons i { .the-icons i {
display: block; display: block;
...@@ -481,6 +481,13 @@ form.well { ...@@ -481,6 +481,13 @@ form.well {
width: 100px; width: 100px;
} }
#javascript input[type='checkbox'] {
display: inline;
margin-left: 6px;
position: relative;
top: -1px;
}
/* Responsive Docs /* Responsive Docs
-------------------------------------------------- */ -------------------------------------------------- */
......
docs/assets/js/application.js
View file @ 6f2f947a
...@@ -48,18 +48,18 @@ $(function(){ ...@@ -48,18 +48,18 @@ $(function(){
setTimeout(function () { $(el).select() }, 0) setTimeout(function () { $(el).select() }, 0)
}) })
if ($.fn.twipsy) { if ($.fn.tooltip) {
// position static twipsies for components page // position static twipsies for components page
if ($(".twipsies a").length) { if ($(".twipsies a").length) {
$(window).on('load resize', function () { $(window).on('load resize', function () {
$(".twipsies a").each(function () { $(".twipsies a").each(function () {
$(this) $(this)
.twipsy({ .tooltip({
placement: $(this).attr('title') placement: $(this).attr('title')
, trigger: 'manual' , trigger: 'manual'
}) })
.twipsy('show') .tooltip('show')
}) })
}) })
} }
...@@ -67,7 +67,7 @@ $(function(){ ...@@ -67,7 +67,7 @@ $(function(){
// add tipsies to grid for scaffolding // add tipsies to grid for scaffolding
if ($('#grid-system').length) { if ($('#grid-system').length) {
$('#grid-system').twipsy({ $('#grid-system').tooltip({
selector: '.show-grid > div' selector: '.show-grid > div'
, title: function () { return $(this).width() + 'px' } , title: function () { return $(this).width() + 'px' }
}) })
...@@ -75,4 +75,79 @@ $(function(){ ...@@ -75,4 +75,79 @@ $(function(){
} }
} }
// javascript build logic
var inputs = $("#javascript input")
// toggle all plugin checkboxes
$('#selectAll').on('click', function (e) {
e.preventDefault()
inputs.attr('checked', !inputs.is(':checked'))
})
// handle build button dropdown
var buildTypes = $('#javascriptBuilder .dropdown-menu li').on('click', function () {
buildTypes.removeClass('active')
$(this).addClass('active')
})
// request built javascript
$('#javascriptBuild').on('click', function () {
var names = $("#javascript input:checked")
.map(function () { return this.value })
.toArray()
if (names[names.length - 1] == 'bootstrap-transition.js') {
names.unshift(names.pop())
}
$.ajax({
type: 'POST'
, dataType: 'jsonpi'
, params: {
branch: '2.0-wip'
, dir: 'js'
, filenames: names
, compress: buildTypes.first().hasClass('active')
}
, url: "http://bootstrap.herokuapp.com"
})
})
}) })
// Modified from the original jsonpi https://github.com/benvinegar/jquery-jsonpi
// by the talented Ben Vinegar
!function($) {
$.ajaxTransport('jsonpi', function(opts, originalOptions, jqXHR) {
var url = opts.url;
return {
send: function(_, completeCallback) {
var name = 'jQuery_iframe_' + jQuery.now(),
iframe, form;
iframe = $('<iframe>')
.attr('name', name)
.appendTo('head');
form = $('<form>')
.attr('method', opts.type) // GET or POST
.attr('action', url)
.attr('target', name);
$.each(opts.params, function(k, v) {
$('<input>')
.attr('type', 'hidden')
.attr('name', k)
.attr('value', v)
.appendTo(form);
});
form.appendTo('body').submit();
}
};
});
}(jQuery);
\ No newline at end of file
docs/components.html
View file @ 6f2f947a
...@@ -147,7 +147,7 @@ ...@@ -147,7 +147,7 @@
<li class="divider"></li> <li class="divider"></li>
<li><a href="#">Separated link</a></li> <li><a href="#">Separated link</a></li>
</ul> </ul>
</div><!-- /btn-group --> </div><!-- /btn-group -->
<div class="btn-group"> <div class="btn-group">
<a class="btn primary" href="#">Action</a> <a class="btn primary" href="#">Action</a>
<a class="btn primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a> <a class="btn primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
...@@ -158,7 +158,7 @@ ...@@ -158,7 +158,7 @@
<li class="divider"></li> <li class="divider"></li>
<li><a href="#">Separated link</a></li> <li><a href="#">Separated link</a></li>
</ul> </ul>
</div><!-- /btn-group --> </div><!-- /btn-group -->
<div class="btn-group"> <div class="btn-group">
<a class="btn danger" href="#">Danger</a> <a class="btn danger" href="#">Danger</a>
<a class="btn danger dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a> <a class="btn danger dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
...@@ -214,7 +214,7 @@ ...@@ -214,7 +214,7 @@
</div> </div>
</div> </div>
</section> </section>
<!-- Nav, Tabs, & Pills <!-- Nav, Tabs, & Pills
...@@ -331,7 +331,7 @@ ...@@ -331,7 +331,7 @@
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;ul class="nav tabs"&gt; &lt;ul class="nav tabs"&gt;
&lt;li class="dropdown"&gt; &lt;li class="dropdown"&gt;
&lt;a class="dropdown-toggle" &lt;a class="dropdown-toggle"
data-toggle="dropdown" data-toggle="dropdown"
href="#"&gt; href="#"&gt;
Dropdown Dropdown
...@@ -363,7 +363,7 @@ ...@@ -363,7 +363,7 @@
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;ul class="nav pills"&gt; &lt;ul class="nav pills"&gt;
&lt;li class="dropdown"&gt; &lt;li class="dropdown"&gt;
&lt;a class="dropdown-toggle" &lt;a class="dropdown-toggle"
data-toggle="dropdown" data-toggle="dropdown"
href="#"&gt; href="#"&gt;
Dropdown Dropdown
...@@ -483,7 +483,7 @@ ...@@ -483,7 +483,7 @@
<p><a class="btn" href="./javascript.html/#tabs">Get the javascript &rarr;</a></p> <p><a class="btn" href="./javascript.html/#tabs">Get the javascript &rarr;</a></p>
</div> </div>
</div> </div>
<h3>Straightforward markup</h3> <h3>Straightforward markup</h3>
<p>Using tabbable tabs requires a wrapping div, a set of tabs, and a set of tabbable panes of content.</p> <p>Using tabbable tabs requires a wrapping div, a set of tabs, and a set of tabbable panes of content.</p>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
...@@ -509,7 +509,7 @@ ...@@ -509,7 +509,7 @@
<div class="span4"> <div class="span4">
<p>Swap the order of your HTML&mdash;placing <code>.tabs</code> after <code>.tab-content</code>&mdash;for tabs on the bottom.</p> <p>Swap the order of your HTML&mdash;placing <code>.tabs</code> after <code>.tab-content</code>&mdash;for tabs on the bottom.</p>
</div> </div>
--> -->
<div class="span4"> <div class="span4">
<h4>Tabs on the bottom</h4> <h4>Tabs on the bottom</h4>
<p>Flip the order of the HTML and add a class to put tabs on the bottom.</p> <p>Flip the order of the HTML and add a class to put tabs on the bottom.</p>
...@@ -1035,7 +1035,7 @@ ...@@ -1035,7 +1035,7 @@
</pre> </pre>
</div> </div>
</div><!-- /row --> </div><!-- /row -->
<br> <br>
<!-- Block messages --> <!-- Block messages -->
...@@ -1195,7 +1195,7 @@ ...@@ -1195,7 +1195,7 @@
<script src="../js/bootstrap-dropdown.js"></script> <script src="../js/bootstrap-dropdown.js"></script>
<script src="../js/bootstrap-tab.js"></script> <script src="../js/bootstrap-tab.js"></script>
<script src="../js/bootstrap-scrollspy.js"></script> <script src="../js/bootstrap-scrollspy.js"></script>
<script src="../js/bootstrap-twipsy.js"></script> <script src="../js/bootstrap-tooltip.js"></script>
<script src="assets/js/application.js"></script> <script src="assets/js/application.js"></script>
</body> </body>
</html> </html>
docs/javascript.html
View file @ 6f2f947a
This diff is collapsed.
docs/scaffolding.html
View file @ 6f2f947a
...@@ -399,15 +399,15 @@ ...@@ -399,15 +399,15 @@
</dl> </dl>
<dl class="span2"> <dl class="span2">
<dt>Javascript plugins</dt> <dt>Javascript plugins</dt>
<dd><a href="./javascript.html#transitions">Transitions</a></dd> <dd><a href="./javascript.html#transition">Transition</a></dd>
<dd><a href="./javascript.html#modals">Modals</a></dd> <dd><a href="./javascript.html#modal">Modal</a></dd>
<dd><a href="./javascript.html#dropdowns">Dropdowns</a></dd> <dd><a href="./javascript.html#dropdown">Dropdown</a></dd>
<dd><a href="./javascript.html#scrollspy">Scrollspy</a></dd> <dd><a href="./javascript.html#scrollspy">Scrollspy</a></dd>
<dd><a href="./javascript.html#tabs">Tabs</a></dd> <dd><a href="./javascript.html#tab">Tab</a></dd>
<dd><a href="./javascript.html#twipsy">Twipsy tooltips</a></dd> <dd><a href="./javascript.html#tooltip">Tooltip</a></dd>
<dd><a href="./javascript.html#popovers">Popovers</a></dd> <dd><a href="./javascript.html#popover">Popover</a></dd>
<dd><a href="./javascript.html#alerts">Alerts</a></dd> <dd><a href="./javascript.html#alerts">Alert</a></dd>
<dd><a href="./javascript.html#buttons">Buttons</a></dd> <dd><a href="./javascript.html#buttons">Button</a></dd>
<dd><a href="./javascript.html#collapse">Collapse</a></dd> <dd><a href="./javascript.html#collapse">Collapse</a></dd>
<dd><a href="./javascript.html#carousel">Carousel</a></dd> <dd><a href="./javascript.html#carousel">Carousel</a></dd>
<dd><a href="./javascript.html#typeahead">Typeahead</a></dd> <dd><a href="./javascript.html#typeahead">Typeahead</a></dd>
...@@ -433,7 +433,7 @@ ...@@ -433,7 +433,7 @@
<script src="http://code.jquery.com/jquery-1.7.min.js"></script> <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script src="assets/js/google-code-prettify/prettify.js"></script> <script src="assets/js/google-code-prettify/prettify.js"></script>
<script src="../js/bootstrap-transition.js"></script> <script src="../js/bootstrap-transition.js"></script>
<script src="../js/bootstrap-twipsy.js"></script> <script src="../js/bootstrap-tooltip.js"></script>
<script src="assets/js/application.js"></script> <script src="assets/js/application.js"></script>
</body> </body>
......
js/bootstrap-popover.js
View file @ 6f2f947a
...@@ -26,10 +26,10 @@ ...@@ -26,10 +26,10 @@
this.init('popover', element, options) this.init('popover', element, options)
} }
/* NOTE: POPOVER EXTENDS BOOTSTRAP-TWIPSY.js /* NOTE: POPOVER EXTENDS BOOTSTRAP-TOOLTIP.js
========================================= */ ========================================== */
Popover.prototype = $.extend({}, $.fn.twipsy.Constructor.prototype, { Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype, {
constructor: Popover constructor: Popover
...@@ -86,7 +86,7 @@ ...@@ -86,7 +86,7 @@
$.fn.popover.Constructor = Popover $.fn.popover.Constructor = Popover
$.fn.popover.defaults = $.extend({} , $.fn.twipsy.defaults, { $.fn.popover.defaults = $.extend({} , $.fn.tooltip.defaults, {
placement: 'right' placement: 'right'
, content: '' , content: ''
, template: '<div class="popover"><div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div></div>' , template: '<div class="popover"><div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div></div>'
......
js/bootstrap-twipsy.js → js/bootstrap-tooltip.js
View file @ 6f2f947a
/* ========================================================== /* ===========================================================
* bootstrap-twipsy.js v2.0.0 * bootstrap-tooltip.js v2.0.0
* http://twitter.github.com/bootstrap/javascript.html#twipsy * http://twitter.github.com/bootstrap/javascript.html#tooltip
* Inspired by the original jQuery.tipsy by Jason Frame * Inspired by the original jQuery.tipsy by Jason Frame
* ========================================================== * ===========================================================
* Copyright 2011 Twitter, Inc. * Copyright 2011 Twitter, Inc.
* *
* Licensed under the Apache License, Version 2.0 (the "License"); * Licensed under the Apache License, Version 2.0 (the "License");
...@@ -22,16 +22,16 @@ ...@@ -22,16 +22,16 @@
"use strict" "use strict"
/* TWIPSY PUBLIC CLASS DEFINITION /* TOOLTIP PUBLIC CLASS DEFINITION
* ============================== */ * =============================== */
var Twipsy = function ( element, options ) { var Tooltip = function ( element, options ) {
this.init('twipsy', element, options) this.init('tooltip', element, options)
} }
Twipsy.prototype = { Tooltip.prototype = {
constructor: Twipsy constructor: Tooltip
, init: function ( type, element, options ) { , init: function ( type, element, options ) {
var eventIn var eventIn
...@@ -154,7 +154,7 @@ ...@@ -154,7 +154,7 @@
, setContent: function () { , setContent: function () {
var $tip = this.tip() var $tip = this.tip()
$tip.find('.twipsy-inner').html(this.getTitle()) $tip.find('.tooltip-inner').html(this.getTitle())
$tip.removeClass('fade in top bottom left right') $tip.removeClass('fade in top bottom left right')
} }
...@@ -242,29 +242,29 @@ ...@@ -242,29 +242,29 @@
} }
/* TWIPSY PLUGIN DEFINITION /* TOOLTIP PLUGIN DEFINITION
* ======================== */ * ========================= */
$.fn.twipsy = function ( option ) { $.fn.tooltip = function ( option ) {
return this.each(function () { return this.each(function () {
var $this = $(this) var $this = $(this)
, data = $this.data('twipsy') , data = $this.data('tooltip')
, options = typeof option == 'object' && option , options = typeof option == 'object' && option
if (!data) $this.data('twipsy', (data = new Twipsy(this, options))) if (!data) $this.data('tooltip', (data = new Tooltip(this, options)))
if (typeof option == 'string') data[option]() if (typeof option == 'string') data[option]()
}) })
} }
$.fn.twipsy.Constructor = Twipsy $.fn.tooltip.Constructor = Tooltip
$.fn.twipsy.defaults = { $.fn.tooltip.defaults = {
animation: true animation: true
, delay: 0 , delay: 0
, selector: false , selector: false
, placement: 'top' , placement: 'top'
, trigger: 'hover' , trigger: 'hover'
, title: '' , title: ''
, template: '<div class="twipsy"><div class="twipsy-arrow"></div><div class="twipsy-inner"></div></div>' , template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
} }
}( window.jQuery ) }( window.jQuery )
\ No newline at end of file
js/bootstrap-typeahead.js
View file @ 6f2f947a
...@@ -156,11 +156,13 @@ ...@@ -156,11 +156,13 @@
break break
case 38: // up arrow case 38: // up arrow
if (!this.shown) return
e.preventDefault() e.preventDefault()
this.prev() this.prev()
break break
case 40: // down arrow case 40: // down arrow
if (!this.shown) return
e.preventDefault() e.preventDefault()
this.next() this.next()
break break
......
js/tests/index.html
View file @ 6f2f947a
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<script src="../../js/bootstrap-modal.js"></script> <script src="../../js/bootstrap-modal.js"></script>
<script src="../../js/bootstrap-scrollspy.js"></script> <script src="../../js/bootstrap-scrollspy.js"></script>
<script src="../../js/bootstrap-tab.js"></script> <script src="../../js/bootstrap-tab.js"></script>
<script src="../../js/bootstrap-twipsy.js"></script> <script src="../../js/bootstrap-tooltip.js"></script>
<script src="../../js/bootstrap-popover.js"></script> <script src="../../js/bootstrap-popover.js"></script>
<script src="../../js/bootstrap-typeahead.js"></script> <script src="../../js/bootstrap-typeahead.js"></script>
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
<script src="unit/bootstrap-modal.js"></script> <script src="unit/bootstrap-modal.js"></script>
<script src="unit/bootstrap-scrollspy.js"></script> <script src="unit/bootstrap-scrollspy.js"></script>
<script src="unit/bootstrap-tab.js"></script> <script src="unit/bootstrap-tab.js"></script>
<script src="unit/bootstrap-twipsy.js"></script> <script src="unit/bootstrap-tooltip.js"></script>
<script src="unit/bootstrap-popover.js"></script> <script src="unit/bootstrap-popover.js"></script>
<script src="unit/bootstrap-typeahead.js"></script> <script src="unit/bootstrap-typeahead.js"></script>
......
js/tests/unit/bootstrap-twipsy.js
View file @ 6f2f947a
$(function () { $(function () {
module("bootstrap-twipsy") module("bootstrap-tooltip")
test("should be defined on jquery object", function () { test("should be defined on jquery object", function () {
var div = $("<div></div>") var div = $("<div></div>")
ok(div.twipsy, 'popover method is defined') ok(div.tooltip, 'popover method is defined')
}) })
test("should return element", function () { test("should return element", function () {
var div = $("<div></div>") var div = $("<div></div>")
ok(div.twipsy() == div, 'document.body returned') ok(div.tooltip() == div, 'document.body returned')
}) })
test("should expose default settings", function () { test("should expose default settings", function () {
ok(!!$.fn.twipsy.defaults, 'defaults is defined') ok(!!$.fn.tooltip.defaults, 'defaults is defined')
}) })
test("should remove title attribute", function () { test("should remove title attribute", function () {
var twipsy = $('<a href="#" rel="twipsy" title="Another twipsy"></a>').twipsy() var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
ok(!twipsy.attr('title'), 'title tag was removed') ok(!tooltip.attr('title'), 'title tag was removed')
}) })
test("should add data attribute for referencing original title", function () { test("should add data attribute for referencing original title", function () {
var twipsy = $('<a href="#" rel="twipsy" title="Another twipsy"></a>').twipsy() var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
equals(twipsy.attr('data-original-title'), 'Another twipsy', 'original title preserved in data attribute') equals(tooltip.attr('data-original-title'), 'Another tooltip', 'original title preserved in data attribute')
}) })
test("should place tooltips relative to placement option", function () { test("should place tooltips relative to placement option", function () {
$.support.transition = false $.support.transition = false
var twipsy = $('<a href="#" rel="twipsy" title="Another twipsy"></a>') var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.twipsy({placement: 'bottom'}) .tooltip({placement: 'bottom'})
.twipsy('show') .tooltip('show')
ok($(".twipsy").hasClass('fade bottom in'), 'has correct classes applied') ok($(".tooltip").hasClass('fade bottom in'), 'has correct classes applied')
twipsy.twipsy('hide') tooltip.tooltip('hide')
}) })
test("should always allow html entities", function () { test("should always allow html entities", function () {
$.support.transition = false $.support.transition = false
var twipsy = $('<a href="#" rel="twipsy" title="<b>@fat</b>"></a>') var tooltip = $('<a href="#" rel="tooltip" title="<b>@fat</b>"></a>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.twipsy('show') .tooltip('show')
ok($('.twipsy b').length, 'b tag was inserted') ok($('.tooltip b').length, 'b tag was inserted')
twipsy.twipsy('hide') tooltip.tooltip('hide')
ok(!$(".twipsy").length, 'twipsy removed') ok(!$(".tooltip").length, 'tooltip removed')
}) })
test("should respect custom classes", function () { test("should respect custom classes", function () {
var twipsy = $('<a href="#" rel="twipsy" title="Another twipsy"></a>') var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.twipsy({ template: '<div class="twipsy some-class"><div class="twipsy-arrow"/><div class="twipsy-inner"/></div>'}) .tooltip({ template: '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>'})
.twipsy('show') .tooltip('show')
ok($('.twipsy').hasClass('some-class'), 'custom class is present') ok($('.tooltip').hasClass('some-class'), 'custom class is present')
twipsy.twipsy('hide') tooltip.tooltip('hide')
ok(!$(".twipsy").length, 'twipsy removed') ok(!$(".tooltip").length, 'tooltip removed')
}) })
}) })
\ No newline at end of file
lib/bootstrap.less
View file @ 6f2f947a
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
// Components: Popovers // Components: Popovers
@import "modals.less"; @import "modals.less";
@import "twipsy.less"; @import "tooltip.less";
@import "popovers.less"; @import "popovers.less";
// Components: Buttons & Alerts // Components: Buttons & Alerts
......
lib/button-groups.less
View file @ 6f2f947a
...@@ -90,6 +90,7 @@ ...@@ -90,6 +90,7 @@
display: block; display: block;
top: 30px; top: 30px;
.border-radius(5px); .border-radius(5px);
&.large { top: 40px; }
} }
.btn-group.open .dropdown-toggle { .btn-group.open .dropdown-toggle {
background-image: none; background-image: none;
......
lib/twipsy.less → lib/tooltip.less
View file @ 6f2f947a
// TWIPSY // TOOLTIP
// ------ // ------=
.twipsy { .tooltip {
position: absolute; position: absolute;
z-index: @zindexTwipsy; z-index: @zindexTooltip;
display: block; display: block;
visibility: visible; visibility: visible;
padding: 5px; padding: 5px;
...@@ -14,12 +14,12 @@ ...@@ -14,12 +14,12 @@
&.right { margin-left: 2px; } &.right { margin-left: 2px; }
&.bottom { margin-top: 2px; } &.bottom { margin-top: 2px; }
&.left { margin-left: -2px; } &.left { margin-left: -2px; }
&.top .twipsy-arrow { #popoverArrow > .top(); } &.top .tooltip-arrow { #popoverArrow > .top(); }
&.left .twipsy-arrow { #popoverArrow > .left(); } &.left .tooltip-arrow { #popoverArrow > .left(); }
&.bottom .twipsy-arrow { #popoverArrow > .bottom(); } &.bottom .tooltip-arrow { #popoverArrow > .bottom(); }
&.right .twipsy-arrow { #popoverArrow > .right(); } &.right .tooltip-arrow { #popoverArrow > .right(); }
} }
.twipsy-inner { .tooltip-inner {
max-width: 200px; max-width: 200px;
padding: 3px 8px; padding: 3px 8px;
color: white; color: white;
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
background-color: @black; background-color: @black;
.border-radius(4px); .border-radius(4px);
} }
.twipsy-arrow { .tooltip-arrow {
position: absolute; position: absolute;
width: 0; width: 0;
height: 0; height: 0;
......
lib/variables.less
View file @ 6f2f947a
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
@zindexDropdown: 1000; @zindexDropdown: 1000;
@zindexPopover: 1010; @zindexPopover: 1010;
@zindexTwipsy: 1020; @zindexTooltip: 1020;
@zindexFixedNavbar: 1030; @zindexFixedNavbar: 1030;
@zindexModalBackdrop: 1040; @zindexModalBackdrop: 1040;
@zindexModal: 1050; @zindexModal: 1050;
......
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