From 946efe97cb03b1e0ed15f80a864377febf12a6cb Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Fri, 29 Jul 2011 14:24:27 -0700 Subject: fix up readme md --- README.md | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index ee1bfbb138..6c66a0c829 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,11 @@ TWITTER BASELINE ----------------- +================ + Bootstrap is Twitter's toolkit for kickstarting CSS for websites, apps, and more. It includes base CSS styles for typography, forms, buttons, tables, grids, navigation, alerts, and more. -== Usage == +Usage +----- You can use Twitter Bootstrap in one of two ways: just drop the compiled CSS into any new project and start cranking, or run LESS on your site and compile on the fly like a boss. @@ -19,12 +21,14 @@ Or if you prefer, the standard css way: For more info, refer to the docs! -== Reporting bugs == +Reporting bugs +-------------- Please create an issue here on github! :P -== AUTHORS == +AUTHORS +------- **Mark Otto** http://twitter.com/mdo @@ -33,7 +37,8 @@ http://twitter.com/mdo http://twitter.com/fat -== Copyright and License == +Copyright and License +--------------------- Copyright 2011 Twitter, Inc. -- cgit v1.2.3 From a480e0f3f354fe997616890fe8ac8a9b424501ea Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Fri, 29 Jul 2011 14:26:33 -0700 Subject: add github links --- README.md | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 6c66a0c829..f93e67d6c5 100644 --- a/README.md +++ b/README.md @@ -31,10 +31,14 @@ AUTHORS ------- **Mark Otto** -http://twitter.com/mdo + ++ http://twitter.com/mdo ++ http://github.com/markdotto **Jacob Thornton** -http://twitter.com/fat + ++ http://twitter.com/fat ++ http://github.com/fat Copyright and License -- cgit v1.2.3 From 5eb962faea0ef05392ba9109546d5d9fda07aa43 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Fri, 29 Jul 2011 14:28:37 -0700 Subject: Boostrap lulz --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index f93e67d6c5..833c6f3610 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ -TWITTER BASELINE -================ +TWITTER BOOTSTRAP +================= Bootstrap is Twitter's toolkit for kickstarting CSS for websites, apps, and more. It includes base CSS styles for typography, forms, buttons, tables, grids, navigation, alerts, and more. -- cgit v1.2.3 From 6d0b083b7d594d3b8caa4b820a3712a5e3cc91c8 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Tue, 16 Aug 2011 22:58:01 -0700 Subject: update whitspace and comment styles --- README.md | 1 - bootstrap-1.0.0.css | 28 +++++++--------------------- lib/bootstrap.less | 3 ++- lib/forms.less | 22 +++++++++++++++++----- lib/patterns.less | 35 ++++++++++++++++++++++++----------- lib/preboot.less | 8 +++----- lib/reset.less | 21 +++++++++++---------- lib/scaffolding.less | 20 +++++++++++--------- lib/tables.less | 43 +++++++++++++++++++++++++++++-------------- lib/type.less | 10 +++++----- 10 files changed, 109 insertions(+), 82 deletions(-) diff --git a/README.md b/README.md index 833c6f3610..c6556ea9c2 100644 --- a/README.md +++ b/README.md @@ -26,7 +26,6 @@ Reporting bugs Please create an issue here on github! :P - AUTHORS ------- diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css index 77a7276422..fc8f7359ac 100644 --- a/bootstrap-1.0.0.css +++ b/bootstrap-1.0.0.css @@ -6,12 +6,11 @@ * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world @twitter by @mdo and @fat. - * Date: Fri Jul 29 13:03:43 PDT 2011 + * Date: Tue Aug 16 22:54:18 PDT 2011 */ -/* - * Reset.less +/* 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). - */ + * ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ html, body { margin: 0; padding: 0; @@ -125,9 +124,7 @@ aside { /* * Scaffolding * Basic and global styles for generating a grid system, structural layout, and page templates - */ -/* Baseline Grid System --------------------------------------------------- */ + * ------------------------------------------------------------------------------------------- */ .row { zoom: 1; } @@ -338,8 +335,6 @@ aside { .row .offset12:first-child { margin-left: 720px !important; } -/* Structural Layout --------------------------------------------------- */ html, body { background-color: #fff; } @@ -376,8 +371,6 @@ div.container-fluid div.content { max-width: 1180px; margin-left: 240px; } -/* Base Styles --------------------------------------------------- */ a { color: #0069d6; text-decoration: none; @@ -639,12 +632,9 @@ pre { border-radius: 3px; white-space: pre-wrap; } -/* - * Forms.less +/* Forms.less * Base styles for various input types, form layouts, and states - */ -/* Global form styles --------------------------------------------------- */ + * ------------------------------------------------------------- */ form { margin-bottom: 18px; } @@ -981,9 +971,7 @@ form.form-stacked div.actions { /* * Tables.less * Tables for, you guessed it, tabular data - */ -/* Baseline styles --------------------------------------------------- */ + * ---------------------------------------- */ table { width: 100%; margin-bottom: 18px; @@ -1003,8 +991,6 @@ table th { font-weight: bold; border-bottom-width: 2px; } -/* Zebra-striping --------------------------------------------------- */ table.zebra-striped tbody tr:nth-child(odd) td { background-color: #f9f9f9; } diff --git a/lib/bootstrap.less b/lib/bootstrap.less index ead0c8f832..28ac8cbfe7 100644 --- a/lib/bootstrap.less +++ b/lib/bootstrap.less @@ -20,4 +20,5 @@ @import "type.less"; @import "forms.less"; @import "tables.less"; -@import "patterns.less"; \ No newline at end of file +@import "patterns.less"; + diff --git a/lib/forms.less b/lib/forms.less index 4a1c359e35..f958693fc4 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -1,14 +1,14 @@ -/* - * Forms.less +/* Forms.less * Base styles for various input types, form layouts, and states - */ + * ------------------------------------------------------------- */ -/* Global form styles --------------------------------------------------- */ +// FORM STYLES +// ----------- form { margin-bottom: @baseline; + // Groups of fields with labels on top (legends) fieldset { margin-bottom: @baseline; @@ -21,14 +21,17 @@ form { color: @grayDark; } } + // Parent element that clears floats and wraps labels and fields together div.clearfix { margin-bottom: @baseline; } + // Set font for forms label, input, select, textarea { #font > .sans-serif(normal,13px,normal); } + // Float labels left label { padding-top: 6px; @@ -39,15 +42,18 @@ form { text-align: right; color: @grayDark; } + // Shift over the inside div to align all label's relevant content div.input { margin-left: 150px; } + // Checkboxs and radio buttons input[type=checkbox], input[type=radio] { cursor: pointer; } + // Inputs, Textareas, Selects input[type=text], input[type=password], @@ -79,6 +85,7 @@ form { border-color: #ccc; .box-shadow(inset 0 1px 2px rgba(0,0,0,.075)); } + // Placeholder text gets special styles; can't be bundled together though for some reason :-moz-placeholder { color: @grayLight; @@ -86,6 +93,7 @@ form { ::-webkit-input-placeholder { color: @grayLight; } + // Focus states input[type=text], input[type=password], @@ -102,6 +110,7 @@ form { @shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); .box-shadow(@shadow); } + // Error styles div.error { background: lighten(@red, 57%); @@ -133,6 +142,7 @@ form { } } } + // Form element sizes .input-mini, input.mini, textarea.mini, select.mini { width: 60px; @@ -155,6 +165,7 @@ form { textarea.xxlarge { overflow-y: scroll; } + // Turn off focus for disabled (read-only) form elements input[readonly]:focus, textarea[readonly]:focus, @@ -194,6 +205,7 @@ div.actions { .help-inline { padding-left: 5px; } + // Big blocks of help text .help-block { display: block; diff --git a/lib/patterns.less b/lib/patterns.less index 2163218f6f..a60a9baab3 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -2,7 +2,8 @@ * Repeatable UI elements outside the base styles provided from the scaffolding * ---------------------------------------------------------------------------- */ -// Topbar + +// TOPBAR // ------ // Topbar for Branding and Nav @@ -17,11 +18,13 @@ div.topbar { overflow: visible; @shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1); .box-shadow(@shadow); + // Links get text shadow a { color: @grayLight; text-shadow: 0 -1px 0 rgba(0,0,0,.25); } + // Hover and active states for links ul li a:hover, ul li.active a, @@ -31,6 +34,7 @@ div.topbar { color: @white; text-decoration: none; } + // Logo a.logo { float: left; @@ -46,6 +50,7 @@ div.topbar { margin-right: 6px; } } + // Search Form form { float: left; @@ -65,6 +70,7 @@ div.topbar { @shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0px rgba(255,255,255,.25); .box-shadow(@shadow); .transition(none); + // Placeholder text gets special styles; can't be bundled together though for some reason &:-moz-placeholder { color: @grayLighter; @@ -89,6 +95,7 @@ div.topbar { } } } + // Navigation ul { display: block; @@ -120,6 +127,7 @@ div.topbar { background-color: rgba(0,0,0,.5); } } + // Dropdowns &.primary-nav li ul { left: 0; @@ -207,6 +215,7 @@ div.topbar { color: #fff; } } + // Dividers (basically an hr) &.divider { height: 1px; @@ -215,6 +224,7 @@ div.topbar { border-bottom: 1px solid rgba(255,255,255,.1); margin: 5px 0; } + // Section separaters span { clear: both; @@ -230,7 +240,8 @@ div.topbar { } } -// Page Headers + +// PAGE HEADERS // ------------ div.page-header { @@ -243,7 +254,7 @@ div.page-header { } -// Error Styles +// ERROR STYLES // ------------ // One-liner alert bars @@ -336,7 +347,7 @@ div.block-message { } -// Navigation +// NAVIGATION // ---------- // Common tab and pill styles @@ -353,6 +364,7 @@ ul.pills { } } } + // Basic Tabs ul.tabs { width: 100%; @@ -378,6 +390,7 @@ ul.tabs { } } } + // Basic pill nav ul.pills { li { @@ -403,8 +416,8 @@ ul.pills { } -// Pagination -// -------------------------------------------------- +// PAGINATION +// ---------- div.pagination { height: @baseline * 2; @@ -442,7 +455,7 @@ div.pagination { } -// Wells +// WELLS // ----- div.well { @@ -456,7 +469,7 @@ div.well { } -// Modals +// MODALS // ------ div.modal-backdrop { @@ -510,7 +523,7 @@ div.modal { } -// Popover Arrows +// POPOVER ARROWS // -------------- #popoverArrow { @@ -548,7 +561,7 @@ div.modal { } } -// Twipsy +// TWIPSY // ------ div.twipsy { @@ -580,7 +593,7 @@ div.twipsy { } -// Popovers +// POPOVERS // -------- .popover { diff --git a/lib/preboot.less b/lib/preboot.less index 416ce35bcd..e7d5cad685 100644 --- a/lib/preboot.less +++ b/lib/preboot.less @@ -2,7 +2,8 @@ * Variables and mixins to pre-ignite any new web development project * ------------------------------------------------------------------ */ -// Variables + +// VARIABLES // --------- // Links @@ -37,10 +38,7 @@ @gridGutterWidth: 20px; @siteWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); - // Color Scheme -// ------------ - @baseColor: @blue; // Set a base color @complement: spin(@baseColor, 180); // Determine a complementary color @split1: spin(@baseColor, 158); // Split complements @@ -53,7 +51,7 @@ @analog2: spin(@baseColor, -22); -// Mixins +// MIXINS // ------ // Clearfix for clearing floats like a boss diff --git a/lib/reset.less b/lib/reset.less index 0a3901b4de..db1682202b 100644 --- a/lib/reset.less +++ b/lib/reset.less @@ -1,20 +1,21 @@ -/* - * Reset.less +/* 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). - */ + * ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ + + +// ERIC MEYER RESET +// ---------------- -// Eric Meyer reset html, body { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: normal; font-style: normal; font-size: 100%; line-height: 1; font-family: inherit; } table { border-collapse: collapse; border-spacing: 0; } ol, ul { list-style: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; } + // HTML5 -header, -section, -footer, -article, -aside { +// ----- + +header, section, footer, article, aside { display: block; -} +} \ No newline at end of file diff --git a/lib/scaffolding.less b/lib/scaffolding.less index f1db31c7cf..427dab2b89 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -1,14 +1,15 @@ /* * Scaffolding * Basic and global styles for generating a grid system, structural layout, and page templates - */ + * ------------------------------------------------------------------------------------------- */ -/* Baseline Grid System --------------------------------------------------- */ + +// GRID SYSTEM +// ----------- .row { .clearfix(); - + // Default columns .span1 { .columns(1); } .span2 { .columns(2); } @@ -26,7 +27,7 @@ .span14 { .columns(14); } .span15 { .columns(15); } .span16 { .columns(16); } - + // Offset column options .offset1 { .offset(1); } .offset2 { .offset(2); } @@ -43,8 +44,8 @@ } -/* Structural Layout --------------------------------------------------- */ +// STRUCTURAL LAYOUT +// ----------------- html, body { background-color: #fff; @@ -78,8 +79,8 @@ div.container-fluid { } -/* Base Styles --------------------------------------------------- */ +// BASE STYLES +// ----------- // Links a { @@ -125,6 +126,7 @@ a { .box-shadow(@shadow); } } + // Help Firefox not be a jerk about adding extra padding to buttons button.btn, input[type=submit].btn { diff --git a/lib/tables.less b/lib/tables.less index 7c315ff35e..02d110eb03 100644 --- a/lib/tables.less +++ b/lib/tables.less @@ -1,11 +1,11 @@ /* * Tables.less * Tables for, you guessed it, tabular data - */ + * ---------------------------------------- */ -/* Baseline styles --------------------------------------------------- */ +// BASELINE STYLES +// --------------- table { width: 100%; @@ -28,8 +28,8 @@ table { } -/* Zebra-striping --------------------------------------------------- */ +// ZEBRA-STRIPING +// -------------- // Default zebra-stripe styles (alternating gray and transparent backgrounds) table.zebra-striped { @@ -41,8 +41,9 @@ table.zebra-striped { background-color: #f5f5f5; } } + // Tablesorting styles w/ jQuery plugin - th.header { // For tablesorter tables, make THs have a pointer on hover + th.header { cursor: pointer; &:after { width: 0px; @@ -61,13 +62,17 @@ table.zebra-striped { .opacity(30); } } + + // Style the sorted column headers (THs) th.headerSortUp, - th.headerSortDown { // Style the sorted column headers (THs) + th.headerSortDown { background-color: rgba(141,192,219,.25); text-shadow: 0 1px 1px rgba(255,255,255,.75); .border-radius(3px 3px 0 0); } - th.header:hover { // Style the ascending (reverse alphabetical) column header + + // Style the ascending (reverse alphabetical) column header + th.header:hover { &:after { visibility:visible; } @@ -75,14 +80,18 @@ table.zebra-striped { th.actions:hover { background-image: none; } + + // Style the descending (alphabetical) column header th.headerSortDown, - th.headerSortDown:hover { // Style the descending (alphabetical) column header + th.headerSortDown:hover { &:after { visibility:visible; .opacity(60); } } - th.headerSortUp { // Style the ascending (reverse alphabetical) column header + + // Style the ascending (reverse alphabetical) column header + th.headerSortUp { &:after { border-bottom: none; border-left: 4px solid transparent; @@ -93,6 +102,7 @@ table.zebra-striped { .opacity(60); } } + // Blue Table Headings th.blue { color: @blue; @@ -101,6 +111,7 @@ table.zebra-striped { th.headerSortUp.blue, th.headerSortDown.blue { background-color: lighten(@blue, 40%); } + // Green Table Headings th.green { color: @green; @@ -109,36 +120,40 @@ table.zebra-striped { th.headerSortUp.green, th.headerSortDown.green { // backround color is 20% of border color background-color: lighten(@green, 40%); } + // Red Table Headings th.red { color: @red; border-bottom-color: @red; } - th.headerSortUp.red, th.headerSortDown.red { // backround color is 20% of border color + th.headerSortUp.red, th.headerSortDown.red { background-color: lighten(@red, 50%); } + // Yellow Table Headings th.yellow { color: @yellow; border-bottom-color: @yellow; } - th.headerSortUp.yellow, th.headerSortDown.yellow { // backround color is 20% of border color + th.headerSortUp.yellow, th.headerSortDown.yellow { background-color: lighten(@yellow, 40%); } + // Orange Table Headings th.orange { color: @orange; border-bottom-color: @orange; } - th.headerSortUp.orange, th.headerSortDown.orange { // backround color is 20% of border color + th.headerSortUp.orange, th.headerSortDown.orange { background-color: lighten(@orange, 40%); } + // Purple Table Headings th.purple { color: @purple; border-bottom-color: @purple; } - th.headerSortUp.purple, th.headerSortDown.purple { // backround color is 20% of border color + th.headerSortUp.purple, th.headerSortDown.purple { background-color: lighten(@purple, 40%); } } diff --git a/lib/type.less b/lib/type.less index 2f2bcac42a..7d6b392596 100644 --- a/lib/type.less +++ b/lib/type.less @@ -3,7 +3,7 @@ * ---------------------------------------------------------------------------------------- */ -// Body text +// BODY TEXT // --------- p { @@ -15,7 +15,8 @@ p { } } -// Headings + +// HEADINGS // -------- h1, h2, h3, h4, h5, h6 { @@ -65,8 +66,7 @@ h6 { } - -// Colors +// COLORS // ------ // Unordered and Ordered lists @@ -108,7 +108,7 @@ dl { } } -// Misc +// MISC // ---- // Horizontal rules -- cgit v1.2.3 From 7ecfc99a1422e87c8295bae2494da0b59bc5af55 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Tue, 16 Aug 2011 23:07:35 -0700 Subject: remove ds_store add an ugly gitignore file. boo. --- .DS_Store | Bin 6148 -> 0 bytes .gitignore | 1 + docs/.DS_Store | Bin 6148 -> 0 bytes docs/assets/.DS_Store | Bin 6148 -> 0 bytes 4 files changed, 1 insertion(+) delete mode 100644 .DS_Store create mode 100644 .gitignore delete mode 100644 docs/.DS_Store delete mode 100644 docs/assets/.DS_Store diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index a8a6c98ff3..0000000000 Binary files a/.DS_Store and /dev/null differ diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000000..e43b0f9889 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.DS_Store diff --git a/docs/.DS_Store b/docs/.DS_Store deleted file mode 100644 index f199fc7b18..0000000000 Binary files a/docs/.DS_Store and /dev/null differ diff --git a/docs/assets/.DS_Store b/docs/assets/.DS_Store deleted file mode 100644 index 57b2f456a7..0000000000 Binary files a/docs/assets/.DS_Store and /dev/null differ -- cgit v1.2.3 From f53ddcc6fe1ff95d74e87bc2dcb754a96108789f Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Tue, 16 Aug 2011 23:14:09 -0700 Subject: add link to docs --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index c6556ea9c2..3031bbaf32 100644 --- a/README.md +++ b/README.md @@ -3,6 +3,8 @@ TWITTER BOOTSTRAP Bootstrap is Twitter's toolkit for kickstarting CSS for websites, apps, and more. It includes base CSS styles for typography, forms, buttons, tables, grids, navigation, alerts, and more. +To get started -- checkout (http://twitter.github.com/bootstrap)[]! + Usage ----- -- cgit v1.2.3 From 9ec3bdd2d88103095af9a8b773ce68f39ccd5a8c Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Tue, 16 Aug 2011 23:15:45 -0700 Subject: fix doc link in readme --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 3031bbaf32..2a3cfb48d7 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ TWITTER BOOTSTRAP Bootstrap is Twitter's toolkit for kickstarting CSS for websites, apps, and more. It includes base CSS styles for typography, forms, buttons, tables, grids, navigation, alerts, and more. -To get started -- checkout (http://twitter.github.com/bootstrap)[]! +To get started -- checkout http://twitter.github.com/bootstrap! Usage -- cgit v1.2.3 From 07837a1c47321e97dde4a816cb2cd246724e7481 Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Wed, 17 Aug 2011 11:31:20 -0700 Subject: update docs with gh-pages --- docs/index.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/docs/index.html b/docs/index.html index 358642e2be..1aa9491e4f 100644 --- a/docs/index.html +++ b/docs/index.html @@ -5,7 +5,7 @@ Twitter Bootstrap - + @@ -58,21 +58,21 @@
Hotlink the CSS

For the quickest and easiest start, just copy this snippet into your webpage.

- +
Use it with LESS

A fan of using LESS.js? No problem, just clone the repo and add these lines:

- +
Fork on GitHub

Download, fork, pull, file issues, and more with the official Bootstrap repo on Github.

-

Bootstrap on GitHub »

+

Bootstrap on GitHub »

-- cgit v1.2.3