From e34b3730b7a3a46b1b4dcbf3d5cab9bf2cbc94b1 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 30 Nov 2012 15:38:31 -0800 Subject: [PATCH] form state vars --- docs/customize.html | 16 ++++++++-------- docs/templates/pages/customize.mustache | 16 ++++++++-------- less/alerts.less | 24 ++++++++++++------------ less/forms.less | 12 ++++++------ less/labels-badges.less | 12 ++++++------ less/tables.less | 16 ++++++++-------- less/type.less | 16 ++++++++-------- less/variables.less | 24 ++++++++++++------------ 8 files changed, 68 insertions(+), 68 deletions(-) diff --git a/docs/customize.html b/docs/customize.html index 4c5cb4f79e..bf564c863d 100644 --- a/docs/customize.html +++ b/docs/customize.html @@ -349,21 +349,21 @@

Form states & alerts

- + - + - + - + - + - + - + - +

Navbar

diff --git a/docs/templates/pages/customize.mustache b/docs/templates/pages/customize.mustache index b2e21e71c1..e3d993153d 100644 --- a/docs/templates/pages/customize.mustache +++ b/docs/templates/pages/customize.mustache @@ -281,21 +281,21 @@

{{_i}}Form states & alerts{{/i}}

- + - + - + - + - + - + - + - +

{{_i}}Navbar{{/i}}

diff --git a/less/alerts.less b/less/alerts.less index 60f0b2a275..b8a74a8177 100644 --- a/less/alerts.less +++ b/less/alerts.less @@ -10,14 +10,14 @@ padding: 8px 35px 8px 14px; margin-bottom: @line-height-base; text-shadow: 0 1px 0 rgba(255,255,255,.5); - background-color: @warningBackground; - border: 1px solid @warningBorder; + background-color: @state-warning-background; + border: 1px solid @state-warning-border; border-radius: @border-radius-base; } .alert, .alert h4 { // Specified for the h4 to prevent conflicts of changing @headingsColor - color: @warningText; + color: @state-warning-text; } .alert h4 { margin: 0; @@ -36,20 +36,20 @@ // ------------------------- .alert-success { - background-color: @successBackground; - border-color: @successBorder; - color: @successText; + background-color: @state-success-background; + border-color: @state-success-border; + color: @state-success-text; } .alert-danger, .alert-error { - background-color: @errorBackground; - border-color: @errorBorder; - color: @errorText; + background-color: @state-error-background; + border-color: @state-error-border; + color: @state-error-text; } .alert-info { - background-color: @infoBackground; - border-color: @infoBorder; - color: @infoText; + background-color: @state-info-background; + border-color: @state-info-border; + color: @state-info-text; } diff --git a/less/forms.less b/less/forms.less index a21dd238e1..2d3f018928 100644 --- a/less/forms.less +++ b/less/forms.less @@ -355,19 +355,19 @@ input[type="checkbox"][readonly] { // Warning .control-group.warning { - .formFieldState(@warningText, @warningText, @warningBackground); + .formFieldState(@state-warning-text, @state-warning-text, @state-warning-background); } // Error .control-group.error { - .formFieldState(@errorText, @errorText, @errorBackground); + .formFieldState(@state-error-text, @state-error-text, @state-error-background); } // Success .control-group.success { - .formFieldState(@successText, @successText, @successBackground); + .formFieldState(@state-success-text, @state-success-text, @state-success-background); } // Success .control-group.info { - .formFieldState(@infoText, @infoText, @infoBackground); + .formFieldState(@state-info-text, @state-info-text, @state-info-background); } // HTML5 invalid states @@ -479,8 +479,8 @@ select:focus:invalid { border-radius: 0; } .active { - background-color: @successBackground; - border-color: @successText; + background-color: @state-success-background; + border-color: @state-success-text; } } diff --git a/less/labels-badges.less b/less/labels-badges.less index 6dd8fe0e86..8440cc4691 100644 --- a/less/labels-badges.less +++ b/less/labels-badges.less @@ -50,17 +50,17 @@ a { .label, .badge { // Important (red) - &-danger { background-color: @errorText; } - &-danger[href] { background-color: darken(@errorText, 10%); } + &-danger { background-color: @state-error-text; } + &-danger[href] { background-color: darken(@state-error-text, 10%); } // Warnings (orange) &-warning { background-color: #f89406; } &-warning[href] { background-color: darken(#f89406, 10%); } // Success (green) - &-success { background-color: @successText; } - &-success[href] { background-color: darken(@successText, 10%); } + &-success { background-color: @state-success-text; } + &-success[href] { background-color: darken(@state-success-text, 10%); } // Info (turquoise) - &-info { background-color: @infoText; } - &-info[href] { background-color: darken(@infoText, 10%); } + &-info { background-color: @state-info-text; } + &-info[href] { background-color: darken(@state-info-text, 10%); } // Inverse (black) &-inverse { background-color: @grayDark; } &-inverse[href] { background-color: darken(@grayDark, 10%); } diff --git a/less/tables.less b/less/tables.less index 58aadf7bbf..30ef9c9bb4 100644 --- a/less/tables.less +++ b/less/tables.less @@ -183,31 +183,31 @@ table th[class*="span"], .table tbody tr { &.success td { - background-color: @successBackground; + background-color: @state-success-background; } &.error td { - background-color: @errorBackground; + background-color: @state-error-background; } &.warning td { - background-color: @warningBackground; + background-color: @state-warning-background; } &.info td { - background-color: @infoBackground; + background-color: @state-info-background; } } // Hover states for .table-hover .table-hover tbody tr { &.success:hover td { - background-color: darken(@successBackground, 5%); + background-color: darken(@state-success-background, 5%); } &.error:hover td { - background-color: darken(@errorBackground, 5%); + background-color: darken(@state-error-background, 5%); } &.warning:hover td { - background-color: darken(@warningBackground, 5%); + background-color: darken(@state-warning-background, 5%); } &.info:hover td { - background-color: darken(@infoBackground, 5%); + background-color: darken(@state-info-background, 5%); } } diff --git a/less/type.less b/less/type.less index 2f6dc9a9b9..feb2388f5b 100644 --- a/less/type.less +++ b/less/type.less @@ -31,17 +31,17 @@ cite { font-style: normal; } .muted { color: @grayLight; } a.muted:hover { color: darken(@grayLight, 10%); } -.text-warning { color: @warningText; } -a.text-warning:hover { color: darken(@warningText, 10%); } +.text-warning { color: @state-warning-text; } +a.text-warning:hover { color: darken(@state-warning-text, 10%); } -.text-error { color: @errorText; } -a.text-error:hover { color: darken(@errorText, 10%); } +.text-error { color: @state-error-text; } +a.text-error:hover { color: darken(@state-error-text, 10%); } -.text-info { color: @infoText; } -a.text-info:hover { color: darken(@infoText, 10%); } +.text-info { color: @state-info-text; } +a.text-info:hover { color: darken(@state-info-text, 10%); } -.text-success { color: @successText; } -a.text-success:hover { color: darken(@successText, 10%); } +.text-success { color: @state-success-text; } +a.text-success:hover { color: darken(@state-success-text, 10%); } // Headings diff --git a/less/variables.less b/less/variables.less index 6ef5359510..0ccd179431 100644 --- a/less/variables.less +++ b/less/variables.less @@ -210,21 +210,21 @@ // Form states and alerts // ------------------------- -@warningText: #c09853; -@warningBackground: #fcf8e3; -@warningBorder: darken(spin(@warningBackground, -10), 3%); +@state-warning-text: #c09853; +@state-warning-background: #fcf8e3; +@state-warning-border: darken(spin(@state-warning-background, -10), 3%); -@errorText: #b94a48; -@errorBackground: #f2dede; -@errorBorder: darken(spin(@errorBackground, -10), 3%); +@state-error-text: #b94a48; +@state-error-background: #f2dede; +@state-error-border: darken(spin(@state-error-background, -10), 3%); -@successText: #468847; -@successBackground: #dff0d8; -@successBorder: darken(spin(@successBackground, -10), 5%); +@state-success-text: #468847; +@state-success-background: #dff0d8; +@state-success-border: darken(spin(@state-success-background, -10), 5%); -@infoText: #3a87ad; -@infoBackground: #d9edf7; -@infoBorder: darken(spin(@infoBackground, -10), 7%); +@state-info-text: #3a87ad; +@state-info-background: #d9edf7; +@state-info-border: darken(spin(@state-info-background, -10), 7%); // Tooltips and popovers