Skip to content

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

merge in master, resolve conflicts

parent 5cc933cc
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 615 additions and 477 deletions
bootstrap-1.0.0.css
View file @ a98d2ccc
This diff is collapsed.
bootstrap-1.0.0.min.css
View file @ a98d2ccc
This diff is collapsed.
docs/assets/css/docs.css
View file @ a98d2ccc
......@@ -195,6 +195,9 @@ div.topbar-wrapper {
div.topbar-wrapper div.topbar {
position: absolute;
margin: 0 -20px;
}
div.topbar-wrapper div.topbar .fill {
padding-left: 20px;
padding-right: 20px;
-webkit-border-radius: 4px;
......
docs/assets/js/application.js
View file @ a98d2ccc
......@@ -42,25 +42,12 @@ $(document).ready(function(){
// Dropdown example for topbar nav
// ===============================
$("body").bind("click", function(e) {
$("ul.menu-dropdown").hide();
$('a.menu').parent("li").removeClass("open").children("ul.menu-dropdown").hide();
$("body").bind("click", function (e) {
$('a.menu').parent("li").removeClass("open");
});
$("a.menu").click(function(e) {
var $target = $(this);
var $parent = $target.parent("li");
var $siblings = $target.siblings("ul.menu-dropdown");
var $parentSiblings = $parent.siblings("li");
if ($parent.hasClass("open")) {
$parent.removeClass("open");
$siblings.hide();
} else {
$parent.addClass("open");
$siblings.show();
}
$parentSiblings.children("ul.menu-dropdown").hide();
$parentSiblings.removeClass("open");
$("a.menu").click(function (e) {
var $li = $(this).parent("li").toggleClass('open');
return false;
});
......
docs/index.html
View file @ a98d2ccc
This diff is collapsed.
lib/forms.less
View file @ a98d2ccc
......@@ -23,7 +23,7 @@ form {
}
// Parent element that clears floats and wraps labels and fields together
div.clearfix {
.clearfix {
margin-bottom: @baseline;
}
......@@ -112,7 +112,7 @@ form {
}
// Error styles
div.error {
.error {
background: lighten(@red, 57%);
padding: 10px 0;
margin: -10px 0 10px;
......@@ -133,8 +133,8 @@ form {
.box-shadow(0 0 6px rgba(171,41,32,.5));
}
}
div.input-prepend,
div.input-append {
.input-prepend,
.input-append {
span.add-on {
background: lighten(@red, 50%);
border-color: @error-text;
......@@ -177,14 +177,14 @@ form {
}
// Actions (the buttons)
div.actions {
.actions {
background: #f5f5f5;
margin-top: @baseline;
margin-bottom: @baseline;
padding: (@baseline - 1) 20px @baseline 150px;
border-top: 1px solid #ddd;
.border-radius(0 0 3px 3px);
div.secondary-action {
.secondary-action {
float: right;
a {
line-height: 30px;
......@@ -213,7 +213,7 @@ div.actions {
}
// Inline Fields (input fields that appear as inline objects
div.inline-inputs {
.inline-inputs {
color: @gray;
span, input[type=text] {
display: inline-block;
......@@ -230,8 +230,8 @@ div.inline-inputs {
}
// Allow us to put symbols and text within the input field for a cleaner look
div.input-prepend,
div.input-append {
.input-prepend,
.input-append {
input[type=text] {
.border-radius(0 3px 3px 0);
}
......@@ -257,7 +257,7 @@ div.input-append {
border-color: @green;
}
}
div.input-append {
.input-append {
input[type=text] {
float: left;
.border-radius(3px 0 0 3px);
......@@ -270,7 +270,7 @@ div.input-append {
}
// Stacked options for forms (radio buttons or checkboxes)
ul.inputs-list {
.inputs-list {
margin: 0 0 5px;
width: 100%;
li {
......@@ -326,13 +326,13 @@ form.form-stacked {
line-height: 20px;
padding-top: 0;
}
div.clearfix {
.clearfix {
margin-bottom: @baseline / 2;
div.input {
margin-left: 0;
}
}
ul.inputs-list {
.inputs-list {
margin-bottom: 0;
li {
padding-top: 0;
......@@ -349,7 +349,7 @@ form.form-stacked {
margin-top: 0;
margin-left: -10px;
}
div.actions {
.actions {
margin-left: -20px;
padding-left: 20px;
}
......
lib/patterns.less
View file @ a98d2ccc
......@@ -7,7 +7,7 @@
// ------
// Topbar for Branding and Nav
div.topbar {
.topbar {
#gradient > .vertical(#333, #222);
height: 40px;
position: fixed;
......@@ -16,8 +16,14 @@ div.topbar {
right: 0;
z-index: 10000;
overflow: visible;
@shadow: 0 1px 3px rgba(0,0,0,.25), inset 0 -1px 0 rgba(0,0,0,.1);
.box-shadow(@shadow);
// gradient is applied to it's own element because overflow visible is not honored by ie when filter is present
.fill {
background:#222;
#gradient > .vertical(#333, #222);
@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 {
......@@ -35,15 +41,18 @@ div.topbar {
}
// Website name
h3 a {
float: left;
display: block;
padding: 8px 20px 12px;
margin-left: -20px; // negative indent to left-align the text down the page
color: @white;
font-size: 20px;
font-weight: 200;
line-height: 1;
h3 {
position:relative;
a {
float: left;
display: block;
padding: 8px 20px 12px;
margin-left: -20px; // negative indent to left-align the text down the page
color: @white;
font-size: 20px;
font-weight: 200;
line-height: 1;
}
}
// Search Form
......@@ -53,7 +62,7 @@ div.topbar {
position: relative;
.opacity(100);
input {
background-color: @grayLight;
background-color: #444;
background-color: rgba(255,255,255,.3);
#font > .sans-serif(13px, normal, 1);
width: 220px;
......@@ -73,11 +82,13 @@ div.topbar {
&::-webkit-input-placeholder {
color: @grayLighter;
}
// Hover states
&:hover {
background-color: #444;
background-color: @grayLight;
background-color: rgba(255,255,255,.5);
color: #fff;
}
// Focus states (we use .focused since IE8 and down doesn't support :focus)
&:focus,
&.focused {
outline: none;
......@@ -151,7 +162,7 @@ div.topbar {
&.open {
a.menu,
a:hover {
background-color: lighten(#00a0d1,5);
background-color: #444;
background-color: rgba(255,255,255,.1);
color: #fff;
}
......@@ -215,6 +226,7 @@ div.topbar {
&.divider {
height: 1px;
overflow: hidden;
background: #222;
background: rgba(0,0,0,.2);
border-bottom: 1px solid rgba(255,255,255,.1);
margin: 5px 0;
......@@ -261,7 +273,7 @@ div.topbar {
// PAGE HEADERS
// ------------
div.page-header {
.page-header {
margin-bottom: @baseline - 1;
border-bottom: 1px solid #ddd;
.box-shadow(0 1px 0 rgba(255,255,255,.5));
......@@ -275,14 +287,17 @@ div.page-header {
// ------------
// One-liner alert bars
div.alert-message {
.alert-message {
// TODO: Ask cloudhead how to do this fancy filter elegantly. Less eval is returning strings with quotes ;_;
#gradient > .vertical(transparent, rgba(0,0,0,0.15));
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#15000000')";
filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#15000000')";
background-color: @grayLighter;
margin-bottom: @baseline;
padding: 8px 15px;
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
border-bottom: 1px solid rgba(0,0,0,.25);
text-shadow: 0 -1px 0 rgba(0,0,0,.3);
border-bottom: 1px solid rgba(0,0,0,.3);
.border-radius(4px);
p {
color: #fff;
......@@ -292,44 +307,49 @@ div.alert-message {
}
}
&.error {
background-color: lighten(@red, 25%);
#gradient > .vertical(lighten(@red, 30%), lighten(@red, 15%));
border-bottom-color: lighten(@red, 5%);
}
&.warning {
background-color: lighten(@yellow, 15%);
#gradient > .vertical(lighten(@yellow, 25%), lighten(@yellow, 10%));
border-bottom-color: @yellow;
}
&.success {
background-color: lighten(@green, 15%);
#gradient > .vertical(lighten(@green, 25%), lighten(@green, 10%));
border-bottom-color: @green;
}
&.info {
background-color: lighten(@blue, 15%);
#gradient > .vertical(lighten(@blue, 25%), lighten(@blue, 5%));
border-bottom-color: @blue;
}
a.close {
.close {
float: right;
margin-top: -2px;
color: #fff;
color: #000;
font-size: 20px;
font-weight: bold;
text-shadow: 0 1px 0 rgba(0,0,0,.5);
.opacity(50);
.border-radius(3px);
text-shadow: 0 1px 0 rgba(255,255,255,1);
.opacity(20);
&:hover {
text-decoration: none;
.opacity(50);
.opacity(40);
}
}
}
// Block-level Alerts
div.block-message {
.block-message {
margin-bottom: @baseline;
padding: 14px;
color: @grayDark;
color: rgba(0,0,0,.8);
*color: @grayDark; /* IE 6-7 */
text-shadow: 0 1px 0 rgba(255,255,255,.25);
.border-radius(6px);
p {
color: @grayDark;
color: rgba(0,0,0,.8);
*color: @grayDark; /* IE 6-7 */
margin-right: 30px;
margin-bottom: 0;
}
......@@ -339,12 +359,6 @@ div.block-message {
strong {
display: block;
}
a.close {
display: block;
color: @grayDark;
color: rgba(0,0,0,.5);
text-shadow: 0 1px 1px rgba(255,255,255,.75);
}
&.error {
background: lighten(@red, 55%);
border: 1px solid lighten(@red, 50%);
......@@ -368,8 +382,8 @@ div.block-message {
// ----------
// Common tab and pill styles
ul.tabs,
ul.pills {
.tabs,
.pills {
margin: 0 0 20px;
padding: 0;
.clearfix();
......@@ -383,7 +397,7 @@ ul.pills {
}
// Basic Tabs
ul.tabs {
.tabs {
width: 100%;
border-bottom: 1px solid @grayLight;
li {
......@@ -409,7 +423,7 @@ ul.tabs {
}
// Basic pill nav
ul.pills {
.pills {
li {
a {
margin: 5px 3px 5px 0;
......@@ -436,22 +450,26 @@ ul.pills {
// PAGINATION
// ----------
div.pagination {
.pagination {
height: @baseline * 2;
margin: @baseline 0;
ul {
float: left;
margin: 0;
border: 1px solid #ddd;
border: 1px solid rgba(0,0,0,.15);
border-right: 0\9; /* IE8 and below don't support last child. TODO: clean this up; */
.border-radius(3px);
.box-shadow(0 1px 2px rgba(0,0,0,.075));
.box-shadow(0 1px 2px rgba(0,0,0,.05);
li {
display: inline;
a {
float: left;
padding: 0 14px;
line-height: (@baseline * 2) - 2;
border-right: 1px solid rgba(0,0,0,.15);
border-right: 1px solid;
border-right-color: #ddd;
border-right-color: rgba(0,0,0,.15);
text-decoration: none;
}
a:hover,
......@@ -490,7 +508,7 @@ div.pagination {
// MODALS
// ------
div.modal-backdrop {
.modal-backdrop {
background-color: rgba(0,0,0,.5);
position: fixed;
top: 0;
......@@ -499,7 +517,7 @@ div.modal-backdrop {
bottom: 0;
z-index: 1000;
}
div.modal {
.modal {
position: fixed;
top: 50%;
left: 50%;
......@@ -507,6 +525,7 @@ div.modal {
width: 560px;
margin: -280px 0 0 -250px;
background-color: @white;
border: 1px solid #999;
border: 1px solid rgba(0,0,0,.3);
.border-radius(6px);
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
......@@ -582,7 +601,7 @@ div.modal {
// TWIPSY
// ------
div.twipsy {
.twipsy {
display: block;
position: absolute;
visibility: visible;
......@@ -631,7 +650,8 @@ div.twipsy {
height: 0;
}
.inner {
background: rgba(0,0,0,.8);
background-color: #333;
background-color: rgba(0,0,0,.8);
padding: 3px;
overflow: hidden;
width: 280px;
......@@ -639,7 +659,7 @@ div.twipsy {
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
}
.title {
background: #f5f5f5;
background-color: #f5f5f5;
padding: 9px 15px;
line-height: 1;
.border-radius(3px 3px 0 0);
......
lib/preboot.less
View file @ a98d2ccc
......@@ -20,6 +20,7 @@
// Accent Colors
@blue: #049CDB;
@blueDark: #0064CD;
@green: #46a546;
@red: #9d261d;
@yellow: #ffc40d;
......@@ -188,8 +189,9 @@
color: @textColor;
font-size: @fontSize;
line-height: @baseline;
border: 1px solid darken(@color, 10%);
border-bottom-color: fadein(@borderColor, 15%);
border: 1px solid;
border-color: #ccc #ccc #bbb;
border-color: borderColor borderColor fadein(@borderColor, 15%);
.border-radius(@borderRadius);
@shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
.box-shadow(@shadow);
......@@ -222,8 +224,6 @@
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+
background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10
-ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor); // IE8+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE6 & IE7
background-image: linear-gradient(left, @startColor, @endColor); // Le standard
}
.vertical (@startColor: #555, @endColor: #333) {
......@@ -235,8 +235,6 @@
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+
background-image: -webkit-linear-gradient(@startColor, @endColor); // Safari 5.1+, Chrome 10+
background-image: -o-linear-gradient(@startColor, @endColor); // Opera 11.10
-ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor); // IE8+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE6 & IE7
background-image: linear-gradient(@startColor, @endColor); // The standard
}
.directional (@startColor: #555, @endColor: #333, @deg: 45deg) {
......
lib/scaffolding.less
View file @ a98d2ccc
......@@ -132,6 +132,8 @@ a {
//#gradient > .vertical(@blue, @blueDark);
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
border-color: @blueDark @blueDark darken(@blueDark, 15%);
border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) fadein(rgba(0,0,0,.1), 15%);
&:hover {
color: #fff;
}
......@@ -146,12 +148,18 @@ a {
padding-left: 9px;
font-size: 11px;
}
&:disabled,
&.disabled {
background-image: none;
.opacity(65);
cursor: default;
}
// this can't be included with the .disabled def because IE8 and below will drop it ;_;
&:disabled {
background-image: none;
.opacity(65);
cursor: default;
}
&:active {
@shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05);
.box-shadow(@shadow);
......
lib/tables.less
View file @ a98d2ccc
......@@ -11,12 +11,12 @@ table {
width: 100%;
margin-bottom: @baseline;
padding: 0;
text-align: left;
border-collapse: separate;
font-size: 13px;
th, td {
padding: 10px 10px 9px;
line-height: @baseline * .75;
text-align: left;
vertical-align: middle;
border-bottom: 1px solid #ddd;
}
......@@ -32,7 +32,7 @@ table {
// --------------
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
table.zebra-striped {
.zebra-striped {
tbody {
tr:nth-child(odd) td {
background-color: #f9f9f9;
......@@ -43,7 +43,7 @@ table.zebra-striped {
}
// Tablesorting styles w/ jQuery plugin
th.header {
.header {
cursor: pointer;
&:after {
content: "";
......@@ -55,36 +55,29 @@ table.zebra-striped {
visibility: hidden;
}
}
// Style the sorted column headers (THs)
th.headerSortUp,
th.headerSortDown {
.headerSortUp,
.headerSortDown {
background-color: rgba(141,192,219,.25);
text-shadow: 0 1px 1px rgba(255,255,255,.75);
.border-radius(3px 3px 0 0);
}
// Style the ascending (reverse alphabetical) column header
th.header:hover {
.header:hover {
&:after {
visibility:visible;
}
}
th.actions:hover {
background-image: none;
}
// Style the descending (alphabetical) column header
th.headerSortDown,
th.headerSortDown:hover {
.headerSortDown,
.headerSortDown:hover {
&:after {
visibility:visible;
.opacity(60);
}
}
// Style the ascending (reverse alphabetical) column header
th.headerSortUp {
.headerSortUp {
&:after {
border-bottom: none;
border-left: 4px solid transparent;
......@@ -95,58 +88,61 @@ table.zebra-striped {
.opacity(60);
}
}
}
table {
// Blue Table Headings
th.blue {
.blue {
color: @blue;
border-bottom-color: @blue;
}
th.headerSortUp.blue, th.headerSortDown.blue {
.headerSortUp.blue,
.headerSortDown.blue {
background-color: lighten(@blue, 40%);
}
// Green Table Headings
th.green {
.green {
color: @green;
border-bottom-color: @green;
}
th.headerSortUp.green, th.headerSortDown.green { // backround color is 20% of border color
.headerSortUp.green,
.headerSortDown.green {
background-color: lighten(@green, 40%);
}
// Red Table Headings
th.red {
.red {
color: @red;
border-bottom-color: @red;
}
th.headerSortUp.red, th.headerSortDown.red {
.headerSortUp.red,
.headerSortDown.red {
background-color: lighten(@red, 50%);
}
// Yellow Table Headings
th.yellow {
.yellow {
color: @yellow;
border-bottom-color: @yellow;
}
th.headerSortUp.yellow, th.headerSortDown.yellow {
.headerSortUp.yellow,
.headerSortDown.yellow {
background-color: lighten(@yellow, 40%);
}
// Orange Table Headings
th.orange {
.orange {
color: @orange;
border-bottom-color: @orange;
}
th.headerSortUp.orange, th.headerSortDown.orange {
.headerSortUp.orange,
.headerSortDown.orange {
background-color: lighten(@orange, 40%);
}
// Purple Table Headings
th.purple {
.purple {
color: @purple;
border-bottom-color: @purple;
}
th.headerSortUp.purple, th.headerSortDown.purple {
.headerSortUp.purple,
.headerSortDown.purple {
background-color: lighten(@purple, 40%);
}
}
}
\ No newline at end of file
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