Skip to content

B
bootstrap
Commit 35fdbad2 authored by Jacob Thornton's avatar Jacob Thornton
Browse files
Options

Merge branch '2.0-wip' of https://github.com/twitter/bootstrap into 2.0-wip 

Conflicts:
	bootstrap.css
	docs/assets/js/application.js
	docs/base-css.html
	docs/components.html
	docs/index.html
	docs/javascript.html
	docs/less.html
	docs/scaffolding.html
	docs/upgrading.html
parents 87ac8182 9fb38015
Show whitespace changes
Inline Side-by-side
Showing with 471 additions and 93 deletions
bootstrap.css
View file @ 35fdbad2
......@@ -6,7 +6,11 @@
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world @twitter by @mdo and @fat.
<<<<<<< HEAD
* Date: Thu Dec 22 19:09:49 PST 2011
=======
* Date: Wed Dec 21 18:38:56 CST 2011
>>>>>>> 9fb380151d477f1741b7609ade7a9e7fd5450b2c
*/
html, body {
margin: 0;
......@@ -919,6 +923,9 @@ textarea[readonly] {
.inline-inputs span {
padding: 0 2px 0 1px;
}
.input-prepend, .input-append {
overflow: hidden;
}
.input-prepend input, .input-append input {
-webkit-border-radius: 0 3px 3px 0;
-moz-border-radius: 0 3px 3px 0;
......@@ -1534,7 +1541,6 @@ footer {
.alert-message.danger,
.btn.error,
.alert-message.error {
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #c43c35;
background-image: -khtml-gradient(linear, left top, left bottom, from(#ee5f5b), to(#c43c35));
background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
......@@ -1549,7 +1555,6 @@ footer {
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}
.btn.success, .alert-message.success {
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #57a957;
background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
background-image: -moz-linear-gradient(top, #62c462, #57a957);
......@@ -1564,7 +1569,6 @@ footer {
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}
.btn.info, .alert-message.info {
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #339bb9;
background-image: -khtml-gradient(linear, left top, left bottom, from(#5bc0de), to(#339bb9));
background-image: -moz-linear-gradient(top, #5bc0de, #339bb9);
......@@ -1610,7 +1614,7 @@ footer {
transition: 0.1s linear all;
}
.btn:hover {
color: #333;
color: #404040;
text-decoration: none;
background-position: 0 -15px;
}
......@@ -1759,7 +1763,6 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
margin-bottom: 18px;
color: #404040;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
background-color: #eedc94;
background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));
background-image: -moz-linear-gradient(top, #fceec1, #eedc94);
......@@ -1802,6 +1805,9 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}
.alert-message.error, .alert-message.success, .alert-message.info {
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.alert-message.block-message {
padding: 14px;
background-image: none;
......@@ -1905,6 +1911,104 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
.label.notice {
background-color: #62cffc;
}
.dropdown {
position: relative;
}
.dropdown-toggle: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=30);
-moz-opacity: 0.3;
opacity: 0.3;
content: "&darr;";
}
.dropdown:hover .dropdown-toggle:after {
filter: alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}
.dropdown-menu {
position: absolute;
top: 40px;
z-index: 900;
float: left;
display: none;
min-width: 160px;
max-width: 220px;
_width: 160px;
padding: 6px 0;
margin-left: 0;
margin-right: 0;
background-color: #ffffff;
border-color: #999;
border-color: rgba(0, 0, 0, 0.2);
border-style: solid;
border-width: 0 1px 1px;
-webkit-border-radius: 0 0 6px 6px;
-moz-border-radius: 0 0 6px 6px;
border-radius: 0 0 6px 6px;
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding-box;
background-clip: padding-box;
zoom: 1;
}
.dropdown-menu li {
float: none;
display: block;
background-color: none;
}
.dropdown-menu .divider {
height: 1px;
margin: 5px 0;
overflow: hidden;
background-color: #eee;
border-bottom: 1px solid #ffffff;
}
.topbar .dropdown-menu a, .dropdown-menu a {
display: block;
padding: 4px 15px;
clear: both;
font-weight: normal;
line-height: 18px;
color: #808080;
text-shadow: 0 1px 0 #ffffff;
}
.topbar .dropdown-menu a:hover, .dropdown-menu a:hover {
color: #404040;
text-decoration: none;
background-color: #dddddd;
background-image: -khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));
background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
background-image: -ms-linear-gradient(top, #eeeeee, #dddddd);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));
background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
background-image: linear-gradient(top, #eeeeee, #dddddd);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);
-webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
-moz-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
}
.dropdown.open .dropdown-toggle {
color: #ffffff;
background: #ccc;
background: rgba(0, 0, 0, 0.3);
}
.dropdown.open .dropdown-menu {
display: block;
}
.tabs, .pills {
padding: 0;
margin: 0 0 20px;
......@@ -2539,6 +2643,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
}
.thumbnail {
display: block;
padding: 4px;
line-height: 1;
border: 1px solid #ddd;
-webkit-border-radius: 4px;
......@@ -2556,7 +2661,7 @@ a.thumbnail:hover {
}
.thumbnail > img {
display: block;
margin: 4px;
max-width: 100%;
}
.thumbnail .caption {
padding: 9px;
......
bootstrap.min.css
View file @ 35fdbad2
......@@ -150,7 +150,7 @@ input[disabled],select[disabled],textarea[disabled],input[readonly],select[reado
.inline-inputs input.mini{width:60px;}
.inline-inputs input.small{width:90px;}
.inline-inputs span{padding:0 2px 0 1px;}
.input-prepend input,.input-append input{-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;}
.input-prepend,.input-append{overflow:hidden;}.input-prepend input,.input-append input{-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;}
.input-prepend .add-on,.input-append .add-on{position:relative;z-index:2;float:left;display:block;width:auto;min-width:16px;height:18px;margin-right:-1px;padding:4px 4px 4px 5px;font-weight:normal;line-height:18px;color:#bfbfbf;text-align:center;text-shadow:0 1px 0 #ffffff;background-color:#f5f5f5;border:1px solid #ccc;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;}
.input-prepend .active,.input-append .active{background-color:#a9dba9;border-color:#46a546;}
.input-prepend .add-on{*margin-top:1px;}
......@@ -212,10 +212,10 @@ tbody tr:last-child th,tbody tr:last-child td{border-bottom:0;}
footer{padding-top:17px;margin-top:17px;border-top:1px solid #eee;}
.page-header{margin-bottom:27px;border-bottom:1px solid #eee;-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, 0.5);-moz-box-shadow:0 1px 0 rgba(255, 255, 255, 0.5);box-shadow:0 1px 0 rgba(255, 255, 255, 0.5);}.page-header h1{margin-bottom:13.5px;}
.btn.danger,.alert-message.danger,.btn.danger:hover,.alert-message.danger:hover,.btn.error,.alert-message.error,.btn.error:hover,.alert-message.error:hover,.btn.success,.alert-message.success,.btn.success:hover,.alert-message.success:hover,.btn.info,.alert-message.info,.btn.info:hover,.alert-message.info:hover{color:#ffffff;}
.btn.danger,.alert-message.danger,.btn.error,.alert-message.error{text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);background-color:#c43c35;background-image:-khtml-gradient(linear, left top, left bottom, from(#ee5f5b), to(#c43c35));background-image:-moz-linear-gradient(top, #ee5f5b, #c43c35);background-image:-ms-linear-gradient(top, #ee5f5b, #c43c35);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee5f5b), color-stop(100%, #c43c35));background-image:-webkit-linear-gradient(top, #ee5f5b, #c43c35);background-image:-o-linear-gradient(top, #ee5f5b, #c43c35);background-image:linear-gradient(top, #ee5f5b, #c43c35);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);border-color:#c43c35 #c43c35 #882a25;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn.success,.alert-message.success{text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);background-color:#57a957;background-image:-khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));background-image:-moz-linear-gradient(top, #62c462, #57a957);background-image:-ms-linear-gradient(top, #62c462, #57a957);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));background-image:-webkit-linear-gradient(top, #62c462, #57a957);background-image:-o-linear-gradient(top, #62c462, #57a957);background-image:linear-gradient(top, #62c462, #57a957);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);border-color:#57a957 #57a957 #3d773d;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn.info,.alert-message.info{text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);background-color:#339bb9;background-image:-khtml-gradient(linear, left top, left bottom, from(#5bc0de), to(#339bb9));background-image:-moz-linear-gradient(top, #5bc0de, #339bb9);background-image:-ms-linear-gradient(top, #5bc0de, #339bb9);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #5bc0de), color-stop(100%, #339bb9));background-image:-webkit-linear-gradient(top, #5bc0de, #339bb9);background-image:-o-linear-gradient(top, #5bc0de, #339bb9);background-image:linear-gradient(top, #5bc0de, #339bb9);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#339bb9', GradientType=0);border-color:#339bb9 #339bb9 #22697d;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn{display:inline-block;padding:5px 14px 6px;font-size:13px;line-height:normal;color:#333;text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);background-color:#e6e6e6;background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));background-image:-webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:-moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);background-image:-ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:-o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-repeat:no-repeat;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);border:1px solid #ccc;border-bottom-color:#bbb;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);cursor:pointer;-webkit-transition:0.1s linear all;-moz-transition:0.1s linear all;-ms-transition:0.1s linear all;-o-transition:0.1s linear all;transition:0.1s linear all;}.btn:hover{color:#333;text-decoration:none;background-position:0 -15px;}
.btn.danger,.alert-message.danger,.btn.error,.alert-message.error{background-color:#c43c35;background-image:-khtml-gradient(linear, left top, left bottom, from(#ee5f5b), to(#c43c35));background-image:-moz-linear-gradient(top, #ee5f5b, #c43c35);background-image:-ms-linear-gradient(top, #ee5f5b, #c43c35);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee5f5b), color-stop(100%, #c43c35));background-image:-webkit-linear-gradient(top, #ee5f5b, #c43c35);background-image:-o-linear-gradient(top, #ee5f5b, #c43c35);background-image:linear-gradient(top, #ee5f5b, #c43c35);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);border-color:#c43c35 #c43c35 #882a25;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn.success,.alert-message.success{background-color:#57a957;background-image:-khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));background-image:-moz-linear-gradient(top, #62c462, #57a957);background-image:-ms-linear-gradient(top, #62c462, #57a957);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));background-image:-webkit-linear-gradient(top, #62c462, #57a957);background-image:-o-linear-gradient(top, #62c462, #57a957);background-image:linear-gradient(top, #62c462, #57a957);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);border-color:#57a957 #57a957 #3d773d;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn.info,.alert-message.info{background-color:#339bb9;background-image:-khtml-gradient(linear, left top, left bottom, from(#5bc0de), to(#339bb9));background-image:-moz-linear-gradient(top, #5bc0de, #339bb9);background-image:-ms-linear-gradient(top, #5bc0de, #339bb9);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #5bc0de), color-stop(100%, #339bb9));background-image:-webkit-linear-gradient(top, #5bc0de, #339bb9);background-image:-o-linear-gradient(top, #5bc0de, #339bb9);background-image:linear-gradient(top, #5bc0de, #339bb9);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#339bb9', GradientType=0);border-color:#339bb9 #339bb9 #22697d;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn{display:inline-block;padding:5px 14px 6px;font-size:13px;line-height:normal;color:#333;text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);background-color:#e6e6e6;background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));background-image:-webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:-moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);background-image:-ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:-o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-repeat:no-repeat;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);border:1px solid #ccc;border-bottom-color:#bbb;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);cursor:pointer;-webkit-transition:0.1s linear all;-moz-transition:0.1s linear all;-ms-transition:0.1s linear all;-o-transition:0.1s linear all;transition:0.1s linear all;}.btn:hover{color:#404040;text-decoration:none;background-position:0 -15px;}
.btn:focus{outline:1px dotted #666;}
.btn.primary{color:#ffffff;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);background-color:#0064cd;background-image:-khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd));background-image:-moz-linear-gradient(top, #049cdb, #0064cd);background-image:-ms-linear-gradient(top, #049cdb, #0064cd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd));background-image:-webkit-linear-gradient(top, #049cdb, #0064cd);background-image:-o-linear-gradient(top, #049cdb, #0064cd);background-image:linear-gradient(top, #049cdb, #0064cd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0);border-color:#0064cd #0064cd #003f81;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);}
.btn.active,.btn:active{-webkit-box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.25),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.25),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.25),0 1px 2px rgba(0, 0, 0, 0.05);}
......@@ -234,11 +234,12 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
.btn-group .btn:last-child{-webkit-border-top-right-radius:4px;-moz-border-radius-topright:4px;border-top-right-radius:4px;-webkit-border-bottom-right-radius:4px;-moz-border-radius-bottomright:4px;border-bottom-right-radius:4px;}
.btn-group .btn:hover,.btn-group .btn:focus,.btn-group .btn:active{z-index:2;}
.close{float:right;font-size:20px;font-weight:bold;line-height:13.5px;color:#000000;text-shadow:0 1px 0 #ffffff;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;}.close:hover{color:#000000;text-decoration:none;filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;}
.alert-message{position:relative;padding:7px 15px;margin-bottom:18px;color:#404040;text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);background-color:#eedc94;background-image:-khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));background-image:-moz-linear-gradient(top, #fceec1, #eedc94);background-image:-ms-linear-gradient(top, #fceec1, #eedc94);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));background-image:-webkit-linear-gradient(top, #fceec1, #eedc94);background-image:-o-linear-gradient(top, #fceec1, #eedc94);background-image:linear-gradient(top, #fceec1, #eedc94);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);border-color:#eedc94 #eedc94 #e4c652;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);border-width:1px;border-style:solid;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);}.alert-message .close{*margin-top:3px;}
.alert-message{position:relative;padding:7px 15px;margin-bottom:18px;color:#404040;text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);background-color:#eedc94;background-image:-khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));background-image:-moz-linear-gradient(top, #fceec1, #eedc94);background-image:-ms-linear-gradient(top, #fceec1, #eedc94);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));background-image:-webkit-linear-gradient(top, #fceec1, #eedc94);background-image:-o-linear-gradient(top, #fceec1, #eedc94);background-image:linear-gradient(top, #fceec1, #eedc94);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);border-color:#eedc94 #eedc94 #e4c652;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);border-width:1px;border-style:solid;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);}.alert-message .close{*margin-top:3px;}
.alert-message h5{line-height:18px;}
.alert-message p{margin-bottom:0;}
.alert-message div{margin-top:5px;margin-bottom:2px;line-height:28px;}
.alert-message .btn{-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, 0.25);-moz-box-shadow:0 1px 0 rgba(255, 255, 255, 0.25);box-shadow:0 1px 0 rgba(255, 255, 255, 0.25);}
.alert-message.error,.alert-message.success,.alert-message.info{text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);}
.alert-message.block-message{padding:14px;background-image:none;background-color:#fdf5d9;filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);border-color:#fceec1;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}.alert-message.block-message ul,.alert-message.block-message p{margin-right:30px;}
.alert-message.block-message ul{margin-bottom:0;}
.alert-message.block-message li{color:#404040;}
......@@ -254,6 +255,14 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
.label.warning{background-color:#f89406;}
.label.success{background-color:#46a546;}
.label.notice{background-color:#62cffc;}
.dropdown{position:relative;}
.dropdown-toggle: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=30);-moz-opacity:0.3;opacity:0.3;content:"&darr;";}
.dropdown:hover .dropdown-toggle:after{filter:alpha(opacity=100);-moz-opacity:1;opacity:1;}
.dropdown-menu{position:absolute;top:40px;z-index:900;float:left;display:none;min-width:160px;max-width:220px;_width:160px;padding:6px 0;margin-left:0;margin-right:0;background-color:#ffffff;border-color:#999;border-color:rgba(0, 0, 0, 0.2);border-style:solid;border-width:0 1px 1px;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;zoom:1;}.dropdown-menu li{float:none;display:block;background-color:none;}
.dropdown-menu .divider{height:1px;margin:5px 0;overflow:hidden;background-color:#eee;border-bottom:1px solid #ffffff;}
.topbar .dropdown-menu a,.dropdown-menu a{display:block;padding:4px 15px;clear:both;font-weight:normal;line-height:18px;color:#808080;text-shadow:0 1px 0 #ffffff;}.topbar .dropdown-menu a:hover,.dropdown-menu a:hover{color:#404040;text-decoration:none;background-color:#dddddd;background-image:-khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));background-image:-moz-linear-gradient(top, #eeeeee, #dddddd);background-image:-ms-linear-gradient(top, #eeeeee, #dddddd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));background-image:-webkit-linear-gradient(top, #eeeeee, #dddddd);background-image:-o-linear-gradient(top, #eeeeee, #dddddd);background-image:linear-gradient(top, #eeeeee, #dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);}
.dropdown.open .dropdown-toggle{color:#ffffff;background:#ccc;background:rgba(0, 0, 0, 0.3);}
.dropdown.open .dropdown-menu{display:block;}
.tabs,.pills{padding:0;margin:0 0 20px;list-style:none;zoom:1;}.tabs:before,.pills:before,.tabs:after,.pills:after{display:table;*display:inline;content:"";zoom:1;}
.tabs:after,.pills:after{clear:both;}
.tabs>li,.pills>li{float:left;}.tabs>li>a,.pills>li>a{display:block;}
......@@ -337,9 +346,9 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
.thumbnails{margin-left:-20px;margin-bottom:0;list-style:none;zoom:1;}.thumbnails:before,.thumbnails:after{display:table;*display:inline;content:"";zoom:1;}
.thumbnails:after{clear:both;}
.thumbnails>li{float:left;margin:0 0 20px 20px;}
.thumbnail{display:block;line-height:1;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);}
.thumbnail{display:block;padding:4px;line-height:1;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);}
a.thumbnail:hover{border-color:#0069d6;-webkit-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);-moz-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);}
.thumbnail>img{display:block;margin:4px;}
.thumbnail>img{display:block;max-width:100%;}
.thumbnail .caption{padding:9px;}
.hidden{display:none;visibility:hidden;}
@media (max-width: 480px){.modal{width:auto;margin:0;} .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;}}@media (max-width: 768px){.container{width:auto;padding:0 20px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;} .nav{position:absolute;top:0;left:0;width:180px;padding-top:40px;list-style:none;} .nav,.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;} .nav>li{float:none;display:none;} .nav>li>a{float:none;background-color:#222;} .nav>.active{display:block;position:absolute;top:0;left:0;} .navbar ul .active>a{background-color:transparent;} .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:"&darr;";} .nav>.active a:hover{background-color:rgba(255, 255, 255, 0.05);}}@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 @ 35fdbad2
......@@ -315,7 +315,12 @@ h2 + table {
/* Example sites showcase */
.example-sites img {
width: 290px;
max-width: 290px;
}
.built-with {
margin: -18px 0 27px;
color: #999;
text-align: center;
}
.scrollspy-example {
......@@ -382,12 +387,15 @@ h2 + table {
.example-sites {
margin-left: 0;
}
.example-sites a {
.example-sites > li {
float: none;
display: block;
max-width: 300px;
margin: 0 auto 18px;
}
.example-sites img {
max-width: 270px;
}
table code {
white-space: normal;
......
docs/assets/js/application.js
View file @ 35fdbad2
......@@ -4,6 +4,18 @@ $(function(){
// IT'S ALL JUST JUNK FOR OUR DOCS!
// ++++++++++++++++++++++++++++++++++++++++++
// Hide the Mobile Safari address bar once loaded
// ==============================================
// Set a timeout...
setTimeout(function(){
// Hide the address bar!
window.scrollTo(0, 1);
}, 0);
// table sort example
// ==================
// make code pretty
prettyPrint && prettyPrint()
......
docs/base-css.html
View file @ 35fdbad2
......@@ -762,6 +762,43 @@
<h1>Forms</h1>
</div>
<!--
Types of forms
default (stacked)
horizontal (change the class)
search
inline
Form elements
form
fieldset
legend
label
input
text (password, email, etc)
radio
checkbox
textarea
rows
select
single
multiple
size
Custom form elements
Input prepend and append (for @ and $)
checkbox and radio lists
Explaining the default Bootstrap form structure
Bulletproofing our forms means adding a bit of extra structure and providing more classes for customization and event handling
Form vertical and horizontal forms, we require a wrapping element.
we suggest a fieldset
but could be anthing so long as it uses the proper class
Form states
warning
error
success
-->
<h2>Four types of forms</h2>
<table class="bordered-table striped-table">
<thead>
......@@ -842,7 +879,7 @@
</div>
<div class="span9">
<form class="horizontal-form">
<legend>Example form</legend>
<legend>Example form section</legend>
<fieldset class="control-group">
<label class="control-label" for="input01">Text input</label>
<div class="controls">
......@@ -850,6 +887,16 @@
<p class="help-text">Help text here. Be sure to fill this out like so, or else!</p>
</div>
</fieldset>
<fieldset class="control-group">
<label class="control-label" for="prependedInput">Prepended text</label>
<div class="controls">
<div class="input-prepend">
<span class="add-on">@</span>
<input class="input-small" id="prependedInput" name="prependedInput" size="16" type="text">
</div>
<span class="help-block">Here's some help text</span>
</div>
</fieldset>
<fieldset class="control-group">
<label class="control-label" for="select01">Select list</label>
<div class="controls">
......@@ -874,23 +921,44 @@
</select>
</div>
</fieldset>
<legend>Example form</legend>
<legend>Example form section</legend>
<fieldset class="control-group">
<label class="control-label" for="textarea">Textarea</label>
<div class="controls">
<textarea class="input-xlarge" name="textarea" id="textarea" rows="3"></textarea>
</div>
</fieldset>
<fieldset class="control-group">
<label class="control-label" for="fileInput">Disabled input</label>
<div class="controls">
<input class="input-xlarge disabled" id="disabledInput" name="disabledInput" size="30" type="text" placeholder="Disabled input here... carry on." disabled>
</div>
</fieldset>
<fieldset class="control-group">
<label class="control-label" for="fileInput">File input</label>
<div class="controls">
<input class="input-file" id="fileInput" name="fileInput" type="file">
</div>
</fieldset>
<fieldset class="control-group has-error">
<fieldset class="control-group warning">
<label class="control-label" for="inputError">Input with warning</label>
<div class="controls">
<input type="text" name="inputError">
<span class="help-inline">Something may have gone wrong</span>
</div>
</fieldset>
<fieldset class="control-group error">
<label class="control-label" for="inputError">Input with error</label>
<div class="controls">
<input type="text" name="inputError">
<span class="help-inline">Please correct the error</span>
</div>
</fieldset>
<fieldset class="control-group has-error">
<label class="control-label" for="textareaError">Textarea with error</label>
<fieldset class="control-group success">
<label class="control-label" for="inputError">Input with success</label>
<div class="controls">
<textarea class="input-xlarge" rows="3"></textarea>
<input type="text" name="inputError">
<span class="help-inline">Woohoo!</span>
</div>
</fieldset>
<fieldset class="control-group">
......@@ -1110,8 +1178,7 @@
<!-- Le javascript -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
<script src="../js/tests/vendor/jquery.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>$(function () { prettyPrint() })</script>
<script src="assets/js/application.js"></script>
......
docs/components.html
View file @ 35fdbad2
......@@ -22,6 +22,18 @@
<link rel="apple-touch-icon" href="assets/ico/bootstrap-apple-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/ico/bootstrap-apple-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/ico/bootstrap-apple-114x114.png">
<!-- Le javascript -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script src="http://autobahn.tablesorter.com/jquery.tablesorter.min.js"></script>
<script src="assets/js/google-code-prettify/prettify.js"></script>
<script>$(function () { prettyPrint() })</script>
<script src="../js/bootstrap-transitions.js"></script>
<script src="../js/bootstrap-dropdown.js"></script>
<script src="../js/bootstrap-twipsy.js"></script>
<script src="../js/bootstrap-scrollspy.js"></script>
<script src="assets/js/application.js"></script>
</head>
<body>
......@@ -201,11 +213,33 @@
<!-- Navigation
<!-- Autocomplete
================================================== -->
<section id="autocomplete">
<div class="page-header">
<h1>Autocomplete <small></small></h1>
</div>
</section>
<!-- Carousel
================================================== -->
<section id="navigation">
<section id="carousel">
<div class="page-header">
<h1>Navigation</h1>
<h1>Carousel <small></small></h1>
</div>
</section>
<!-- Navbar
================================================== -->
<section id="navbar">
<div class="page-header">
<h1>Navbar</h1>
</div>
<h2>Fixed navbar</h2>
<div class="navbar navbar-static" >
......@@ -262,11 +296,19 @@
</div>
<p><strong>Note:</strong> When using the navbar on any page, be sure to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>&lt;body&gt;</code>.</p>
<br>
</section>
<!-- Tabs & Pills
================================================== -->
<section id="tabsAndPills">
<div class="page-header">
<h1>Tabs and pills <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Tabs and pills</h2>
<p>Create simple secondary navigation with a <code>&lt;ul&gt;</code>. Swap between tabs or pills by adding the appropriate class.</p>
<p>Great for sub-sections of content like our account settings pages and user timelines for toggling between pages of like content. Available in tabbed or pill styles.</p>
</div>
......@@ -428,10 +470,19 @@
</div>
</div><!-- /row -->
<!-- Breadcrumbs -->
</section>
<!-- Breadcrumbs
================================================== -->
<section id="breadcrumbs">
<div class="page-header">
<h1>Breadcrumbs <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Breadcrumbs</h2>
<p>Breadcrumb navigation is used as a way to show users where they are within an app or a site, but not for primary navigation.</p>
</div>
<div class="span9">
......@@ -464,10 +515,20 @@
</div>
</div>
</section>
<!-- Step nav
================================================== -->
<section id="stepNav">
<div class="page-header">
<h1>Step nav <small></small></h1>
</div>
<!-- Step nav -->
<div class="row">
<div class="span3">
<h2>Step nav</h2>
<p>Placeholder for now!</p>
</div>
<div class="span9">
......@@ -486,7 +547,17 @@
</div>
</div>
<!-- Pagination -->
</section>
<!-- Pagination
================================================== -->
<section id="carousel">
<div class="page-header">
<h1>Pagination <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Pagination</h2>
......@@ -644,11 +715,11 @@
</section>
<!-- Popovers
<!-- Modals
================================================== -->
<section id="popovers">
<div class="page-header">
<h1>Popovers <small>Components for displaying content in modals, tooltips, and popovers</small></h1>
<h1>Modals <small></small></h1>
</div>
<div class="row">
<div class="span3">
......@@ -676,7 +747,17 @@
</div>
</div><!-- /row -->
<!-- Tooltips -->
</section>
<!-- Twipsies
================================================== -->
<section id="carousel">
<div class="page-header">
<h1>Twipsy tooltips <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Tooltips</h2>
......@@ -694,7 +775,17 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
</div>
</div><!-- /row -->
<!-- Popovers -->
</section>
<!-- Popovers
================================================== -->
<section id="popovers">
<div class="page-header">
<h1>Popovers <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Popovers</h2>
......@@ -721,6 +812,8 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
</section>
<!-- Footer
================================================== -->
<footer class="footer">
......@@ -730,19 +823,5 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
<p>Icons from <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>
</footer>
</div><!-- /container -->
<!-- Le javascript -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
<script src="../js/tests/vendor/jquery.js"></script>
<script src="assets/js/google-code-prettify/prettify.js"></script>
<script src="../js/bootstrap-transition.js"></script>
<script src="../js/bootstrap-twipsy.js"></script>
<script src="../js/bootstrap-dropdown.js"></script>
<script src="../js/bootstrap-tab.js"></script>
<script src="assets/js/application.js"></script>
</body>
</html>
docs/index.html
View file @ 35fdbad2
......@@ -107,39 +107,23 @@
<div class="marketing">
<h1>Built with Bootstrap</h1>
<ul class="media-grid example-sites">
<li>
<a href="http://kippt.com/" target="_blank">
<p class="built-with">For even more sites built with Bootstrap, <a href="http://builtwithbootstrap.tumblr.com/" target="_blank">visit the unofficial Tumblr</a>.</p>
<ul class="thumbnails example-sites">
<li class="span4">
<a class="thumbnail" href="http://kippt.com/" target="_blank">
<img src="assets/img/example-sites/kippt.png" alt="Kippt">
</a>
</li>
<li>
<a href="http://www.fleetio.com/" target="_blank">
<li class="span4">
<a class="thumbnail" href="http://www.fleetio.com/" target="_blank">
<img src="assets/img/example-sites/fleetio.png" alt="Fleetio">
</a>
</li>
<li>
<a href="http://www.jshint.com/" target="_blank">
<li class="span4">
<a class="thumbnail" href="http://www.jshint.com/" target="_blank">
<img src="assets/img/example-sites/jshint.png" alt="JS Hint">
</a>
</li>
<!--
<li>
<a href="http://bartop.co/" target="_blank">
<img src="assets/img/example-sites/bartop.png" alt="Bartop.co">
</a>
</li>
<li>
<a href="http://railwayjs.com/" target="_blank">
<img src="assets/img/example-sites/railwayjs.png" alt="RailwayJS">
</a>
</li>
<li>
<a href="http://www.totalwireframe.com/" target="_blank">
<img src="assets/img/example-sites/totalwireframe.png" alt="Total Wireframe">
</a>
</li>
-->
</ul>
<h1>Designed for everyone, everywhere</h1>
......@@ -234,5 +218,7 @@
<!-- Le javascript -->
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<script src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script src="assets/js/application.js"></script>
</body>
</html>
docs/javascript.html
View file @ 35fdbad2
......@@ -102,7 +102,7 @@
</tr>
<tr>
<td><a href="./javascript.html#popover">bootstrap-popover.js</a></td>
<td>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">boostrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</td>
<td>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">bootstrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</td>
</tr>
</tr>
<tr>
......@@ -260,7 +260,7 @@ $('#myModal').on('hidden', function () {
<a href="../js/bootstrap-dropdown.js" target="_blank" class="btn primary">Download</a>
</div>
<div class="span9 columns">
<h3>Using boostrap-dropdown.js</h3>
<h3>Using bootstrap-dropdown.js</h3>
<pre class="prettyprint linenums">$('.dropdown-toggle').dropdown()</pre>
<h3>Markup</h3>
<p>To quickly add dropdown functionality to any element just add <code>data-toggle="dropdown"</code> and any valid bootstrap dropdown will automatically be activated.</p>
......@@ -336,7 +336,7 @@ $('#myModal').on('hidden', function () {
<a href="../js/bootstrap-scrollspy.js" target="_blank" class="btn primary">Download</a>
</div>
<div class="span9 columns">
<h2>Using boostrap-scrollspy.js</h2>
<h2>Using bootstrap-scrollspy.js</h2>
<pre class="prettyprint linenums">$('#navbar').dropdown()</pre>
<h3>Markup</h3>
<p>To easily add scrollspy behavior to your topbar navigation, just add <code>data-spy="scroll"</code> to the element you want to spy on (most typically this would be the body).
......@@ -410,7 +410,7 @@ $('#myModal').on('hidden', function () {
<a href="../js/bootstrap-tab.js" target="_blank" class="btn primary">Download</a>
</div>
<div class="span9 columns">
<h3>Using boostrap-tab.js</h3>
<h3>Using bootstrap-tab.js</h3>
<pre class="prettyprint linenums">$('#myTab').tab('show')</pre>
<h3>Markup</h3>
<p>You can activate a tab or pill navigation without writing any javascript by simply specifying <code>data-toggle="tab"</code> or <code>data-toggle="pill"</code> on an element.</p>
......@@ -608,11 +608,11 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
</div>
<div class="row">
<div class="span3 columns">
<p>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">boostrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</p>
<p>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">bootstrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</p>
<a href="../js/bootstrap-popover.js" target="_blank" class="btn primary">Download</a>
</div>
<div class="span9 columns">
<h3>Using boostrap-popover.js</h3>
<h3>Using bootstrap-popover.js</h3>
<pre class="prettyprint linenums">$('#example').popover(options)</pre>
<h3>Options</h3>
<table class="bordered-table striped-table">
......
docs/less.html
View file @ 35fdbad2
......@@ -466,8 +466,7 @@
<!-- Le javascript -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
<script src="../js/tests/vendor/jquery.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/application.js"></script>
</body>
......
docs/scaffolding.html
View file @ 35fdbad2
......@@ -370,8 +370,7 @@
<!-- Le javascript -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
<script src="../js/tests/vendor/jquery.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="../js/bootstrap-transition.js"></script>
<script src="../js/bootstrap-twipsy.js"></script>
......
docs/upgrading.html
View file @ 35fdbad2
......@@ -38,7 +38,7 @@
<li><a href="./base-css.html">Base CSS</a></li>
<li><a href="./components.html">Components</a></li>
<li><a href="./javascript.html">Javascript plugins</a></li>
<li class="active"><a href="./less.html">Using LESS</a></li>
<li><a href="./less.html">Using LESS</a></li>
</ul>
</div>
</div>
......@@ -100,6 +100,16 @@
</ul>
</li>
</ul>
<!--
<li>
<ul>
<li></li>
</ul>
</li>
-->
</ul>
<!-- Footer
================================================== -->
<footer class="footer">
......@@ -109,5 +119,6 @@
<p>Icons from <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>
</footer>
</div><!-- /container -->
</body>
</html>
lib/bootstrap.less
View file @ 35fdbad2
......@@ -27,13 +27,14 @@
// Temp catchall for what's missing thus far
@import "patterns.less";
@import "dropdowns.less";
@import "tabs-pills.less";
@import "breadcrumbs.less";
@import "pagination.less";
@import "modals.less";
@import "twipsy.less";
@import "popovers.less";
@import "media-grids.less";
@import "thumbnails.less";
// Responsive
@import "responsive.less";
\ No newline at end of file
lib/dropdowns.less 0 → 100644
View file @ 35fdbad2
// Dropdown Menus
// Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
.dropdown {
position: relative;
}
// The link that is clicked to toggle the dropdown
.dropdown-toggle: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 @white;
.opacity(30);
content: "&darr;";
}
.dropdown:hover .dropdown-toggle:after {
.opacity(100);
}
// The dropdown menu (ul)
.dropdown-menu {
position: absolute;
top: 40px;
z-index: 900;
float: left;
display: none; // None by default, but block on "open" of the menu
min-width: 160px;
max-width: 220px;
_width: 160px;
padding: 6px 0;
margin-left: 0; // override default ul styles
margin-right: 0;
background-color: @white;
border-color: #999;
border-color: rgba(0,0,0,.2);
border-style: solid;
border-width: 0 1px 1px;
.border-radius(0 0 6px 6px);
.box-shadow(0 2px 4px rgba(0,0,0,.2));
.background-clip(padding-box);
zoom: 1; // do we need this?
// Unfloat any li's to make them stack
li {
float: none;
display: block;
background-color: none;
}
// Dividers (basically an hr) within the dropdown
.divider {
height: 1px;
margin: 5px 0;
overflow: hidden;
background-color: #eee;
border-bottom: 1px solid @white;
}
}
.topbar .dropdown-menu, .dropdown-menu {
// Links within the dropdown menu
a {
display: block;
padding: 4px 15px;
clear: both;
font-weight: normal;
line-height: 18px;
color: @gray;
text-shadow: 0 1px 0 @white;
// Hover state
&:hover {
color: @grayDark;
text-decoration: none;
#gradient > .vertical(#eeeeee, #dddddd);
@shadow: inset 0 1px 0 rgba(0,0,0,.025), inset 0 -1px rgba(0,0,0,.025);
.box-shadow(@shadow);
}
}
}
// Open state for the dropdown
.dropdown.open {
.dropdown-toggle {
color: @white;
background: #ccc;
background: rgba(0,0,0,.3);
}
.dropdown-menu {
display: block;
}
}
lib/forms.less
View file @ 35fdbad2
......@@ -325,6 +325,7 @@ textarea[readonly] {
// Allow us to put symbols and text within the input field for a cleaner look
.input-prepend,
.input-append {
overflow: hidden;
input {
.border-radius(0 3px 3px 0);
}
......
lib/mixins.less
View file @ 35fdbad2
......@@ -205,7 +205,6 @@
// Gradient Bar Colors for buttons and alerts
.gradientBar(@primaryColor, @secondaryColor) {
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
#gradient > .vertical(@primaryColor, @secondaryColor);
border-color: @secondaryColor @secondaryColor darken(@secondaryColor, 15%);
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
......
lib/patterns.less
View file @ 35fdbad2
......@@ -401,7 +401,7 @@ footer {
cursor: pointer;
&:hover {
color: #333;
color: @grayDark;
text-decoration: none;
background-position: 0 -15px;
}
......@@ -414,6 +414,7 @@ footer {
// Primary Button Type
&.primary {
color: @white;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
.gradientBar(@blue, @blueDark)
}
......@@ -575,6 +576,12 @@ input[type=submit].btn {
.box-shadow(0 1px 0 rgba(255,255,255,.25));
}
&.error,
&.success,
&.info {
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}
&.block-message {
padding: 14px;
background-image: none;
......
lib/media-grids.less → lib/thumbnails.less
View file @ 35fdbad2
......@@ -13,6 +13,7 @@
}
.thumbnail {
display: block;
padding: 4px;
line-height: 1;
border: 1px solid #ddd;
.border-radius(4px);
......@@ -26,7 +27,7 @@ a.thumbnail:hover {
// Images and captions
.thumbnail > img {
display: block;
margin: 4px;
max-width: 100%;
}
.thumbnail .caption {
padding: 9px;
......
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