From 25d9a2f2b8e5bcc266e676fdca43541206eb3dbf Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 28 Jun 2011 15:54:25 -0700 Subject: [PATCH] update grid bg to 18px baseline, updated docs for disabled buttons --- bootstrap-1.0.0.css | 10 +++++++++- bootstrap-1.0.0.min.css | 3 ++- docs/assets/css/docs.css | 19 ++++++++++--------- docs/assets/img/grid-18px.png | Bin 0 -> 1118 bytes docs/index.html | 14 +++++++++++++- lib/scaffolding.less | 8 +++++++- 6 files changed, 41 insertions(+), 13 deletions(-) create mode 100644 docs/assets/img/grid-18px.png diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css index b2b8282a7..1a56a1387 100644 --- a/bootstrap-1.0.0.css +++ b/bootstrap-1.0.0.css @@ -396,7 +396,7 @@ a:hover { } .btn.large { font-size: 16px; - line-height: 30px; + line-height: 28px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; @@ -406,6 +406,14 @@ a:hover { padding-left: 9px; font-size: 11px; } +.btn:disabled, .btn.disabled { + background-image: none; + filter: alpha(opacity=65); + -khtml-opacity: 0.65; + -moz-opacity: 0.65; + opacity: 0.65; + cursor: default; +} button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner { padding: 0; border: 0; diff --git a/bootstrap-1.0.0.min.css b/bootstrap-1.0.0.min.css index 586330c81..baf800b64 100644 --- a/bootstrap-1.0.0.min.css +++ b/bootstrap-1.0.0.min.css @@ -33,8 +33,9 @@ div.container-fluid div.content{min-width:700px;max-width:1180px;margin-left:240 a{color:#0069d6;text-decoration:none;line-height:inherit;}a:hover{color:#0050a3;text-decoration:underline;} .btn{display:inline-block;background-color:#e6e6e6;background-repeat:no-repeat;background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(0.25, #ffffff), to(#e6e6e6));background-image:-webkit-linear-gradient(#ffffff, color-stop(0.25, #ffffff), #e6e6e6);background-image:-moz-linear-gradient(#ffffff, color-stop(#ffffff, 0.25), #e6e6e6);padding:4px 14px;text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);color:#333333;font-size:13px;line-height:18px;border:1px solid rgba(0, 0, 0, 0.1);border-bottom-color:rgba(0, 0, 0, 0.25);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);}.btn:hover{background-position:0 -15px;color:#333333;text-decoration:none;} .btn.primary{background-color:#0069d6;background-repeat:repeat-x;background-image:-khtml-gradient(linear, left top, left bottom, from(#08b5fb), to(#0069d6));background-image:-moz-linear-gradient(#08b5fb, #0069d6);background-image:-ms-linear-gradient(#08b5fb, #0069d6);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #08b5fb), color-stop(100%, #0069d6));background-image:-webkit-linear-gradient(#08b5fb, #0069d6);background-image:-o-linear-gradient(#08b5fb, #0069d6);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#08b5fb', endColorstr='#0069d6', GradientType=0);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#08b5fb', endColorstr='#0069d6', GradientType=0)";background-image:linear-gradient(#08b5fb, #0069d6);color:#fff;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);}.btn.primary:hover{color:#fff;} -.btn.large{font-size:16px;line-height:30px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;} +.btn.large{font-size:16px;line-height:28px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;} .btn.small{padding-right:9px;padding-left:9px;font-size:11px;} +.btn:disabled,.btn.disabled{background-image:none;filter:alpha(opacity=65);-khtml-opacity:0.65;-moz-opacity:0.65;opacity:0.65;cursor:default;} button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;border:0;} p{font-size:13px;font-weight:normal;line-height:18px;margin-bottom:18px;}p small{font-size:12px;color:#b3b3b3;} h1,h2,h3,h4,h5,h6{font-weight:500;color:#404040;}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#b3b3b3;} diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index 76473c952..96cb579f3 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -1,8 +1,8 @@ /* Add additional stylesheets below -------------------------------------------------- */ /* - Baseline's documentation styles - Special styles for presenting Baseline's documentation and examples + Bootstrap's documentation styles + Special styles for presenting Bootstrap's documentation and examples */ /* Body and structure -------------------------------------------------- */ @@ -26,8 +26,8 @@ section { -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#0056b0', EndColorStr='#049cd9', GradientType=0))"; } #masthead div.inner, #footer div.inner { - background: transparent url(../img/grid-20px.png) 0 -1px; - padding: 40px 0; + background: transparent url(../img/grid-18px.png) 0 -1px; + padding: 36px 0; -webkit-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.25); box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.25); @@ -49,9 +49,9 @@ section { margin-bottom: 0; } #masthead p.lead { - font-size: 20px; + font-size: 18px; font-weight: 300; - line-height: 30px; + line-height: 27px; margin: 0; } #masthead a.btn { @@ -65,8 +65,9 @@ section { filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#7a43b6', EndColorStr='#552e7e', GradientType=0); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7a43b6', EndColorStr='#552e7e', GradientType=0))"; display: block; - margin-bottom: 20px; + margin-bottom: 18px; text-align: center; + font-weight: bold; border: 0; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.4); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.4); @@ -79,8 +80,8 @@ section { display: block; text-align: center; font-size: 13px; - line-height: 20px; - color: rgba(255, 255, 255, 0.5); + line-height: 18px; + color: rgba(255,255,255,0.5); } #masthead small a { color: #fff; diff --git a/docs/assets/img/grid-18px.png b/docs/assets/img/grid-18px.png new file mode 100644 index 0000000000000000000000000000000000000000..68f9fe1b70c40b25278613599bb593a0cb6acc0b GIT binary patch literal 1118 zcmaJ=O=uHA6y8=^`a>>O0;Uv}tsscmosCJ;U7EIOw$-3pN*ZWdMBMI9nx);Hb$4o# z3RbNs9t0`atHC0A(O!BJ6|Gw9L82gNj~)twVh>*Q_zA-Ag+PZ~xWYVspGL7bOgdvfZuV7d; zS<|Vci6o56DHg}Gz`arxD9itc8b%H6-~`-@_n*Q}GH*dH0Ub1NtE6!0Zr7D1#%!oy zWG4}tt7dU5gD`S3$f9H8A(p3QMb%B$Qew!m7&jfPm@14*5r$~6x~_=;#KI)cVL=!f z;`w1P6bi)zDI5-mc!>ufP~}QUoj0I~t6Xi5+gq3GHiKai&l0rt^H3YHkwKR(E$a1S z3DwoBaJBle^wi~YBpA*u?O&y?nn?e+%Ua`-O|A8zN&4L;joozk!zOtY#kdqr=C;3m ze%^W&92kE8@`>lu;&t!t>e<$z25s9H(gupFxpN~7YEu;9%(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.

- Download Zip » + Download Bootstrap ZIP » Visit project page on Github »
(Current version: 1.0.0) @@ -954,6 +954,18 @@ Primary action Action
+

Disabled state

+

For buttons that are not active or are disabled by the app for one reason or another, use the disabled state. That's .disabled for links and :disabled for button elements.

+

Links

+
+ Primary action + Action +
+

Buttons

+
+ + +
diff --git a/lib/scaffolding.less b/lib/scaffolding.less index 6853afe75..f279fe141 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -89,7 +89,7 @@ a { } &.large { font-size: 16px; - line-height: 30px; + line-height: 28px; .border-radius(6px); } &.small { @@ -97,6 +97,12 @@ a { padding-left: 9px; font-size: 11px; } + &:disabled, + &.disabled { + background-image: none; + .opacity(65); + cursor: default; + } } // Help Firefox not be a douche about adding extra padding to buttons button.btn,