diff --git a/bootstrap-1.2.0.css b/bootstrap-1.2.0.css index 58ed9a1070a2e8449012a3185d6b1a6c1d9186a6..4055d4ca9230ddff858873cf53c4ee4ecca068bd 100644 --- a/bootstrap-1.2.0.css +++ b/bootstrap-1.2.0.css @@ -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: Sat Sep 3 15:53:45 PDT 2011 + * Date: Sun Sep 4 14:02:46 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). @@ -282,6 +282,12 @@ textarea { Feel free to create and add new variables and mixins here. The goal is to make this your playground and keep the core files intact. */ /* +TODO: +- add ability to set app/site-wide base font-face (need better variables: @baseFontSize, @baseFontFace, @baseLineHeight, etc) +- make form inputs and tables apply the new global type changes (currently statically set) +- add new docs section for examples +- add new docs section for Theme.less +*//* * Scaffolding * Basic and global styles for generating a grid system, structural layout, and page templates * ------------------------------------------------------------------------------------------- */ @@ -683,7 +689,7 @@ fieldset { fieldset legend { display: block; margin-left: 150px; - font-size: 20px; + font-size: 19.5px; line-height: 1; *margin: 0 0 5px 145px; /* IE6-7 */ @@ -897,7 +903,7 @@ textarea[readonly] { text-decoration: underline; } .help-inline, .help-block { - font-size: 12px; + font-size: 11px; line-height: 18px; color: #bfbfbf; } @@ -997,7 +1003,7 @@ textarea[readonly] { color: #808080; } .inputs-list li label small { - font-size: 12px; + font-size: 11px; font-weight: normal; } .inputs-list li ul.inputs-list { diff --git a/bootstrap-1.2.0.min.css b/bootstrap-1.2.0.min.css index 1fc14f628f94c7bfda11b025543bb7cce685921a..caaa362ab44aa0fa4b2e87b6efd49cc72e213446 100644 --- a/bootstrap-1.2.0.min.css +++ b/bootstrap-1.2.0.min.css @@ -113,7 +113,7 @@ code,pre{padding:0 3px 2px;font-family:Monaco, Andale Mono, Courier New, monospa code{background-color:#fee9cc;color:rgba(0, 0, 0, 0.75);padding:1px 3px;} pre{background-color:#f5f5f5;display:block;padding:17px;margin:0 0 18px;line-height:18px;font-size:12px;border:1px solid #ccc;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;white-space:pre;white-space:pre-wrap;word-wrap:break-word;} form{margin-bottom:18px;} -fieldset{margin-bottom:18px;padding-top:18px;}fieldset legend{display:block;margin-left:150px;font-size:20px;line-height:1;*margin:0 0 5px 145px;*line-height:1.5;color:#404040;} +fieldset{margin-bottom:18px;padding-top:18px;}fieldset legend{display:block;margin-left:150px;font-size:19.5px;line-height:1;*margin:0 0 5px 145px;*line-height:1.5;color:#404040;} .clearfix{margin-bottom:18px;} label,input,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:normal;} label{padding-top:6px;font-size:13px;line-height:18px;float:left;width:130px;text-align:right;color:#404040;} @@ -142,7 +142,7 @@ form div.error .input-prepend span.add-on,form div.error .input-append span.add- textarea.xxlarge{overflow-y:auto;} input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{background-color:#f5f5f5;border-color:#ddd;cursor:not-allowed;} .actions{background:#f5f5f5;margin-top:18px;margin-bottom:18px;padding:17px 20px 18px 150px;border-top:1px solid #ddd;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;}.actions .secondary-action{float:right;}.actions .secondary-action a{line-height:30px;}.actions .secondary-action a:hover{text-decoration:underline;} -.help-inline,.help-block{font-size:12px;line-height:18px;color:#bfbfbf;} +.help-inline,.help-block{font-size:11px;line-height:18px;color:#bfbfbf;} .help-inline{padding-left:5px;*position:relative;*top:-5px;} .help-block{display:block;max-width:600px;} .inline-inputs{color:#808080;}.inline-inputs span,.inline-inputs input{display:inline-block;} @@ -156,7 +156,7 @@ input[disabled],select[disabled],textarea[disabled],input[readonly],select[reado .input-append input{float:left;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;} .input-append .add-on{-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;border-right-width:1px;border-left-width:0;} .inputs-list{margin:0 0 5px;width:100%;}.inputs-list li{display:block;padding:0;width:100%;}.inputs-list li label{display:block;float:none;width:auto;padding:0;line-height:18px;text-align:left;white-space:normal;}.inputs-list li label strong{color:#808080;} -.inputs-list li label small{font-size:12px;font-weight:normal;} +.inputs-list li label small{font-size:11px;font-weight:normal;} .inputs-list li ul.inputs-list{margin-left:25px;margin-bottom:10px;padding-top:0;} .inputs-list li:first-child{padding-top:5px;} .inputs-list input[type=radio],.inputs-list input[type=checkbox]{margin-bottom:0;} diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index f72cd39530c22cfae6c7a5427c2d0e584a5440d6..d466561036d2f3f54d87fde4fa5430877c22ac86 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -151,10 +151,8 @@ div.quickstart form textarea { } /* Render mini layout previews -------------------------------------------------- */ -div.mini-layout { - height: 340px; - margin-bottom: 20px; - padding: 9px; +.diagram, +.mini-layout { border: 1px solid #ccc; -webkit-border-radius: 6px; -moz-border-radius: 6px; @@ -163,28 +161,36 @@ div.mini-layout { -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125); } -div.mini-layout div { +.diagram { + padding: 4px; +} +.mini-layout { + height: 340px; + margin-bottom: 20px; + padding: 9px; +} +.mini-layout div { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } -div.mini-layout div.mini-layout-body { +.mini-layout .mini-layout-body { background-color: #dceaf4; margin: 0 auto; width: 340px; height: 340px; } -div.mini-layout.fluid div.mini-layout-sidebar, -div.mini-layout.fluid div.mini-layout-header, -div.mini-layout.fluid div.mini-layout-body { +.mini-layout.fluid .mini-layout-sidebar, +.mini-layout.fluid .mini-layout-header, +.mini-layout.fluid .mini-layout-body { float: left; } -div.mini-layout.fluid div.mini-layout-sidebar { +.mini-layout.fluid .mini-layout-sidebar { background-color: #bbd8e9; width: 90px; height: 340px; } -div.mini-layout.fluid div.mini-layout-body { +.mini-layout.fluid .mini-layout-body { width: 300px; margin-left: 10px; } diff --git a/docs/assets/img/example-diagram-01.png b/docs/assets/img/example-diagram-01.png new file mode 100644 index 0000000000000000000000000000000000000000..16ac0c44ee5d1b4eeff1ad556742030d77ae05d7 Binary files /dev/null and b/docs/assets/img/example-diagram-01.png differ diff --git a/docs/assets/img/example-diagram-02.png b/docs/assets/img/example-diagram-02.png new file mode 100644 index 0000000000000000000000000000000000000000..90c30e6a137e87ed2859766e5e193b29f3300bc5 Binary files /dev/null and b/docs/assets/img/example-diagram-02.png differ diff --git a/docs/assets/img/example-diagram-03.png b/docs/assets/img/example-diagram-03.png new file mode 100644 index 0000000000000000000000000000000000000000..00401e0b16fc3d807796e8f60fc7e5755e5f8919 Binary files /dev/null and b/docs/assets/img/example-diagram-03.png differ diff --git a/docs/index.html b/docs/index.html index 1c880964552c48e7822e1351d6725e538a819aef..7531807fdd325c1d945f37f5657e0eb9bc9847c8 100644 --- a/docs/index.html +++ b/docs/index.html @@ -110,13 +110,13 @@ <h1>About Bootstrap <small>Brief history, browser support, and more</small></h1> </div> <div class="row"> - <div class="span6 columns"> + <div class="span-one-third"> <h3>History</h3> <p>In the earlier days of Twitter, engineers used almost any library they were familiar with to meet front-end requirements. Bootstrap began as an answer to the challenges that presented and development quickly accelerated during Twitter’s first Hackweek.</p> <p>With the help and feedback of many engineers at Twitter, Bootstrap has grown significantly to encompass not only basic styles, but more elegant and durable front-end design patterns.</p> <p>Read more on <a href="https://dev.twitter.com/blog/bootstrap-twitter">dev.twitter.com ›</a></p> </div> - <div class="span5 columns"> + <div class="span-one-third"> <h3>Browser support</h3> <p>Bootstrap is tested and supported in major modern browsers like Chrome, Safari, Internet Explorer, and Firefox.</p> <img src="assets/img/browsers.png" width="258px" height="48px" alt="Tested and supported in Chrome, Safari, Internet Explorer, and Firefox"> @@ -128,7 +128,7 @@ <li>Opera 11</li> </ul> </div> - <div class="span5 columns"> + <div class="span-one-third"> <h3>What's included</h3> <p>Bootstrap comes complete with compiled CSS, uncompiled, and example templates.</p> <ul> @@ -139,6 +139,29 @@ </ul> </div> </div><!-- /row --> + + <div class="row"> + <div class="span12"> + <h3>Quick-start examples</h3> + <p>Need some quick templates? Check out these basic examples we've put together:</p> + + <div class="row"> + <div class="span4"> + <img src="assets/img/example-diagram-01.png" class="diagram" alt="Simple three-column layout with hero unit"> + </div> + <div class="span4"> + <img src="assets/img/example-diagram-02.png" class="diagram" alt="Fluid layout with static sidebar"> + </div> + <div class="span4"> + <img src="assets/img/example-diagram-03.png" class="diagram" alt="Simple hanging container for apps"> + </div> + </div> + </div> + <div class="span4"> + <h3>Theming Bootstrap</h3> + <p>Starting with v1.3.0, Bootstrap comes equipped with a customizable Less file, Theme.less. It's designed to replace default values in the library and provide a one-stop-shop for adding-on.</p> + </div> + </div><!-- /row --> </section> diff --git a/lib/forms.less b/lib/forms.less index 5f8a09693eed253f9818fb8cf8c997d19908131f..99177138a482935350bad9d7d1e2d5c7d87fdefd 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -17,7 +17,7 @@ fieldset { legend { display: block; margin-left: 150px; - font-size: 20px; + font-size: @basefont * 1.5; line-height: 1; *margin: 0 0 5px 145px; /* IE6-7 */ *line-height: 1.5; /* IE6-7 */ @@ -69,7 +69,7 @@ select, width: 210px; height: @baseline; padding: 4px; - font-size: 13px; + font-size: @basefont; line-height: @baseline; color: @gray; border: 1px solid #ccc; @@ -253,7 +253,7 @@ textarea[readonly] { // Help Text .help-inline, .help-block { - font-size: 12px; + font-size: @basefont - 2; line-height: @baseline; color: @grayLight; } @@ -351,7 +351,7 @@ textarea[readonly] { color: @gray; } small { - font-size: 12px; + font-size: @basefont - 2; font-weight: normal; } } diff --git a/lib/theme.less b/lib/theme.less index 84102ef04ee88dab01aba8db162fa61b02480010..1442819ccc5f826419315d163dce01d8cf5144e6 100644 --- a/lib/theme.less +++ b/lib/theme.less @@ -19,34 +19,44 @@ // Font face, size, weight, and more ----------------------------------------- +// ------------------------------------- @baseFontSize: 13px; // base font-size @baseLineHeight: 18px; // base line-height of elements (incrementally increases with font-size) // Link color ------------------ +// --------------- @linkColor: #0069d6; // No need to specify a link hover color because we'll automatically do that for you in Preboot + + + + + + +// COMING SOON... +// -------------- + +@baseFontFace: "Helvetica"; + + // Primary button color --------------------------------- +// ----------------------------- @primaryButtonColor: #333; // Grid system ------------------------------------- +// --------------------------------- // Griditude @gridColumns: 16; @gridColumnWidth: 40px; @gridGutterWidth: 20px; -@siteWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); /* TODO: -- move primary button color here - add ability to set app/site-wide base font-face (need better variables: @baseFontSize, @baseFontFace, @baseLineHeight, etc) - make form inputs and tables apply the new global type changes (currently statically set) - add new docs section for examples