From 41518d0e32ed09f70645c0f1b6b006fa37b30247 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Oct 2016 16:38:28 -0700 Subject: [PATCH 1/5] Interpolate the variable so it passes the color properly --- scss/_variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scss/_variables.scss b/scss/_variables.scss index d375f91c5b..ed0dee39fd 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -436,7 +436,7 @@ $custom-file-text: ( // Form validation icons $form-icon-success-color: $brand-success !default; -$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='$form-icon-success-color' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E") !default; +$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$form-icon-success-color}' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E") !default; $form-icon-warning-color: $brand-warning !default; $form-icon-warning: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$form-icon-warning-color}' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E") !default; From 8750b5f81cf38c91eb8a72601232041cf60cff74 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Oct 2016 16:39:02 -0700 Subject: [PATCH 2/5] The color is already covered in the first ruleset here --- scss/mixins/_forms.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss index 698e7dc12d..e2bead1801 100644 --- a/scss/mixins/_forms.scss +++ b/scss/mixins/_forms.scss @@ -30,10 +30,6 @@ border-color: $color; background-color: lighten($color, 40%); } - // Optional feedback icon - .form-control-feedback { - color: $color; - } } // Form control focus state From 3fa312ccdf799dba3fd7bc4802b5e21b5bed3467 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Oct 2016 16:40:56 -0700 Subject: [PATCH 3/5] Use correct class for validation coloring on label elements --- docs/components/forms.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/components/forms.md b/docs/components/forms.md index a2d59d9208..99f0d9a632 100644 --- a/docs/components/forms.md +++ b/docs/components/forms.md @@ -710,19 +710,19 @@ Ensure that an alternative indication of state is also provided. For instance, y {% example html %}
- + Example help text that remains unchanged.
- + Example help text that remains unchanged.
- + Example help text that remains unchanged. From b77b874265e3876eef978d61a613a4fbf74375d9 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Oct 2016 16:44:04 -0700 Subject: [PATCH 4/5] fix focus shadows, if enabled --- scss/mixins/_forms.scss | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss index e2bead1801..a8d501b448 100644 --- a/scss/mixins/_forms.scss +++ b/scss/mixins/_forms.scss @@ -12,15 +12,15 @@ .custom-control { color: $color; } + // Set the border and box shadow on specific inputs to match .form-control { border-color: $color; - // @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work - &:focus { - // border-color: darken($border-color, 10%); - // $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%); - // @include box-shadow($shadow); + @if $enable-rounded { + &:focus { + box-shadow: $input-box-shadow, 0 0 6px lighten($color, 20%) + } } } From 8273e0cf82da85e13623aeb8309ba8ff848ddaa0 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Oct 2016 16:46:47 -0700 Subject: [PATCH 5/5] linting --- scss/mixins/_forms.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scss/mixins/_forms.scss b/scss/mixins/_forms.scss index a8d501b448..39851b8f8d 100644 --- a/scss/mixins/_forms.scss +++ b/scss/mixins/_forms.scss @@ -19,7 +19,7 @@ @if $enable-rounded { &:focus { - box-shadow: $input-box-shadow, 0 0 6px lighten($color, 20%) + box-shadow: $input-box-shadow, 0 0 6px lighten($color, 20%); } } }