Skip to content

B
bootstrap
Commit 460a84a9 authored by Mark Otto's avatar Mark Otto
Browse files
Options

Updated offset columns, fix app.js bug, misc tweaks to copy

parent b0884580
Hide whitespace changes
Inline Side-by-side
Showing with 205 additions and 146 deletions
bootstrap-1.0.0.css
View file @ 460a84a9
......@@ -128,144 +128,216 @@ aside {
*/
/* Baseline Grid System
-------------------------------------------------- */
div.row {
.row {
zoom: 1;
}
div.row:after {
.row:after {
display: block;
visibility: hidden;
height: 0;
clear: both;
content: ".";
}
div.row div.span1 {
.row .span1 {
float: left;
width: 40px;
margin-left: 20px;
}
div.row div.span1:first-child {
.row .span1:first-child {
margin-left: 0;
}
div.row div.span2 {
.row .span2 {
float: left;
width: 100px;
margin-left: 20px;
}
div.row div.span2:first-child {
.row .span2:first-child {
margin-left: 0;
}
div.row div.span3 {
.row .span3 {
float: left;
width: 160px;
margin-left: 20px;
}
div.row div.span3:first-child {
.row .span3:first-child {
margin-left: 0;
}
div.row div.span4 {
.row .span4 {
float: left;
width: 220px;
margin-left: 20px;
}
div.row div.span4:first-child {
.row .span4:first-child {
margin-left: 0;
}
div.row div.span5 {
.row .span5 {
float: left;
width: 280px;
margin-left: 20px;
}
div.row div.span5:first-child {
.row .span5:first-child {
margin-left: 0;
}
div.row div.span6 {
.row .span6 {
float: left;
width: 340px;
margin-left: 20px;
}
div.row div.span6:first-child {
.row .span6:first-child {
margin-left: 0;
}
div.row div.span7 {
.row .span7 {
float: left;
width: 400px;
margin-left: 20px;
}
div.row div.span7:first-child {
.row .span7:first-child {
margin-left: 0;
}
div.row div.span8 {
.row .span8 {
float: left;
width: 460px;
margin-left: 20px;
}
div.row div.span8:first-child {
.row .span8:first-child {
margin-left: 0;
}
div.row div.span9 {
.row .span9 {
float: left;
width: 520px;
margin-left: 20px;
}
div.row div.span9:first-child {
.row .span9:first-child {
margin-left: 0;
}
div.row div.span10 {
.row .span10 {
float: left;
width: 580px;
margin-left: 20px;
}
div.row div.span10:first-child {
.row .span10:first-child {
margin-left: 0;
}
div.row div.span11 {
.row .span11 {
float: left;
width: 640px;
margin-left: 20px;
}
div.row div.span11:first-child {
.row .span11:first-child {
margin-left: 0;
}
div.row div.span12 {
.row .span12 {
float: left;
width: 700px;
margin-left: 20px;
}
div.row div.span12:first-child {
.row .span12:first-child {
margin-left: 0;
}
div.row div.span13 {
.row .span13 {
float: left;
width: 760px;
margin-left: 20px;
}
div.row div.span13:first-child {
.row .span13:first-child {
margin-left: 0;
}
div.row div.span14 {
.row .span14 {
float: left;
width: 820px;
margin-left: 20px;
}
div.row div.span14:first-child {
.row .span14:first-child {
margin-left: 0;
}
div.row div.span15 {
.row .span15 {
float: left;
width: 880px;
margin-left: 20px;
}
div.row div.span15:first-child {
.row .span15:first-child {
margin-left: 0;
}
div.row div.span16 {
.row .span16 {
float: left;
width: 940px;
margin-left: 20px;
}
div.row div.span16:first-child {
.row .span16:first-child {
margin-left: 0;
}
.row .offset1 {
margin-left: 80px !important;
}
.row .offset1:first-child {
margin-left: 60px !important;
}
.row .offset2 {
margin-left: 140px !important;
}
.row .offset2:first-child {
margin-left: 120px !important;
}
.row .offset3 {
margin-left: 200px !important;
}
.row .offset3:first-child {
margin-left: 180px !important;
}
.row .offset4 {
margin-left: 260px !important;
}
.row .offset4:first-child {
margin-left: 240px !important;
}
.row .offset5 {
margin-left: 320px !important;
}
.row .offset5:first-child {
margin-left: 300px !important;
}
.row .offset6 {
margin-left: 380px !important;
}
.row .offset6:first-child {
margin-left: 360px !important;
}
.row .offset7 {
margin-left: 440px !important;
}
.row .offset7:first-child {
margin-left: 420px !important;
}
.row .offset8 {
margin-left: 500px !important;
}
.row .offset8:first-child {
margin-left: 480px !important;
}
.row .offset9 {
margin-left: 500px !important;
}
.row .offset9:first-child {
margin-left: 480px !important;
}
.row .offset10 {
margin-left: 620px !important;
}
.row .offset10:first-child {
margin-left: 600px !important;
}
.row .offset11 {
margin-left: 680px !important;
}
.row .offset11:first-child {
margin-left: 660px !important;
}
.row .offset12 {
margin-left: 740px !important;
}
.row .offset12:first-child {
margin-left: 720px !important;
}
/* Structural Layout
-------------------------------------------------- */
html, body {
......@@ -928,10 +1000,10 @@ table th {
/* Zebra-striping
-------------------------------------------------- */
table.zebra-striped tbody tr:nth-child(odd) td {
background-color: #f5f5f5;
background-color: #f9f9f9;
}
table.zebra-striped tbody tr:hover td {
background-color: #f1f1f1;
background-color: #f5f5f5;
}
table.zebra-striped th.header {
cursor: pointer;
......
bootstrap-1.0.0.min.css
View file @ 460a84a9
......@@ -7,23 +7,35 @@ header,section,footer,article,aside{display:block;}
.clearfix{zoom:1;}.clearfix:after{display:block;visibility:hidden;height:0;clear:both;content:".";}
.center-block{display:block;margin:0 auto;}
.container{width:940px;margin:0 auto;zoom:1;}.container:after{display:block;visibility:hidden;height:0;clear:both;content:".";}
div.row{zoom:1;}div.row:after{display:block;visibility:hidden;height:0;clear:both;content:".";}
div.row div.span1{float:left;width:40px;margin-left:20px;}div.row div.span1:first-child{margin-left:0;}
div.row div.span2{float:left;width:100px;margin-left:20px;}div.row div.span2:first-child{margin-left:0;}
div.row div.span3{float:left;width:160px;margin-left:20px;}div.row div.span3:first-child{margin-left:0;}
div.row div.span4{float:left;width:220px;margin-left:20px;}div.row div.span4:first-child{margin-left:0;}
div.row div.span5{float:left;width:280px;margin-left:20px;}div.row div.span5:first-child{margin-left:0;}
div.row div.span6{float:left;width:340px;margin-left:20px;}div.row div.span6:first-child{margin-left:0;}
div.row div.span7{float:left;width:400px;margin-left:20px;}div.row div.span7:first-child{margin-left:0;}
div.row div.span8{float:left;width:460px;margin-left:20px;}div.row div.span8:first-child{margin-left:0;}
div.row div.span9{float:left;width:520px;margin-left:20px;}div.row div.span9:first-child{margin-left:0;}
div.row div.span10{float:left;width:580px;margin-left:20px;}div.row div.span10:first-child{margin-left:0;}
div.row div.span11{float:left;width:640px;margin-left:20px;}div.row div.span11:first-child{margin-left:0;}
div.row div.span12{float:left;width:700px;margin-left:20px;}div.row div.span12:first-child{margin-left:0;}
div.row div.span13{float:left;width:760px;margin-left:20px;}div.row div.span13:first-child{margin-left:0;}
div.row div.span14{float:left;width:820px;margin-left:20px;}div.row div.span14:first-child{margin-left:0;}
div.row div.span15{float:left;width:880px;margin-left:20px;}div.row div.span15:first-child{margin-left:0;}
div.row div.span16{float:left;width:940px;margin-left:20px;}div.row div.span16:first-child{margin-left:0;}
.row{zoom:1;}.row:after{display:block;visibility:hidden;height:0;clear:both;content:".";}
.row .span1{float:left;width:40px;margin-left:20px;}.row .span1:first-child{margin-left:0;}
.row .span2{float:left;width:100px;margin-left:20px;}.row .span2:first-child{margin-left:0;}
.row .span3{float:left;width:160px;margin-left:20px;}.row .span3:first-child{margin-left:0;}
.row .span4{float:left;width:220px;margin-left:20px;}.row .span4:first-child{margin-left:0;}
.row .span5{float:left;width:280px;margin-left:20px;}.row .span5:first-child{margin-left:0;}
.row .span6{float:left;width:340px;margin-left:20px;}.row .span6:first-child{margin-left:0;}
.row .span7{float:left;width:400px;margin-left:20px;}.row .span7:first-child{margin-left:0;}
.row .span8{float:left;width:460px;margin-left:20px;}.row .span8:first-child{margin-left:0;}
.row .span9{float:left;width:520px;margin-left:20px;}.row .span9:first-child{margin-left:0;}
.row .span10{float:left;width:580px;margin-left:20px;}.row .span10:first-child{margin-left:0;}
.row .span11{float:left;width:640px;margin-left:20px;}.row .span11:first-child{margin-left:0;}
.row .span12{float:left;width:700px;margin-left:20px;}.row .span12:first-child{margin-left:0;}
.row .span13{float:left;width:760px;margin-left:20px;}.row .span13:first-child{margin-left:0;}
.row .span14{float:left;width:820px;margin-left:20px;}.row .span14:first-child{margin-left:0;}
.row .span15{float:left;width:880px;margin-left:20px;}.row .span15:first-child{margin-left:0;}
.row .span16{float:left;width:940px;margin-left:20px;}.row .span16:first-child{margin-left:0;}
.row .offset1{margin-left:80px !important;}.row .offset1:first-child{margin-left:60px !important;}
.row .offset2{margin-left:140px !important;}.row .offset2:first-child{margin-left:120px !important;}
.row .offset3{margin-left:200px !important;}.row .offset3:first-child{margin-left:180px !important;}
.row .offset4{margin-left:260px !important;}.row .offset4:first-child{margin-left:240px !important;}
.row .offset5{margin-left:320px !important;}.row .offset5:first-child{margin-left:300px !important;}
.row .offset6{margin-left:380px !important;}.row .offset6:first-child{margin-left:360px !important;}
.row .offset7{margin-left:440px !important;}.row .offset7:first-child{margin-left:420px !important;}
.row .offset8{margin-left:500px !important;}.row .offset8:first-child{margin-left:480px !important;}
.row .offset9{margin-left:500px !important;}.row .offset9:first-child{margin-left:480px !important;}
.row .offset10{margin-left:620px !important;}.row .offset10:first-child{margin-left:600px !important;}
.row .offset11{margin-left:680px !important;}.row .offset11:first-child{margin-left:660px !important;}
.row .offset12{margin-left:740px !important;}.row .offset12:first-child{margin-left:720px !important;}
html,body{background-color:#fff;}
body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:18px;color:#808080;text-rendering:optimizeLegibility;}
div.container{width:940px;margin:0 auto;}
......@@ -115,8 +127,8 @@ form.form-stacked ul.inputs-list{margin-bottom:0;}form.form-stacked ul.inputs-li
form.form-stacked div.actions{margin-left:-20px;padding-left:20px;}
table{width:100%;margin-bottom:18px;padding:0;text-align:left;border-collapse:separate;font-size:13px;}table th,table td{padding:10px 10px 9px;line-height:13.5px;vertical-align:middle;border-bottom:1px solid #ddd;}
table th{padding-top:9px;font-weight:bold;border-bottom-width:2px;}
table.zebra-striped tbody tr:nth-child(odd) td{background-color:#f5f5f5;}
table.zebra-striped tbody tr:hover td{background-color:#f1f1f1;}
table.zebra-striped tbody tr:nth-child(odd) td{background-color:#f9f9f9;}
table.zebra-striped tbody tr:hover td{background-color:#f5f5f5;}
table.zebra-striped th.header{cursor:pointer;padding-right:20px;}
table.zebra-striped th.headerSortUp,table.zebra-striped th.headerSortDown{background-image:url(assets/img/tablesorter-indicators.png);background-position:right -23px;background-repeat:no-repeat;background-color:rgba(141, 192, 219, 0.25);text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;}
table.zebra-striped th.header:hover{background-image:url(assets/img/tablesorter-indicators.png);background-position:right 15px;background-repeat:no-repeat;}
......
docs/assets/css/docs.css
View file @ 460a84a9
......@@ -224,47 +224,4 @@ div.topbar-wrapper div.topbar {
padding-right: 20px;
-moz-border-radius: 4px;
border-radius: 4px;
}
/* Code blocks
-------------------------------------------------- */
/*
pre.css, pre.html {
background-color: #fff;
}
pre ol {
background-color: #feeed6;
list-style: decimal;
margin: -17px;
padding-left: 59px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
pre ol li {
background-color: #fff;
padding: 0 10px;
border-left: 1px solid rgba(0, 0, 0, 0.1);
border-left-color: #fddfb3;
font-size: 11px;
line-height: 18px;
color: #bbb;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
word-wrap: break-word;
}
pre ol li:first-child {
padding-top: 9px;
}
pre ol li:last-child {
padding-bottom: 9px;
}
span.html__tag_start, span.html__tag_end {
color: #277ac1;
font-weight: normal;
}
span.html__attr_name {
color: #d78b41;
}
span.html__attr_value {
color: #de4a3f;
}
*/
}
\ No newline at end of file
docs/assets/js/application.js
View file @ 460a84a9
......@@ -34,6 +34,11 @@ $(document).ready(function(){
$(this).parents('.add-on').removeClass('active');
}
});
// Disable certain links in docs
$('ul.tabs a, ul.pills a, .pagination a').click(function(e) {
e.preventDefault();
});
// Copy code blocks in docs
$(".copy-code").focus(function() {
......
docs/index.html
View file @ 460a84a9
......@@ -11,11 +11,6 @@
<!-- 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/jquery/chili/jquery.chili-2.2.js"></script>
<script src="assets/js/jquery/chili/recipes.js"></script>
<script id="setup">ChiliBook.lineNumbers = true;</script>
-->
<link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet" type="text/css">
<script src="assets/js/google-code-prettify/prettify.js"></script>
<script src="assets/js/application.js"></script>
......@@ -76,7 +71,7 @@
</div>
<div class="span5 columns">
<h6>Fork on GitHub</h6>
<p>Download, fork, pull, and more with the official Bootstrap repo on Github.</p>
<p>Download, fork, pull, file issues, and more with the official Bootstrap repo on Github.</p>
<p><a href="" class="btn primary">Bootstrap on GitHub &raquo;</a></p>
</div>
</div>
......@@ -86,27 +81,6 @@
<div class="container">
<section id="getting-started" style="display: none;">
<div class="page-header">
<h1>Getting started</h1>
</div>
<div class="row">
<div class="span4 columns">
<p>Using Twitter Bootstrap is uber easy: just drop in the compiled, minified CSS and you're ready to go.</p>
</div>
<div class="span12 columns">
<h3>Compiled CSS</h3>
<p>Use this option if you want all the styles of Bootstrap in a <a href="../bootstrap-1.0.0.min.css">compiled and minified stylesheet</a>, but none of the extra power of LESS.</p>
<pre class="prettyprint linenums">&lt;link type="text/css" href="bootstrap-1.0.0.css" media="all" /&gt;</pre>
<hr />
<p>Interested in running LESS on your project? No problem, <a href="#less">read how to use Bootstrap with LESS &raquo;</a></p>
</div>
</div>
</section>
<section id="grid-system">
<div class="page-header">
<h1>Grid system <small>Rock the standard 940px or roll your own</small></h1>
......@@ -200,6 +174,23 @@
<div class="row show-grid" title="Unnecessary single column layout">
<div class="span16 columns">16</div>
</div>
<h4>Offsetting columns</h4>
<div class="row show-grid">
<div class="span4 columns">4</div>
<div class="span8 columns offset4">8 offset 4</div>
</div>
<div class="row show-grid">
<div class="span4 columns offset4">4 offset 4</div>
<div class="span4 columns offset4">4 offset 4</div>
</div>
<div class="row show-grid">
<div class="span5 columns offset3">5 offset 3</div>
<div class="span5 columns offset3">5 offset 3</div>
</div>
<div class="row show-grid">
<div class="span10 columns offset6">10 offset 6</div>
</div>
</section>
......
lib/preboot.less
View file @ 460a84a9
......@@ -134,8 +134,14 @@
margin-left: 0;
}
}
.offsetMath(@extraSpace: 40px) {
margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) + @extraSpace !important;
}
.offset(@columnOffset: 1) {
margin-left: (@gridColumnWidth * @columnOffset) + (@gridGutterWidth * (@columnOffset - 1)) !important;
.offsetMath(40px);
&:first-child {
.offsetMath(20px);
}
}
// Border Radius
......
lib/scaffolding.less
View file @ 460a84a9
......@@ -6,24 +6,40 @@
/* Baseline Grid System
-------------------------------------------------- */
div.row {
.row {
.clearfix();
div.span1 { .columns(1); }
div.span2 { .columns(2); }
div.span3 { .columns(3); }
div.span4 { .columns(4); }
div.span5 { .columns(5); }
div.span6 { .columns(6); }
div.span7 { .columns(7); }
div.span8 { .columns(8); }
div.span9 { .columns(9); }
div.span10 { .columns(10); }
div.span11 { .columns(11); }
div.span12 { .columns(12); }
div.span13 { .columns(13); }
div.span14 { .columns(14); }
div.span15 { .columns(15); }
div.span16 { .columns(16); }
// Default columns
.span1 { .columns(1); }
.span2 { .columns(2); }
.span3 { .columns(3); }
.span4 { .columns(4); }
.span5 { .columns(5); }
.span6 { .columns(6); }
.span7 { .columns(7); }
.span8 { .columns(8); }
.span9 { .columns(9); }
.span10 { .columns(10); }
.span11 { .columns(11); }
.span12 { .columns(12); }
.span13 { .columns(13); }
.span14 { .columns(14); }
.span15 { .columns(15); }
.span16 { .columns(16); }
// Offset column options
.offset1 { .offset(1); }
.offset2 { .offset(2); }
.offset3 { .offset(3); }
.offset4 { .offset(4); }
.offset5 { .offset(5); }
.offset6 { .offset(6); }
.offset7 { .offset(7); }
.offset8 { .offset(8); }
.offset9 { .offset(8); }
.offset10 { .offset(10); }
.offset11 { .offset(11); }
.offset12 { .offset(12); }
}
......
lib/tables.less
View file @ 460a84a9
......@@ -35,10 +35,10 @@ table {
table.zebra-striped {
tbody {
tr:nth-child(odd) td {
background-color: #f5f5f5;
background-color: #f9f9f9;
}
tr:hover td {
background-color: #f1f1f1;
background-color: #f5f5f5;
}
}
// Tablesorting styles w/ jQuery plugin
......
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