Skip to content

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

new jumbotron

parent fb290759
Hide whitespace changes
Inline Side-by-side
Showing with 120 additions and 18 deletions
docs/assets/css/bootstrap-responsive.css
View file @ 70e81e6f
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
.clearfix:before, .clearfix:before,
.clearfix:after { .clearfix:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -94,6 +95,7 @@ ...@@ -94,6 +95,7 @@
.row:before, .row:before,
.row:after { .row:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row:after { .row:after {
...@@ -187,6 +189,7 @@ ...@@ -187,6 +189,7 @@
.row-fluid:before, .row-fluid:before,
.row-fluid:after { .row-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row-fluid:after { .row-fluid:after {
...@@ -434,6 +437,7 @@ ...@@ -434,6 +437,7 @@
.row:before, .row:before,
.row:after { .row:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row:after { .row:after {
...@@ -527,6 +531,7 @@ ...@@ -527,6 +531,7 @@
.row-fluid:before, .row-fluid:before,
.row-fluid:after { .row-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
.row-fluid:after { .row-fluid:after {
......
docs/assets/css/bootstrap.css
View file @ 70e81e6f
...@@ -130,6 +130,7 @@ textarea { ...@@ -130,6 +130,7 @@ textarea {
.clearfix:before, .clearfix:before,
.clearfix:after { .clearfix:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -181,6 +182,7 @@ a:hover { ...@@ -181,6 +182,7 @@ a:hover {
.row:before, .row:before,
.row:after { .row:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -303,6 +305,7 @@ a:hover { ...@@ -303,6 +305,7 @@ a:hover {
.row-fluid:before, .row-fluid:before,
.row-fluid:after { .row-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -515,6 +518,7 @@ a:hover { ...@@ -515,6 +518,7 @@ a:hover {
.container:before, .container:before,
.container:after { .container:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -531,6 +535,7 @@ a:hover { ...@@ -531,6 +535,7 @@ a:hover {
.container-fluid:before, .container-fluid:before,
.container-fluid:after { .container-fluid:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -1331,6 +1336,7 @@ select:focus:required:invalid:focus { ...@@ -1331,6 +1336,7 @@ select:focus:required:invalid:focus {
.form-actions:before, .form-actions:before,
.form-actions:after { .form-actions:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -1600,6 +1606,7 @@ legend + .control-group { ...@@ -1600,6 +1606,7 @@ legend + .control-group {
.form-horizontal .control-group:before, .form-horizontal .control-group:before,
.form-horizontal .control-group:after { .form-horizontal .control-group:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -2758,9 +2765,9 @@ button.close { ...@@ -2758,9 +2765,9 @@ button.close {
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0); filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
filter: progid:dximagetransform.microsoft.gradient(enabled=false); filter: progid:dximagetransform.microsoft.gradient(enabled=false);
*zoom: 1; *zoom: 1;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 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); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 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); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 2px rgba(0, 0, 0, 0.05);
} }
.btn:hover, .btn:hover,
...@@ -2807,9 +2814,9 @@ button.close { ...@@ -2807,9 +2814,9 @@ button.close {
background-color: #d9d9d9 \9; background-color: #d9d9d9 \9;
background-image: none; background-image: none;
outline: 0; outline: 0;
-webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.05);
} }
.btn.disabled, .btn.disabled,
...@@ -3029,17 +3036,17 @@ button.close { ...@@ -3029,17 +3036,17 @@ button.close {
} }
.btn-inverse { .btn-inverse {
background-color: #414141; background-color: #363636;
*background-color: #222222; *background-color: #222222;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#555555), to(#222222)); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444444), to(#222222));
background-image: -webkit-linear-gradient(top, #555555, #222222); background-image: -webkit-linear-gradient(top, #444444, #222222);
background-image: -o-linear-gradient(top, #555555, #222222); background-image: -o-linear-gradient(top, #444444, #222222);
background-image: linear-gradient(top, #555555, #222222); background-image: linear-gradient(top, #444444, #222222);
background-image: -moz-linear-gradient(top, #555555, #222222); background-image: -moz-linear-gradient(top, #444444, #222222);
background-repeat: repeat-x; background-repeat: repeat-x;
border-color: #222222 #222222 #000000; border-color: #222222 #222222 #000000;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff555555', endColorstr='#ff222222', GradientType=0); filter: progid:dximagetransform.microsoft.gradient(startColorstr='#ff444444', endColorstr='#ff222222', GradientType=0);
filter: progid:dximagetransform.microsoft.gradient(enabled=false); filter: progid:dximagetransform.microsoft.gradient(enabled=false);
} }
...@@ -3468,6 +3475,7 @@ input[type="submit"].btn.btn-mini { ...@@ -3468,6 +3475,7 @@ input[type="submit"].btn.btn-mini {
.nav-tabs:after, .nav-tabs:after,
.nav-pills:after { .nav-pills:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -3641,6 +3649,7 @@ input[type="submit"].btn.btn-mini { ...@@ -3641,6 +3649,7 @@ input[type="submit"].btn.btn-mini {
.tabbable:before, .tabbable:before,
.tabbable:after { .tabbable:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -3845,6 +3854,7 @@ input[type="submit"].btn.btn-mini { ...@@ -3845,6 +3854,7 @@ input[type="submit"].btn.btn-mini {
.navbar-form:before, .navbar-form:before,
.navbar-form:after { .navbar-form:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -4373,6 +4383,7 @@ input[type="submit"].btn.btn-mini { ...@@ -4373,6 +4383,7 @@ input[type="submit"].btn.btn-mini {
.pager:before, .pager:before,
.pager:after { .pager:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -4522,6 +4533,7 @@ input[type="submit"].btn.btn-mini { ...@@ -4522,6 +4533,7 @@ input[type="submit"].btn.btn-mini {
.modal-footer:before, .modal-footer:before,
.modal-footer:after { .modal-footer:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
...@@ -4814,6 +4826,7 @@ input[type="submit"].btn.btn-mini { ...@@ -4814,6 +4826,7 @@ input[type="submit"].btn.btn-mini {
.thumbnails:before, .thumbnails:before,
.thumbnails:after { .thumbnails:after {
display: table; display: table;
line-height: 0;
content: ""; content: "";
} }
......
docs/assets/css/docs.css
View file @ 70e81e6f
...@@ -775,3 +775,61 @@ form.bs-docs-example { ...@@ -775,3 +775,61 @@ form.bs-docs-example {
float: none; float: none;
} }
} }
.navbar {
}
.jumbo {
padding: 100px 0;
margin-top: -60px;
background-color: #222;
color: #fff;
text-align: center;
text-shadow: 0 1px 0 rgba(0,0,0,.1), 0 0 30px rgba(0,0,0,.075);
background: #c9cabc; /* Old browsers */
background: -moz-linear-gradient(-45deg, #c9cabc 0%, #68686d 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#c9cabc), color-stop(100%,#68686d)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg, #c9cabc 0%,#68686d 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg, #c9cabc 0%,#68686d 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg, #c9cabc 0%,#68686d 100%); /* IE10+ */
background: linear-gradient(135deg, #c9cabc 0%,#68686d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9cabc', endColorstr='#68686d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
xborder-bottom: 1px solid #68686d;
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
-moz-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
}
.jumbo h1 {
font-size: 120px;
font-weight: 200;
line-height: 1;
margin: 0 0 5px;
letter-spacing: -2px;
}
.jumbo p {
margin-bottom: 30px;
font-size: 40px;
font-weight: 200;
line-height: 1.25;
}
.jumbo .btn {
font-size: 20px;
padding: 14px 24px;
margin: 0 10px 30px 0;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 3px rgba(0,0,0,.2);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 3px rgba(0,0,0,.2);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 3px rgba(0,0,0,.2);
}
.jumbo .btn:active {
-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.25);
-moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.25);
box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.25);
}
docs/index.html
View file @ 70e81e6f
...@@ -75,9 +75,22 @@ ...@@ -75,9 +75,22 @@
<div class="bs-docs-container"> <div class="bs-docs-container">
</div>
<div class="jumbo">
<div class="bs-docs-container">
<h1>Bootstrap</h1>
<p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
<a href="assets/bootstrap.zip" class="btn btn-inverse btn-large">Download Bootstrap <small>(v2.1.0)</small></a>
</div>
</div>
<div class="bs-docs-container">
<!-- Masthead <!-- Masthead
================================================== --> ================================================== -->
<header class="jumbotron masthead"> <header class="jumbotron masthead" style="display: none;">
<div class="inner"> <div class="inner">
<h1>Twitter Bootstrap</h1> <h1>Twitter Bootstrap</h1>
<p>Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.</p> <p>Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.</p>
......
docs/templates/pages/index.mustache
View file @ 70e81e6f
</div>
<div class="jumbo">
<div class="bs-docs-container">
<h1>Bootstrap</h1>
<p>Sleek, intuitive, and powerful front-end framework for faster and easier web development.</p>
<a href="assets/bootstrap.zip" class="btn btn-inverse btn-large">{{_i}}Download Bootstrap <small>(v2.1.0)</small>{{/i}}</a>
</div>
</div>
<div class="bs-docs-container">
<!-- Masthead <!-- Masthead
================================================== --> ================================================== -->
<header class="jumbotron masthead"> <header class="jumbotron masthead" style="display: none;">
<div class="inner"> <div class="inner">
<h1>{{_i}}Twitter Bootstrap{{/i}}</h1> <h1>{{_i}}Twitter Bootstrap{{/i}}</h1>
<p>{{_i}}Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.{{/i}}</p> <p>{{_i}}Simple and flexible HTML, CSS, and Javascript for popular user interface components and interactions.{{/i}}</p>
......
less/buttons.less
View file @ 70e81e6f
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
border-bottom-color: darken(@btnBorder, 10%); border-bottom-color: darken(@btnBorder, 10%);
.border-radius(4px); .border-radius(4px);
.ie7-restore-left-whitespace(); // Give IE7 some love .ie7-restore-left-whitespace(); // Give IE7 some love
.box-shadow(~"inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)"); .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 2px rgba(0,0,0,.05)");
} }
// Hover state // Hover state
...@@ -54,7 +54,7 @@ ...@@ -54,7 +54,7 @@
background-color: darken(@white, 15%) e("\9"); background-color: darken(@white, 15%) e("\9");
background-image: none; background-image: none;
outline: 0; outline: 0;
.box-shadow(~"inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05)"); .box-shadow(~"inset 0 2px 4px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05)");
} }
// Disabled state // Disabled state
......
less/variables.less
View file @ 70e81e6f
...@@ -87,7 +87,7 @@ ...@@ -87,7 +87,7 @@
@btnDangerBackground: #ee5f5b; @btnDangerBackground: #ee5f5b;
@btnDangerBackgroundHighlight: #bd362f; @btnDangerBackgroundHighlight: #bd362f;
@btnInverseBackground: @gray; @btnInverseBackground: #444;
@btnInverseBackgroundHighlight: @grayDarker; @btnInverseBackgroundHighlight: @grayDarker;
......
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