tweak the h2s again for better spacing, adjust docs, remove white bg if possible on file input, few other tweaks
This commit is contained in:
Mark Otto
parent
756e7c8739
commit
2a82b38cff
|
|
@ -6,7 +6,7 @@
|
|||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Designed and built with all the love in the world @twitter by @mdo and @fat.
|
||||
* Date: Sun Oct 16 12:11:34 PDT 2011
|
||||
* Date: Sun Oct 16 18:00:58 PDT 2011
|
||||
*/
|
||||
/* Reset.less
|
||||
* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
|
||||
|
|
@ -388,7 +388,7 @@ h1 small {
|
|||
}
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
line-height: 27px;
|
||||
line-height: 36px;
|
||||
}
|
||||
h2 small {
|
||||
font-size: 14px;
|
||||
|
|
@ -434,7 +434,7 @@ ol {
|
|||
}
|
||||
li {
|
||||
line-height: 18px;
|
||||
color: #808080;
|
||||
color: #404040;
|
||||
}
|
||||
ul.unstyled {
|
||||
list-style: none;
|
||||
|
|
@ -553,9 +553,6 @@ label {
|
|||
margin-bottom: 5px;
|
||||
color: #404040;
|
||||
}
|
||||
input[type=checkbox], input[type=radio] {
|
||||
cursor: pointer;
|
||||
}
|
||||
input,
|
||||
textarea,
|
||||
select,
|
||||
|
|
@ -583,9 +580,11 @@ input[type=checkbox], input[type=radio] {
|
|||
|
||||
line-height: normal;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
input[type=file] {
|
||||
background-color: #ffffff;
|
||||
background-color: initial;
|
||||
padding: initial;
|
||||
border: initial;
|
||||
line-height: initial;
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ a{color:#0069d6;text-decoration:none;line-height:inherit;font-weight:inherit;}a:
|
|||
p{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;margin-bottom:9px;}p small{font-size:11px;color:#bfbfbf;}
|
||||
h1,h2,h3,h4,h5,h6{font-weight:bold;color:#404040;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#bfbfbf;}
|
||||
h1{margin-bottom:18px;font-size:30px;line-height:36px;}h1 small{font-size:18px;}
|
||||
h2{font-size:24px;line-height:27px;}h2 small{font-size:14px;}
|
||||
h2{font-size:24px;line-height:36px;}h2 small{font-size:14px;}
|
||||
h3{line-height:27px;font-size:18px;}h3 small{font-size:14px;}
|
||||
h4{font-size:16px;line-height:36px;}h4 small{font-size:12px;}
|
||||
h5{font-size:14px;line-height:18px;}
|
||||
|
|
@ -75,7 +75,7 @@ ul,ol{margin:0 0 18px 25px;}
|
|||
ul ul,ul ol,ol ol,ol ul{margin-bottom:0;}
|
||||
ul{list-style:disc;}
|
||||
ol{list-style:decimal;}
|
||||
li{line-height:18px;color:#808080;}
|
||||
li{line-height:18px;color:#404040;}
|
||||
ul.unstyled{list-style:none;margin-left:0;}
|
||||
dl{margin-bottom:18px;}dl dt,dl dd{line-height:18px;}
|
||||
dl dt{font-weight:bold;}
|
||||
|
|
@ -94,10 +94,9 @@ form{margin-bottom:18px;}
|
|||
legend{display:block;width:100%;margin-bottom:27px;font-size:19.5px;line-height:36px;color:#404040;border-bottom:1px solid #eee;}
|
||||
label,input,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:18px;}
|
||||
label{display:block;margin-bottom:5px;color:#404040;}
|
||||
input[type=checkbox],input[type=radio]{cursor:pointer;}
|
||||
input,textarea,select,.uneditable-input{display:inline-block;width:210px;height:18px;padding:4px;font-size:13px;line-height:18px;color:#808080;border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
|
||||
input[type=checkbox],input[type=radio]{width:auto;height:auto;padding:0;margin:3px 0;*margin-top:0;line-height:normal;border:none;}
|
||||
input[type=file]{background-color:#ffffff;padding:initial;border:initial;line-height:initial;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
|
||||
input[type=checkbox],input[type=radio]{width:auto;height:auto;padding:0;margin:3px 0;*margin-top:0;line-height:normal;border:none;cursor:pointer;}
|
||||
input[type=file]{background-color:#ffffff;background-color:initial;padding:initial;border:initial;line-height:initial;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
|
||||
input[type=button],input[type=reset],input[type=submit]{width:auto;height:auto;}
|
||||
select,input[type=file]{height:27px;line-height:27px;*margin-top:4px;}
|
||||
select[multiple]{background-color:#ffffff;height:inherit;}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
-------------------------------------------------- */
|
||||
body {
|
||||
position: relative;
|
||||
padding-top: 40px;
|
||||
padding-top: 100px;
|
||||
background-color: #fff;
|
||||
}
|
||||
section {
|
||||
|
|
@ -19,65 +19,88 @@ section > .row {
|
|||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* Tweak topbar brand link to be super sleek
|
||||
-------------------------------------------------- */
|
||||
.navbar .brand {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,.1);
|
||||
}
|
||||
.navbar .brand:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Jumbotrons
|
||||
-------------------------------------------------- */
|
||||
.jumbotron,
|
||||
.jumbotron .inner {
|
||||
-webkit-border-radius: 0 0 6px 6px;
|
||||
-moz-border-radius: 0 0 6px 6px;
|
||||
border-radius: 0 0 6px 6px;
|
||||
}
|
||||
.jumbotron {
|
||||
margin-bottom: 40px;
|
||||
-webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15), 0 1px 3px rgba(0,0,0,.25);
|
||||
-moz-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15), 0 1px 3px rgba(0,0,0,.25);
|
||||
box-shadow: inset 0 -1px 0 rgba(0,0,0,.15), 0 1px 3px rgba(0,0,0,.25);
|
||||
}
|
||||
.jumbotron .inner {
|
||||
background: transparent url(../img/grid-18px.png) top center;
|
||||
padding: 36px 60px;
|
||||
-webkit-box-shadow: inset 0 -15px 30px rgba(0,0,0,.1);
|
||||
-moz-box-shadow: inset 0 -15px 30px rgba(0,0,0,.1);
|
||||
box-shadow: inset 0 -15px 30px rgba(0,0,0,.1);
|
||||
position: relative;
|
||||
padding-bottom: 58px;
|
||||
margin-bottom: 50px;
|
||||
border-bottom: 2px solid #eee;
|
||||
}
|
||||
.jumbotron h1,
|
||||
.jumbotron p {
|
||||
margin-bottom: 9px;
|
||||
color: #fff;
|
||||
text-shadow: 0 1px 1px rgba(0,0,0,.3);
|
||||
margin-bottom: 10px;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
.jumbotron h1 {
|
||||
font-size: 54px;
|
||||
font-size: 90px;
|
||||
line-height: 1;
|
||||
text-shadow: 0 1px 2px rgba(0,0,0,.5);
|
||||
margin-right: 40%;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
.jumbotron p {
|
||||
font-weight: 300;
|
||||
margin-right: 25%;
|
||||
margin-right: 32%;
|
||||
}
|
||||
.jumbotron .lead {
|
||||
font-size: 20px;
|
||||
line-height: 27px;
|
||||
margin-bottom: 20px;
|
||||
font-size: 25px;
|
||||
line-height: 35px;
|
||||
}
|
||||
.jumbotron p a {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
.jumbotron .btn {
|
||||
font-size: 20px;
|
||||
padding: 12px 24px;
|
||||
-webkit-border-radius: 6px;
|
||||
-moz-border-radius: 6px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.benefits {
|
||||
width: 250px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 60px;
|
||||
}
|
||||
.benefits ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
}
|
||||
.benefits li {
|
||||
font-size: 16px;
|
||||
font-weight: 300;
|
||||
line-height: 40px;
|
||||
color: #555;
|
||||
}
|
||||
.benefits li + li {
|
||||
border-top: 1px solid #f5f5f5;
|
||||
}
|
||||
.benefits h4 {
|
||||
color: #555;
|
||||
}
|
||||
.benefits span {
|
||||
position: relative;
|
||||
top: -2px;
|
||||
padding-right: 5px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
|
||||
/* Specific jumbotrons
|
||||
------------------------- */
|
||||
/* main docs page */
|
||||
.masthead {
|
||||
background-color: #004d9f;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#048ccd), to(#004d9f));
|
||||
background-image: -webkit-linear-gradient(#048ccd, #004d9f);
|
||||
background-image: -moz-linear-gradient(#048ccd, #004d9f);
|
||||
background-image: -o-linear-gradient(top, #048ccd, #004d9f);
|
||||
background-image: -khtml-gradient(linear, left top, left bottom, from(#048ccd), to(#004d9f));
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#048ccd', endColorstr='#004d9f', GradientType=0); /* IE8 and down */
|
||||
}
|
||||
/* supporting docs pages */
|
||||
.subhead {
|
||||
background-color: #767d80;
|
||||
|
|
|
|||
|
|
@ -16,16 +16,6 @@
|
|||
<link href="assets/css/docs.css" rel="stylesheet">
|
||||
<link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet">
|
||||
|
||||
<!-- Le javascript -->
|
||||
<script src="http://code.jquery.com/jquery-1.5.2.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-dropdown.js"></script>
|
||||
<script src="../js/bootstrap-twipsy.js"></script>
|
||||
<script src="../js/bootstrap-scrollspy.js"></script>
|
||||
<script src="assets/js/application.js"></script>
|
||||
|
||||
<!-- Le fav and touch icons -->
|
||||
<link rel="shortcut icon" type="image/x-icon" href="assets/ico/favicon.ico">
|
||||
<link rel="apple-touch-icon" href="assets/ico/bootstrap-apple-57x57.png">
|
||||
|
|
@ -49,6 +39,7 @@
|
|||
<ul class="dropdown-menu">
|
||||
<li><a href="#grid-system">Grid</a></li>
|
||||
<li><a href="#layouts">Layouts</a></li>
|
||||
<li><a href="#responsive">Resposive</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="dropdown">
|
||||
|
|
@ -62,14 +53,17 @@
|
|||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-dropdown="true">Patterns</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="#media">Media</a></li>
|
||||
<li><a href="#navigation">Navigation</a></li>
|
||||
<li><a href="#media">Media</a></li>
|
||||
<li><a href="#alerts">Alerts</a></li>
|
||||
<li><a href="#popovers">Popovers</a></li>
|
||||
<li><a href="#autocomplete">Autocomplete</a></li>
|
||||
<li><a href="#accordion">Accordion</a></li>
|
||||
<li><a href="#datepicker">Datepicker</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#javascript">Javascript</a></li>
|
||||
<li><a href="#less">Less</a></li>
|
||||
<li><a href="#less">Using Less</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -82,10 +76,21 @@
|
|||
================================================== -->
|
||||
<header class="jumbotron masthead">
|
||||
<div class="inner">
|
||||
<div class="benefits pull-right">
|
||||
<h4>Feature highlights</h4>
|
||||
<ul>
|
||||
<li><span>×</span> Built on LESS</li>
|
||||
<li><span>×</span> Complete styleguide</li>
|
||||
<li><span>×</span> Fully responsive design</li>
|
||||
<li><span>×</span> Small footprint (7kb gzipped)</li>
|
||||
<li><span>×</span> Support for IE7 and up</li>
|
||||
<li><span>×</span> Custom jQuery plugins</li>
|
||||
<li><span>×</span> Dozens of components</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h1>Bootstrap, from Twitter</h1>
|
||||
<a href="#" class="btn btn-large pull-right">Download on GitHub</a>
|
||||
<p class="lead">Bootstrap is a frontend toolkit from Twitter designed to kickstart web development, complete with core HTML, CSS, and JS for grids, type, forms, navigation, and many more components.</p>
|
||||
<p><strong>Nerd alert:</strong> Bootstrap is <a href="#less" title="Read about using Bootstrap with Less">built with Less</a> and was designed with modern browsers in mind.</p>
|
||||
<a href="#" class="btn primary btn-large">Download on GitHub</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
|
@ -164,6 +169,19 @@
|
|||
</li>
|
||||
</ul>
|
||||
|
||||
<!--
|
||||
Quick links:
|
||||
GitHub
|
||||
Twitter
|
||||
Roadmap
|
||||
Changelog
|
||||
|
||||
Authors:
|
||||
@mdo
|
||||
@fat
|
||||
|
||||
-->
|
||||
|
||||
</div><!-- /#overview -->
|
||||
|
||||
|
||||
|
|
@ -1964,5 +1982,16 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
|
|||
</div><!-- /container -->
|
||||
|
||||
|
||||
|
||||
<!-- Le javascript -->
|
||||
<script src="http://code.jquery.com/jquery-1.5.2.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-dropdown.js"></script>
|
||||
<script src="../js/bootstrap-twipsy.js"></script>
|
||||
<script src="../js/bootstrap-scrollspy.js"></script>
|
||||
<script src="assets/js/application.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -37,12 +37,6 @@ label {
|
|||
color: @grayDark;
|
||||
}
|
||||
|
||||
// Checkboxs and radio buttons
|
||||
input[type=checkbox],
|
||||
input[type=radio] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// Inputs, Textareas, Selects
|
||||
input,
|
||||
textarea,
|
||||
|
|
@ -69,11 +63,13 @@ input[type=radio] {
|
|||
*margin-top: 0; /* IE6-7 */
|
||||
line-height: normal;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// Reset the file input to browser defaults
|
||||
input[type=file] {
|
||||
background-color: @white;
|
||||
background-color: initial;
|
||||
padding: initial;
|
||||
border: initial;
|
||||
line-height: initial;
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ h1 {
|
|||
}
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
line-height: @baseLineHeight * 1.5;
|
||||
line-height: @baseLineHeight * 2;
|
||||
small {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
|
@ -90,7 +90,7 @@ ol {
|
|||
}
|
||||
li {
|
||||
line-height: @baseLineHeight;
|
||||
color: @gray;
|
||||
color: @grayDark;
|
||||
}
|
||||
ul.unstyled {
|
||||
list-style: none;
|
||||
|
|
|
|||
Loading…
Reference in New Issue