diff --git a/src/scss/cdb-components/forms/inputs.scss b/src/scss/cdb-components/forms/inputs.scss index 6559fe0..950aa91 100644 --- a/src/scss/cdb-components/forms/inputs.scss +++ b/src/scss/cdb-components/forms/inputs.scss @@ -13,6 +13,7 @@ @import '../../cdb-variables/sizes'; @import '../../cdb-variables/colors'; +@import '../../cdb-utilities/helpers'; .CDB-InputText { width: 100%; @@ -34,8 +35,10 @@ background: $cThirdBackground; } &.has-error { - border: 1px solid rgba($cError, 0.48); - background: rgba($cError, 0.04); - color: $cError; + @include default-form-error-style(); } } + +.CDB-FieldError .CDB-InputText { + @include default-form-error-style(); +} diff --git a/src/scss/cdb-components/forms/selects.scss b/src/scss/cdb-components/forms/selects.scss index 7e6775a..0c6cfe0 100644 --- a/src/scss/cdb-components/forms/selects.scss +++ b/src/scss/cdb-components/forms/selects.scss @@ -31,6 +31,7 @@ @import '../../cdb-variables/sizes'; @import '../../cdb-variables/colors'; +@import '../../cdb-utilities/helpers'; .CDB-Select { position: relative; @@ -64,8 +65,11 @@ background: $cThirdBackground; } &.has-error { - border: 1px solid rgba($cError, 0.48); - background: rgba($cError, 0.04); - color: $cError; + @include default-form-error-style(); } } + +.CDB-FieldError .CDB-Select, +.CDB-FieldError .CDB-SelectFake { + @include default-form-error-style(); +} diff --git a/src/scss/cdb-components/forms/textarea.scss b/src/scss/cdb-components/forms/textarea.scss index e69e455..968c2a4 100644 --- a/src/scss/cdb-components/forms/textarea.scss +++ b/src/scss/cdb-components/forms/textarea.scss @@ -13,6 +13,7 @@ @import '../../cdb-variables/sizes'; @import '../../cdb-variables/colors'; +@import '../../cdb-utilities/helpers'; .CDB-Textarea { width: 100%; @@ -34,9 +35,10 @@ border-color: $cSecondaryLine; background: $cThirdBackground; } -} -.CDB-Textarea.has-error { - border: 1px solid rgba($cError, 0.48); - background: rgba($cError, 0.04); - color: $cError; + &:has-error { + @include default-form-error-style(); } +} +.CDB-FieldError .CDB-Textarea { + @include default-form-error-style(); +} diff --git a/src/scss/cdb-utilities/helpers.scss b/src/scss/cdb-utilities/helpers.scss index aab62bc..dbcb924 100644 --- a/src/scss/cdb-utilities/helpers.scss +++ b/src/scss/cdb-utilities/helpers.scss @@ -49,7 +49,7 @@ } // Colors -// Main Text Color is default color +// Main Text Color is default color // ---------------------------------------------- .u-actionTextColor { @@ -93,3 +93,10 @@ display: block !important; } } + +/* helper mixins */ +@mixin default-form-error-style() { + border: 1px solid rgba($cError, 0.48); + background: rgba($cError, 0.04); + color: $cError; +}