Skip to content
GitLab
Commit 2a82b38c authored by Mark Otto's avatar Mark Otto
Browse files

tweak the h2s again for better spacing, adjust docs, remove white bg if... 

tweak the h2s again for better spacing, adjust docs, remove white bg if possible on file input, few other tweaks
parent 756e7c87
Hide whitespace changes
Inline Side-by-side
Showing
with 117 additions and 71 deletions
+117 -71
bootstrap.css
+ 5
- 6
View file @ 2a82b38c
......@@ -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;
......
bootstrap.min.css
+ 4
- 5
View file @ 2a82b38c
......@@ -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;}
......
docs/assets/css/docs.css
+ 61
- 38
View file @ 2a82b38c
......@@ -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;
......
docs/index.html
+ 43
- 14
View file @ 2a82b38c
......@@ -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>&times;</span> Built on LESS</li>
<li><span>&times;</span> Complete styleguide</li>
<li><span>&times;</span> Fully responsive design</li>
<li><span>&times;</span> Small footprint (7kb gzipped)</li>
<li><span>&times;</span> Support for IE7 and up</li>
<li><span>&times;</span> Custom jQuery plugins</li>
<li><span>&times;</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>
lib/forms.less
+ 2
- 6
View file @ 2a82b38c
......@@ -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;
......
lib/type.less
+ 2
- 2
View file @ 2a82b38c
......@@ -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;
......
Supports Markdown
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