diff --git a/bootstrap.css b/bootstrap.css index 92da336f65..75928c7490 100644 --- a/bootstrap.css +++ b/bootstrap.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: Thu Sep 29 02:20:34 PDT 2011 + * Date: Tue Oct 4 00:16:55 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). @@ -187,9 +187,8 @@ body { margin: 0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; - font-weight: normal; line-height: 18px; - color: #333333; + color: #404040; } .container { width: 940px; @@ -393,14 +392,14 @@ a:hover { * Headings, body text, lists, code, and more for a versatile and durable typography system * ---------------------------------------------------------------------------------------- */ p { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; - font-weight: normal; line-height: 18px; margin-bottom: 9px; } p small { font-size: 11px; - color: #777777; + color: #bfbfbf; } h1, h2, @@ -409,7 +408,7 @@ h4, h5, h6 { font-weight: bold; - color: #333333; + color: #404040; } h1 small, h2 small, @@ -417,7 +416,7 @@ h3 small, h4 small, h5 small, h6 small { - color: #777777; + color: #bfbfbf; } h1 { margin-bottom: 18px; @@ -455,7 +454,7 @@ h5 { h6 { font-size: 13px; line-height: 18px; - color: #777777; + color: #bfbfbf; text-transform: uppercase; } ul, ol { @@ -475,7 +474,7 @@ ol { } li { line-height: 18px; - color: #555555; + color: #808080; } ul.unstyled { list-style: none; @@ -508,7 +507,7 @@ em { line-height: inherit; } .muted { - color: #777777; + color: #bfbfbf; } blockquote { margin-bottom: 18px; @@ -526,7 +525,7 @@ blockquote small { font-size: 12px; font-weight: 300; line-height: 18px; - color: #777777; + color: #bfbfbf; } blockquote small:before { content: '\2014 \00A0'; @@ -538,7 +537,7 @@ address { } code, pre { padding: 0 3px 2px; - font-family: Monaco, Andale Mono, Courier New, monospace; + font-family: Menlo, Monaco, Andale Mono, Courier New, monospace; font-size: 12px; -webkit-border-radius: 3px; -moz-border-radius: 3px; @@ -577,7 +576,7 @@ legend { margin-bottom: 27px; font-size: 19.5px; line-height: 36px; - color: #333333; + color: #404040; border-bottom: 1px solid #eee; } label, @@ -592,7 +591,7 @@ textarea { label { display: block; margin-bottom: 5px; - color: #333333; + color: #404040; } input[type=checkbox], input[type=radio] { cursor: pointer; @@ -607,7 +606,7 @@ select, padding: 4px; font-size: 13px; line-height: 18px; - color: #555555; + color: #808080; border: 1px solid #ccc; -webkit-border-radius: 3px; -moz-border-radius: 3px; @@ -843,15 +842,15 @@ textarea[readonly] { cursor: not-allowed; } :-moz-placeholder { - color: #777777; + color: #bfbfbf; } ::-webkit-input-placeholder { - color: #777777; + color: #bfbfbf; } .help-text { margin-top: 5px; margin-bottom: 0; - color: #777777; + color: #bfbfbf; } .help-inline { display: inline; @@ -868,7 +867,7 @@ textarea[readonly] { max-width: 600px; } .inline-inputs { - color: #555555; + color: #808080; } .inline-inputs span, .inline-inputs input { display: inline-block; @@ -901,7 +900,7 @@ textarea[readonly] { margin-right: -1px; font-weight: normal; line-height: 18px; - color: #777777; + color: #bfbfbf; text-align: center; text-shadow: 0 1px 0 #ffffff; -webkit-border-radius: 3px 0 0 3px; @@ -1115,7 +1114,7 @@ table .headerSortUp.purple, table .headerSortDown.purple { overflow: visible; } .topbar a { - color: #777777; + color: #bfbfbf; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); } .topbar .brand a:hover, .topbar ul .active > a { @@ -1178,20 +1177,20 @@ table .headerSortUp.purple, table .headerSortDown.purple { transition: none; } .topbar input:-moz-placeholder { - color: #cccccc; + color: #e6e6e6; } .topbar input::-webkit-input-placeholder { - color: #cccccc; + color: #e6e6e6; } .topbar input:hover { - background-color: #777777; + background-color: #bfbfbf; background-color: rgba(255, 255, 255, 0.5); color: #ffffff; } .topbar input:focus, .topbar input.focused { outline: 0; background-color: #ffffff; - color: #333333; + color: #404040; text-shadow: 0 1px 0 #ffffff; border: 0; padding: 5px 10px; @@ -1363,7 +1362,7 @@ table .headerSortUp.purple, table .headerSortDown.purple { clear: both; font-weight: normal; line-height: 18px; - color: #555555; + color: #808080; text-shadow: 0 1px 0 #ffffff; } .topbar .dropdown-menu a:hover, .dropdown-menu a:hover { @@ -1377,7 +1376,7 @@ table .headerSortUp.purple, table .headerSortDown.purple { background-image: linear-gradient(top, #eeeeee, #dddddd); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0); - color: #333333; + color: #404040; text-decoration: none; -webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025); -moz-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025); @@ -1439,7 +1438,7 @@ table .headerSortUp.purple, table .headerSortDown.purple { border-color: #eee #eee #ddd; } .tabs > li.active > a { - color: #555555; + color: #808080; background-color: #ffffff; border: 1px solid #ddd; border-bottom-color: transparent; @@ -1518,10 +1517,10 @@ table .headerSortUp.purple, table .headerSortDown.purple { } .breadcrumb .divider { padding: 0 5px; - color: #777777; + color: #bfbfbf; } .breadcrumb .active a { - color: #333333; + color: #404040; } .hero-unit { background-color: #f5f5f5; @@ -1806,7 +1805,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { position: relative; padding: 7px 15px; margin-bottom: 18px; - color: #333333; + color: #404040; background-color: #eedc94; background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94)); background-image: -moz-linear-gradient(top, #fceec1, #eedc94); @@ -1868,13 +1867,13 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { margin-bottom: 0; } .alert-message.block-message li { - color: #333333; + color: #404040; } .alert-message.block-message .alert-actions { margin-top: 5px; } .alert-message.block-message.error, .alert-message.block-message.success, .alert-message.block-message.info { - color: #333333; + color: #404040; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); } .alert-message.block-message.error { @@ -1925,7 +1924,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { } .pagination .disabled a, .pagination .disabled a:hover { background-color: transparent; - color: #777777; + color: #bfbfbf; } .pagination .next a { border: 0; @@ -2195,7 +2194,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { } .label { padding: 1px 3px 2px; - background-color: #777777; + background-color: #bfbfbf; font-size: 9.75px; font-weight: bold; color: #ffffff; diff --git a/bootstrap.min.css b/bootstrap.min.css index a6052c7666..4ba50158e6 100644 --- a/bootstrap.min.css +++ b/bootstrap.min.css @@ -21,7 +21,7 @@ input[type="search"]{-webkit-appearance:textfield;-webkit-box-sizing:content-box input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;} textarea{overflow:auto;vertical-align:top;} html,body{background-color:#ffffff;} -body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;font-weight:normal;line-height:18px;color:#333333;} +body{margin:0;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:18px;color:#404040;} .container{width:940px;margin-left:auto;margin-right:auto;zoom:1;}.container:before,.container:after{display:table;content:"";zoom:1;*display:inline;} .container:after{clear:both;} .container-fluid{position:relative;min-width:940px;padding-left:20px;padding-right:20px;zoom:1;}.container-fluid:before,.container-fluid:after{display:table;content:"";zoom:1;*display:inline;} @@ -76,19 +76,19 @@ a{color:#0069d6;text-decoration:none;line-height:inherit;font-weight:inherit;}a: .span-two-thirds{width:620px;} .offset-one-third{margin-left:340px;} .offset-two-thirds{margin-left:660px;} -p{font-size:13px;font-weight:normal;line-height:18px;margin-bottom:9px;}p small{font-size:11px;color:#777777;} -h1,h2,h3,h4,h5,h6{font-weight:bold;color:#333333;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#777777;} +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:36px;}h2 small{font-size:14px;} h3{line-height:36px;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;} -h6{font-size:13px;line-height:18px;color:#777777;text-transform:uppercase;} +h6{font-size:13px;line-height:18px;color:#bfbfbf;text-transform:uppercase;} 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:#555555;} +li{line-height:18px;color:#808080;} ul.unstyled{list-style:none;margin-left:0;} dl{margin-bottom:18px;}dl dt,dl dd{line-height:18px;} dl dt{font-weight:bold;} @@ -96,19 +96,19 @@ dl dd{margin-left:9px;} hr{margin:20px 0 19px;border:0;border-bottom:1px solid #eee;} strong{font-style:inherit;font-weight:bold;} em{font-style:italic;font-weight:inherit;line-height:inherit;} -.muted{color:#777777;} +.muted{color:#bfbfbf;} blockquote{margin-bottom:18px;border-left:5px solid #eee;padding-left:15px;}blockquote p{font-size:14px;font-weight:300;line-height:18px;margin-bottom:0;} -blockquote small{display:block;font-size:12px;font-weight:300;line-height:18px;color:#777777;}blockquote small:before{content:'\2014 \00A0';} +blockquote small{display:block;font-size:12px;font-weight:300;line-height:18px;color:#bfbfbf;}blockquote small:before{content:'\2014 \00A0';} address{display:block;line-height:18px;margin-bottom:18px;} -code,pre{padding:0 3px 2px;font-family:Monaco, Andale Mono, Courier New, monospace;font-size:12px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} +code,pre{padding:0 3px 2px;font-family:Menlo, Monaco, Andale Mono, Courier New, monospace;font-size:12px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} code{background-color:#fee9cc;color:rgba(0, 0, 0, 0.75);padding:1px 3px;} pre{background-color:#f5f5f5;display:block;padding:8.5px;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;} -legend{display:block;width:100%;margin-bottom:27px;font-size:19.5px;line-height:36px;color:#333333;border-bottom:1px solid #eee;} +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:#333333;} +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:#555555;border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} +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=button],input[type=reset],input[type=submit]{width:auto;height:auto;} @@ -146,17 +146,17 @@ input[disabled],select[disabled],textarea[disabled],input[readonly],select[reado .has-error .input-prepend span.add-on,.has-error .input-append span.add-on{background:#f4c8c5;border-color:#c87872;color:#b9554d;} .form-actions{padding:17px 20px 18px;margin-top:18px;margin-bottom:18px;background-color:#f5f5f5;border-top:1px solid #ddd;} .uneditable-input{background-color:#ffffff;display:block;border-color:#eee;-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.025);cursor:not-allowed;} -:-moz-placeholder{color:#777777;} -::-webkit-input-placeholder{color:#777777;} -.help-text{margin-top:5px;margin-bottom:0;color:#777777;} +:-moz-placeholder{color:#bfbfbf;} +::-webkit-input-placeholder{color:#bfbfbf;} +.help-text{margin-top:5px;margin-bottom:0;color:#bfbfbf;} .help-inline{display:inline;padding-left:5px;*position:relative;*top:-5px;} .help-block{display:block;max-width:600px;} -.inline-inputs{color:#555555;}.inline-inputs span,.inline-inputs input{display:inline-block;} +.inline-inputs{color:#808080;}.inline-inputs span,.inline-inputs input{display:inline-block;} .inline-inputs input.mini{width:60px;} .inline-inputs input.small{width:90px;} .inline-inputs span{padding:0 2px 0 1px;} .input-prepend input,.input-append input{-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;} -.input-prepend .add-on,.input-append .add-on{position:relative;background:#f5f5f5;border:1px solid #ccc;z-index:2;float:left;display:block;width:auto;min-width:16px;height:18px;padding:4px 4px 4px 5px;margin-right:-1px;font-weight:normal;line-height:18px;color:#777777;text-align:center;text-shadow:0 1px 0 #ffffff;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;} +.input-prepend .add-on,.input-append .add-on{position:relative;background:#f5f5f5;border:1px solid #ccc;z-index:2;float:left;display:block;width:auto;min-width:16px;height:18px;padding:4px 4px 4px 5px;margin-right:-1px;font-weight:normal;line-height:18px;color:#bfbfbf;text-align:center;text-shadow:0 1px 0 #ffffff;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;} .input-prepend .active,.input-append .active{background:#a9dba9;border-color:#46a546;} .input-prepend .add-on{*margin-top:1px;} .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;} @@ -196,16 +196,16 @@ table .orange{color:#f89406;border-bottom-color:#f89406;} table .headerSortUp.orange,table .headerSortDown.orange{background-color:#fee9cc;} table .purple{color:#7a43b6;border-bottom-color:#7a43b6;} table .headerSortUp.purple,table .headerSortDown.purple{background-color:#e2d5f0;} -.topbar{height:40px;position:fixed;top:0;left:0;right:0;z-index:10000;overflow:visible;}.topbar a{color:#777777;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);} +.topbar{height:40px;position:fixed;top:0;left:0;right:0;z-index:10000;overflow:visible;}.topbar a{color:#bfbfbf;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);} .topbar .brand a:hover,.topbar ul .active>a{background-color:#333;background-color:rgba(255, 255, 255, 0.05);color:#ffffff;text-decoration:none;} .topbar .brand{float:left;display:block;padding:8px 20px 12px;margin-left:-20px;color:#ffffff;font-size:20px;font-weight:200;line-height:1;} .topbar p{margin:0;line-height:40px;}.topbar p a:hover{background-color:transparent;color:#ffffff;} .topbar form{float:left;margin:5px 0 0 0;position:relative;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;} .topbar form.pull-right{float:right;} -.topbar input{background-color:#444;background-color:rgba(255, 255, 255, 0.3);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:normal;font-weight:13px;line-height:1;padding:4px 9px;color:#ffffff;color:rgba(255, 255, 255, 0.75);border:1px solid #111;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0px rgba(255, 255, 255, 0.25);-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0px rgba(255, 255, 255, 0.25);box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0px rgba(255, 255, 255, 0.25);-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none;}.topbar input:-moz-placeholder{color:#cccccc;} -.topbar input::-webkit-input-placeholder{color:#cccccc;} -.topbar input:hover{background-color:#777777;background-color:rgba(255, 255, 255, 0.5);color:#ffffff;} -.topbar input:focus,.topbar input.focused{outline:0;background-color:#ffffff;color:#333333;text-shadow:0 1px 0 #ffffff;border:0;padding:5px 10px;-webkit-box-shadow:0 0 3px rgba(0, 0, 0, 0.15);-moz-box-shadow:0 0 3px rgba(0, 0, 0, 0.15);box-shadow:0 0 3px rgba(0, 0, 0, 0.15);} +.topbar input{background-color:#444;background-color:rgba(255, 255, 255, 0.3);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:normal;font-weight:13px;line-height:1;padding:4px 9px;color:#ffffff;color:rgba(255, 255, 255, 0.75);border:1px solid #111;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0px rgba(255, 255, 255, 0.25);-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0px rgba(255, 255, 255, 0.25);box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1),0 1px 0px rgba(255, 255, 255, 0.25);-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none;}.topbar input:-moz-placeholder{color:#e6e6e6;} +.topbar input::-webkit-input-placeholder{color:#e6e6e6;} +.topbar input:hover{background-color:#bfbfbf;background-color:rgba(255, 255, 255, 0.5);color:#ffffff;} +.topbar input:focus,.topbar input.focused{outline:0;background-color:#ffffff;color:#404040;text-shadow:0 1px 0 #ffffff;border:0;padding:5px 10px;-webkit-box-shadow:0 0 3px rgba(0, 0, 0, 0.15);-moz-box-shadow:0 0 3px rgba(0, 0, 0, 0.15);box-shadow:0 0 3px rgba(0, 0, 0, 0.15);} .topbar-inner{background-color:#222;background-color:#222222;background-image:-khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));background-image:-moz-linear-gradient(top, #333333, #222222);background-image:-ms-linear-gradient(top, #333333, #222222);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));background-image:-webkit-linear-gradient(top, #333333, #222222);background-image:-o-linear-gradient(top, #333333, #222222);background-image:linear-gradient(top, #333333, #222222);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);} .nav{display:block;float:left;margin:0 10px 0 0;position:relative;left:0;}.nav>li{display:block;float:left;} .nav a{display:block;float:none;padding:10px 10px 11px;line-height:19px;text-decoration:none;}.nav a:hover{color:#ffffff;text-decoration:none;} @@ -222,14 +222,14 @@ table .headerSortUp.purple,table .headerSortDown.purple{background-color:#e2d5f0 .dropdown:hover .dropdown-toggle:after{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;} .dropdown-menu{background-color:#ffffff;float:left;display:none;position:absolute;top:40px;z-index:900;min-width:160px;max-width:220px;_width:160px;margin-left:0;margin-right:0;padding:6px 0;zoom:1;border-color:#999;border-color:rgba(0, 0, 0, 0.2);border-style:solid;border-width:0 1px 1px;-webkit-border-radius:0 0 6px 6px;-moz-border-radius:0 0 6px 6px;border-radius:0 0 6px 6px;-webkit-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);box-shadow:0 2px 4px rgba(0, 0, 0, 0.2);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.dropdown-menu li{float:none;display:block;background-color:none;} .dropdown-menu .divider{height:1px;margin:5px 0;overflow:hidden;background-color:#eee;border-bottom:1px solid #ffffff;} -.topbar .dropdown-menu a,.dropdown-menu a{display:block;padding:4px 15px;clear:both;font-weight:normal;line-height:18px;color:#555555;text-shadow:0 1px 0 #ffffff;}.topbar .dropdown-menu a:hover,.dropdown-menu a:hover{background-color:#dddddd;background-image:-khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));background-image:-moz-linear-gradient(top, #eeeeee, #dddddd);background-image:-ms-linear-gradient(top, #eeeeee, #dddddd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));background-image:-webkit-linear-gradient(top, #eeeeee, #dddddd);background-image:-o-linear-gradient(top, #eeeeee, #dddddd);background-image:linear-gradient(top, #eeeeee, #dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);color:#333333;text-decoration:none;-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);} +.topbar .dropdown-menu a,.dropdown-menu a{display:block;padding:4px 15px;clear:both;font-weight:normal;line-height:18px;color:#808080;text-shadow:0 1px 0 #ffffff;}.topbar .dropdown-menu a:hover,.dropdown-menu a:hover{background-color:#dddddd;background-image:-khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));background-image:-moz-linear-gradient(top, #eeeeee, #dddddd);background-image:-ms-linear-gradient(top, #eeeeee, #dddddd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));background-image:-webkit-linear-gradient(top, #eeeeee, #dddddd);background-image:-o-linear-gradient(top, #eeeeee, #dddddd);background-image:linear-gradient(top, #eeeeee, #dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);color:#404040;text-decoration:none;-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);} .dropdown.open .dropdown-toggle{color:#ffffff;background:#ccc;background:rgba(0, 0, 0, 0.3);} .dropdown.open .dropdown-menu{display:block;} .tabs,.pills{margin:0 0 20px;padding:0;list-style:none;zoom:1;}.tabs:before,.pills:before,.tabs:after,.pills:after{display:table;content:"";zoom:1;*display:inline;} .tabs:after,.pills:after{clear:both;} .tabs>li,.pills>li{float:left;}.tabs>li>a,.pills>li>a{display:block;} .tabs{float:left;width:100%;border-bottom:1px solid #ddd;}.tabs>li{position:relative;top:1px;}.tabs>li>a{padding:0 15px;margin-right:2px;line-height:36px;border:1px solid transparent;-webkit-border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0;}.tabs>li>a:hover{text-decoration:none;background-color:#eee;border-color:#eee #eee #ddd;} -.tabs>li.active>a{color:#555555;background-color:#ffffff;border:1px solid #ddd;border-bottom-color:transparent;} +.tabs>li.active>a{color:#808080;background-color:#ffffff;border:1px solid #ddd;border-bottom-color:transparent;} .tabs .dropdown-menu{top:35px;border-width:1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;} .tabs .dropdown-toggle:after{border-top-color:#999;margin-top:15px;margin-left:5px;} .tabs .open.dropdown .dropdown-toggle{border-color:#999;} @@ -240,8 +240,8 @@ table .headerSortUp.purple,table .headerSortDown.purple{background-color:#e2d5f0 .tab-content>*,.pill-content>*{display:none;} .tab-content>.active,.pill-content>.active{display:block;} .breadcrumb{margin:0 0 18px;padding:7px 14px;background-color:#f5f5f5;background-image:-khtml-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));background-image:-moz-linear-gradient(top, #ffffff, #f5f5f5);background-image:-ms-linear-gradient(top, #ffffff, #f5f5f5);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));background-image:-webkit-linear-gradient(top, #ffffff, #f5f5f5);background-image:-o-linear-gradient(top, #ffffff, #f5f5f5);background-image:linear-gradient(top, #ffffff, #f5f5f5);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);border:1px solid #ddd;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:inset 0 1px 0 #ffffff;-moz-box-shadow:inset 0 1px 0 #ffffff;box-shadow:inset 0 1px 0 #ffffff;}.breadcrumb li{display:inline;text-shadow:0 1px 0 #ffffff;} -.breadcrumb .divider{padding:0 5px;color:#777777;} -.breadcrumb .active a{color:#333333;} +.breadcrumb .divider{padding:0 5px;color:#bfbfbf;} +.breadcrumb .active a{color:#404040;} .hero-unit{background-color:#f5f5f5;margin-bottom:30px;padding:60px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;}.hero-unit h1{margin-bottom:0;font-size:60px;line-height:1;letter-spacing:-1px;} .hero-unit p{font-size:18px;font-weight:200;line-height:27px;} footer{margin-top:17px;padding-top:17px;border-top:1px solid #eee;} @@ -269,16 +269,16 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0; .btn-group .btn:last-child{-webkit-border-top-right-radius:4px;-moz-border-radius-topright:4px;border-top-right-radius:4px;-webkit-border-bottom-right-radius:4px;-moz-border-radius-bottomright:4px;border-bottom-right-radius:4px;} .btn-group .btn:hover,.btn-group .btn:focus,.btn-group .btn:active{z-index:2;} .close{float:right;color:#000000;font-size:20px;font-weight:bold;line-height:13.5px;text-shadow:0 1px 0 #ffffff;filter:alpha(opacity=20);-khtml-opacity:0.2;-moz-opacity:0.2;opacity:0.2;}.close:hover{color:#000000;text-decoration:none;filter:alpha(opacity=40);-khtml-opacity:0.4;-moz-opacity:0.4;opacity:0.4;} -.alert-message{position:relative;padding:7px 15px;margin-bottom:18px;color:#333333;background-color:#eedc94;background-image:-khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));background-image:-moz-linear-gradient(top, #fceec1, #eedc94);background-image:-ms-linear-gradient(top, #fceec1, #eedc94);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));background-image:-webkit-linear-gradient(top, #fceec1, #eedc94);background-image:-o-linear-gradient(top, #fceec1, #eedc94);background-image:linear-gradient(top, #fceec1, #eedc94);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);border-color:#eedc94 #eedc94 #e4c652;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);border-width:1px;border-style:solid;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);}.alert-message .close{*margin-top:3px;} +.alert-message{position:relative;padding:7px 15px;margin-bottom:18px;color:#404040;background-color:#eedc94;background-image:-khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));background-image:-moz-linear-gradient(top, #fceec1, #eedc94);background-image:-ms-linear-gradient(top, #fceec1, #eedc94);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));background-image:-webkit-linear-gradient(top, #fceec1, #eedc94);background-image:-o-linear-gradient(top, #fceec1, #eedc94);background-image:linear-gradient(top, #fceec1, #eedc94);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);border-color:#eedc94 #eedc94 #e4c652;border-color:rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);border-width:1px;border-style:solid;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.25);}.alert-message .close{*margin-top:3px;} .alert-message h5{line-height:18px;} .alert-message p{margin-bottom:0;} .alert-message div{margin-top:5px;margin-bottom:2px;line-height:28px;} .alert-message .btn{-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, 0.25);-moz-box-shadow:0 1px 0 rgba(255, 255, 255, 0.25);box-shadow:0 1px 0 rgba(255, 255, 255, 0.25);} .alert-message.block-message{background-image:none;background-color:#fdf5d9;filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);padding:14px;border-color:#fceec1;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}.alert-message.block-message ul,.alert-message.block-message p{margin-right:30px;} .alert-message.block-message ul{margin-bottom:0;} -.alert-message.block-message li{color:#333333;} +.alert-message.block-message li{color:#404040;} .alert-message.block-message .alert-actions{margin-top:5px;} -.alert-message.block-message.error,.alert-message.block-message.success,.alert-message.block-message.info{color:#333333;text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);} +.alert-message.block-message.error,.alert-message.block-message.success,.alert-message.block-message.info{color:#404040;text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);} .alert-message.block-message.error{background-color:#fddfde;border-color:#fbc7c6;} .alert-message.block-message.success{background-color:#d1eed1;border-color:#bfe7bf;} .alert-message.block-message.info{background-color:#ddf4fb;border-color:#c6edf9;} @@ -286,7 +286,7 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0; .pagination li{display:inline;} .pagination a{float:left;padding:0 14px;line-height:34px;border-right:1px solid;border-right-color:#ddd;border-right-color:rgba(0, 0, 0, 0.15);*border-right-color:#ddd;text-decoration:none;} .pagination a:hover,.pagination .active a{background-color:#c7eefe;} -.pagination .disabled a,.pagination .disabled a:hover{background-color:transparent;color:#777777;} +.pagination .disabled a,.pagination .disabled a:hover{background-color:transparent;color:#bfbfbf;} .pagination .next a{border:0;} .well{background-color:#f5f5f5;margin-bottom:20px;padding:19px;min-height:20px;border:1px solid #eee;border:1px solid rgba(0, 0, 0, 0.05);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);}.well blockquote{border-color:#ddd;border-color:rgba(0, 0, 0, 0.15);} .modal-backdrop{background-color:#000000;position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000;}.modal-backdrop.fade{opacity:0;} @@ -315,7 +315,7 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0; .popover .title{background-color:#f5f5f5;padding:9px 15px;line-height:1;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;border-bottom:1px solid #eee;} .popover .content{background-color:#ffffff;padding:14px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.popover .content p,.popover .content ul,.popover .content ol{margin-bottom:0;} .fade{-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-ms-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear;opacity:0;}.fade.in{opacity:1;} -.label{padding:1px 3px 2px;background-color:#777777;font-size:9.75px;font-weight:bold;color:#ffffff;text-transform:uppercase;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}.label.important{background-color:#c43c35;} +.label{padding:1px 3px 2px;background-color:#bfbfbf;font-size:9.75px;font-weight:bold;color:#ffffff;text-transform:uppercase;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}.label.important{background-color:#c43c35;} .label.warning{background-color:#f89406;} .label.success{background-color:#46a546;} .label.notice{background-color:#62cffc;} diff --git a/lib/forms.less b/lib/forms.less index 56325daa9c..b657e53d65 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -8,16 +8,16 @@ // Make all forms have space below them form { - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; } // Groups of fields with labels on top (legends) legend { display: block; width: 100%; - margin-bottom: @baseline * 1.5; - font-size: @basefont * 1.5; - line-height: @baseline * 2; + margin-bottom: @baseLineHeight * 1.5; + font-size: @baseFontSize * 1.5; + line-height: @baseLineHeight * 2; color: @grayDark; border-bottom: 1px solid #eee; } @@ -27,7 +27,7 @@ label, input, select, textarea { - #font > .sans-serif(normal,@basefont,@baseline); + #font > .sans-serif(normal,@baseFontSize,@baseLineHeight); } // Identify controls by their labels @@ -50,10 +50,10 @@ select, .uneditable-input { display: inline-block; width: 210px; - height: @baseline; + height: @baseLineHeight; padding: 4px; - font-size: @basefont; - line-height: @baseline; + font-size: @baseFontSize; + line-height: @baseLineHeight; color: @gray; border: 1px solid #ccc; .border-radius(3px); @@ -90,8 +90,8 @@ input[type=submit] { select, input[type=file] { - height: @baseline * 1.5; // In IE7, the height of the select element cannot be changed by height, only font-size - line-height: @baseline * 1.5; + height: @baseLineHeight * 1.5; // In IE7, the height of the select element cannot be changed by height, only font-size + line-height: @baseLineHeight * 1.5; *margin-top: 4px; /* For IE7, add top margin to align select with labels */ } @@ -200,7 +200,7 @@ textarea[readonly] { // Style the background of control-groups with errors .has-error { background: lighten(@red, 55%); - padding: (@baseline / 2) 0; + padding: (@baseLineHeight / 2) 0; margin: -10px 0 10px; .border-radius(4px); > label, @@ -234,9 +234,9 @@ textarea[readonly] { // ------------ .form-actions { - padding: (@baseline - 1) 20px @baseline; - margin-top: @baseline; - margin-bottom: @baseline; + padding: (@baseLineHeight - 1) 20px @baseLineHeight; + margin-top: @baseLineHeight; + margin-bottom: @baseLineHeight; background-color: #f5f5f5; border-top: 1px solid #ddd; } @@ -375,7 +375,7 @@ textarea[readonly] { // Margin to space out fieldsets .control-group { - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; } // Bold the labels so they stand out diff --git a/lib/mixins.less b/lib/mixins.less index 131d142783..c43f166328 100644 --- a/lib/mixins.less +++ b/lib/mixins.less @@ -46,25 +46,25 @@ // Font Stacks #font { - .shorthand(@weight: normal, @size: 14px, @lineHeight: 20px) { + .shorthand(@weight: normal, @size: @baseFontSize, @lineHeight: @baseLineHeight) { font-size: @size; font-weight: @weight; line-height: @lineHeight; } - .sans-serif(@weight: normal, @size: 14px, @lineHeight: 20px) { + .sans-serif(@weight: normal, @size: @baseFontSize, @lineHeight: @baseLineHeight) { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: @size; font-weight: @weight; line-height: @lineHeight; } - .serif(@weight: normal, @size: 14px, @lineHeight: 20px) { + .serif(@weight: normal, @size: @baseFontSize, @lineHeight: @baseLineHeight) { font-family: "Georgia", Times New Roman, Times, serif; font-size: @size; font-weight: @weight; line-height: @lineHeight; } - .monospace(@weight: normal, @size: 12px, @lineHeight: 20px) { - font-family: "Monaco", Courier New, monospace; + .monospace(@weight: normal, @size: @baseFontSize, @lineHeight: @baseLineHeight) { + font-family: Menlo, Monaco, Andale Mono, Courier New, monospace; font-size: @size; font-weight: @weight; line-height: @lineHeight; diff --git a/lib/patterns.less b/lib/patterns.less index 8add82c166..1b27b71847 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -313,7 +313,7 @@ > a { padding: 0 15px; margin-right: 2px; - line-height: @baseline * 2; + line-height: @baseLineHeight * 2; border: 1px solid transparent; .border-radius(4px 4px 0 0); &:hover { @@ -387,7 +387,7 @@ // ----------- .breadcrumb { - margin: 0 0 @baseline; + margin: 0 0 @baseLineHeight; padding: 7px 14px; #gradient > .vertical(#ffffff, #f5f5f5); border: 1px solid #ddd; @@ -424,12 +424,12 @@ p { font-size: 18px; font-weight: 200; - line-height: @baseline * 1.5; + line-height: @baseLineHeight * 1.5; } } footer { - margin-top: @baseline - 1; - padding-top: @baseline - 1; + margin-top: @baseLineHeight - 1; + padding-top: @baseLineHeight - 1; border-top: 1px solid #eee; } @@ -438,11 +438,11 @@ footer { // ------------ .page-header { - margin-bottom: @baseline - 1; + margin-bottom: @baseLineHeight - 1; border-bottom: 1px solid #ddd; .box-shadow(0 1px 0 rgba(255,255,255,.5)); h1 { - margin-bottom: (@baseline / 2) - 1px; + margin-bottom: (@baseLineHeight / 2) - 1px; } } @@ -488,7 +488,7 @@ footer { padding: 5px 14px 6px; text-shadow: 0 1px 1px rgba(255,255,255,.75); color: #333; - font-size: @basefont; + font-size: @baseFontSize; line-height: normal; border: 1px solid #ccc; border-bottom-color: #bbb; @@ -540,14 +540,14 @@ footer { // Button Sizes &.large { - font-size: @basefont + 2px; + font-size: @baseFontSize + 2px; line-height: normal; padding: 9px 14px 9px; .border-radius(6px); } &.small { padding: 7px 9px 7px; - font-size: @basefont - 2px; + font-size: @baseFontSize - 2px; } } // Super jank hack for removing border-radius from IE9 so we can keep filter gradients on alerts and buttons @@ -621,7 +621,7 @@ input[type=submit].btn { color: @black; font-size: 20px; font-weight: bold; - line-height: @baseline * .75; + line-height: @baseLineHeight * .75; text-shadow: 0 1px 0 rgba(255,255,255,1); .opacity(20); &:hover { @@ -639,7 +639,7 @@ input[type=submit].btn { .alert-message { position: relative; padding: 7px 15px; - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; color: @grayDark; .gradientBar(#fceec1, #eedc94); // warning by default text-shadow: 0 1px 0 rgba(255,255,255,.5); @@ -655,7 +655,7 @@ input[type=submit].btn { // Remove extra margin from content h5 { - line-height: @baseline; + line-height: @baseLineHeight; } p { margin-bottom: 0; @@ -715,8 +715,8 @@ input[type=submit].btn { // ---------- .pagination { - height: @baseline * 2; - margin: @baseline 0; + height: @baseLineHeight * 2; + margin: @baseLineHeight 0; ul { float: left; margin: 0; @@ -731,7 +731,7 @@ input[type=submit].btn { a { float: left; padding: 0 14px; - line-height: (@baseline * 2) - 2; + line-height: (@baseLineHeight * 2) - 2; border-right: 1px solid; border-right-color: #ddd; border-right-color: rgba(0,0,0,.15); @@ -972,7 +972,7 @@ input[type=submit].btn { .label { padding: 1px 3px 2px; background-color: @grayLight; - font-size: @basefont * .75; + font-size: @baseFontSize * .75; font-weight: bold; color: @white; text-transform: uppercase; diff --git a/lib/scaffolding.less b/lib/scaffolding.less index 26bb0cc059..b6852535c9 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -12,7 +12,9 @@ html, body { } body { margin: 0; - #font > .sans-serif(normal,@basefont,@baseline); + font-family: @baseFontFamily; + font-size: @baseFontSize; + line-height: @baseLineHeight; color: @grayDark; } diff --git a/lib/tables.less b/lib/tables.less index 988483f0ef..8a786ffd2a 100644 --- a/lib/tables.less +++ b/lib/tables.less @@ -9,16 +9,16 @@ table { width: 100%; - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; padding: 0; border-collapse: separate; // Done so we can round those corners! *border-collapse: collapse; /* IE7, collapse table to remove spacing */ - font-size: @basefont; + font-size: @baseFontSize; border: 1px solid #ddd; .border-radius(4px); th, td { padding: 10px 10px 9px; - line-height: @baseline; + line-height: @baseLineHeight; text-align: left; } th { diff --git a/lib/type.less b/lib/type.less index ea1f289e72..4232a24dff 100644 --- a/lib/type.less +++ b/lib/type.less @@ -7,10 +7,12 @@ // --------- p { - #font > .shorthand(normal,@basefont,@baseline); - margin-bottom: @baseline / 2; + font-family: @baseFontFamily; + font-size: @baseFontSize; + line-height: @baseLineHeight; + margin-bottom: @baseLineHeight / 2; small { - font-size: @basefont - 2; + font-size: @baseFontSize - 2; color: @grayLight; } } @@ -27,22 +29,22 @@ h1, h2, h3, h4, h5, h6 { } } h1 { - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; font-size: 30px; - line-height: @baseline * 2; + line-height: @baseLineHeight * 2; small { font-size: 18px; } } h2 { font-size: 24px; - line-height: @baseline * 2; + line-height: @baseLineHeight * 2; small { font-size: 14px; } } h3 { - line-height: @baseline * 2; + line-height: @baseLineHeight * 2; font-size: 18px; small { font-size: 14px; @@ -50,18 +52,18 @@ h3 { } h4 { font-size: 16px; - line-height: @baseline * 2; + line-height: @baseLineHeight * 2; small { font-size: 12px; } } h5 { font-size: 14px; - line-height: @baseline; + line-height: @baseLineHeight; } h6 { font-size: 13px; - line-height: @baseline; + line-height: @baseLineHeight; color: @grayLight; text-transform: uppercase; } @@ -72,7 +74,7 @@ h6 { // Unordered and Ordered lists ul, ol { - margin: 0 0 @baseline 25px; + margin: 0 0 @baseLineHeight 25px; } ul ul, ul ol, @@ -87,7 +89,7 @@ ol { list-style: decimal; } li { - line-height: @baseline; + line-height: @baseLineHeight; color: @gray; } ul.unstyled { @@ -97,15 +99,15 @@ ul.unstyled { // Description Lists dl { - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; dt, dd { - line-height: @baseline; + line-height: @baseLineHeight; } dt { font-weight: bold; } dd { - margin-left: @baseline / 2; + margin-left: @baseLineHeight / 2; } } @@ -135,16 +137,16 @@ em { // Blockquotes blockquote { - margin-bottom: @baseline; + margin-bottom: @baseLineHeight; border-left: 5px solid #eee; padding-left: 15px; p { - #font > .shorthand(300,14px,@baseline); + #font > .shorthand(300,14px,@baseLineHeight); margin-bottom: 0; } small { display: block; - #font > .shorthand(300,12px,@baseline); + #font > .shorthand(300,12px,@baseLineHeight); color: @grayLight; &:before { content: '\2014 \00A0'; @@ -155,14 +157,14 @@ blockquote { // Addresses address { display: block; - line-height: @baseline; - margin-bottom: @baseline; + line-height: @baseLineHeight; + margin-bottom: @baseLineHeight; } // Inline and block code styles code, pre { padding: 0 3px 2px; - font-family: Monaco, Andale Mono, Courier New, monospace; + font-family: Menlo, Monaco, Andale Mono, Courier New, monospace; font-size: 12px; .border-radius(3px); } @@ -174,9 +176,9 @@ code { pre { background-color: #f5f5f5; display: block; - padding: (@baseline - 1) / 2; - margin: 0 0 @baseline; - line-height: @baseline; + padding: (@baseLineHeight - 1) / 2; + margin: 0 0 @baseLineHeight; + line-height: @baseLineHeight; font-size: 12px; border: 1px solid #ccc; border: 1px solid rgba(0,0,0,.15); diff --git a/lib/variables.less b/lib/variables.less index dcb0a8ebf0..864dbe8c03 100644 --- a/lib/variables.less +++ b/lib/variables.less @@ -3,19 +3,27 @@ * ----------------------------------------------------- */ -// Links +// LINK COLORS +// ----------- + @linkColor: #0069d6; @linkColorHover: darken(@linkColor, 15); -// Grays + +// GRAYS +// ----- + @black: #000; -@grayDark: #333; -@gray: #555; -@grayLight: #777; -@grayLighter: #ccc; +@grayDark: lighten(@black, 25%); +@gray: lighten(@black, 50%); +@grayLight: lighten(@black, 75%); +@grayLighter: lighten(@black, 90%); @white: #fff; -// Accent Colors + +// ACCENT COLORS +// ------------- + @blue: #049CDB; @blueDark: #0064CD; @green: #46a546; @@ -25,11 +33,10 @@ @pink: #c3325f; @purple: #7a43b6; -// Baseline grid -@basefont: 13px; -@baseline: 18px; -// Griditude +// GRID +// ---- + // Modify the grid styles in mixins.less @gridColumns: 16; @gridColumnWidth: 40px; @@ -37,7 +44,10 @@ @extraSpace: (@gridGutterWidth * 2); // For our grid calculations @siteWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); -// Color Scheme + +// COLOR SCHEME +// ------------ + // Use this to roll your own color schemes if you like (unused by Bootstrap by default) @baseColor: @blue; // Set a base color @complement: spin(@baseColor, 180); // Determine a complementary color @@ -51,10 +61,13 @@ @analog2: spin(@baseColor, -22); +// THEME VARIABLES +// --------------- -// More variables coming soon: -// - @basefont to @baseFontSize -// - @baseline to @baseLineHeight -// - @baseFontFamily -// - @primaryButtonColor -// - anything else? File an issue on GitHub \ No newline at end of file +// Typography +@baseFontSize: 13px; +@baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; +@baseLineHeight: 18px; + +// Visuals +@primaryButtonColor: @blue;