diff options
-rw-r--r-- | client/src/sass/bootstrap.scss | 10 | ||||
-rw-r--r-- | client/src/sass/class-helpers.scss | 8 |
2 files changed, 6 insertions, 12 deletions
diff --git a/client/src/sass/bootstrap.scss b/client/src/sass/bootstrap.scss index 28a6f4807..49585a124 100644 --- a/client/src/sass/bootstrap.scss +++ b/client/src/sass/bootstrap.scss | |||
@@ -301,16 +301,6 @@ | |||
301 | color: pvar(--mainForegroundColor); | 301 | color: pvar(--mainForegroundColor); |
302 | background-color: pvar(--inputBackgroundColor); | 302 | background-color: pvar(--inputBackgroundColor); |
303 | outline: none; | 303 | outline: none; |
304 | |||
305 | // Input box-shadow on focus | ||
306 | &:focus-within, | ||
307 | &:focus { | ||
308 | box-shadow: #{$focus-box-shadow-form} pvar(--mainColorLightest); | ||
309 | |||
310 | &.input-error { | ||
311 | box-shadow: #{$focus-box-shadow-form} #{scale-color($red, $alpha: -75%)}; | ||
312 | } | ||
313 | } | ||
314 | } | 304 | } |
315 | 305 | ||
316 | .input-group { | 306 | .input-group { |
diff --git a/client/src/sass/class-helpers.scss b/client/src/sass/class-helpers.scss index 4a04cabba..87ad6a45d 100644 --- a/client/src/sass/class-helpers.scss +++ b/client/src/sass/class-helpers.scss | |||
@@ -69,6 +69,10 @@ | |||
69 | margin-bottom: 1rem; | 69 | margin-bottom: 1rem; |
70 | } | 70 | } |
71 | 71 | ||
72 | .input-error:not(:focus) { | ||
73 | border-color: $red !important; | ||
74 | } | ||
75 | |||
72 | .form-error, | 76 | .form-error, |
73 | .form-warning { | 77 | .form-warning { |
74 | display: block; | 78 | display: block; |
@@ -79,8 +83,8 @@ | |||
79 | color: $red; | 83 | color: $red; |
80 | } | 84 | } |
81 | 85 | ||
82 | .input-error { | 86 | .input-error:focus + .form-error { |
83 | border-color: $red !important; | 87 | color: pvar(--mainForegroundColor); |
84 | } | 88 | } |
85 | 89 | ||
86 | .form-group-description { | 90 | .form-group-description { |