diff options
author | Dixsie Wolmers <dixsie@ibm.com> | 2020-07-28 01:50:43 +0300 |
---|---|---|
committer | Yoshie Muranaka <yoshiemuranaka@gmail.com> | 2020-08-18 17:49:09 +0300 |
commit | 5ea167820bb5f1cdfe4b501eb3c70daf1a3732d3 (patch) | |
tree | 036f5394be2aadd70db9c0d11db34fe37408e96b /src/assets/styles | |
parent | dc3fa2e0382145126101dc6df04d0338a119824f (diff) | |
download | webui-vue-5ea167820bb5f1cdfe4b501eb3c70daf1a3732d3.tar.xz |
Add form input field validation icons
Updates form validation to match updated style guide:
- Datepicker and password toggle form field
padding adjusted to accomodate validation icons
- Valid form validation icon is hidden
- Adds carbon icons and enables validation icons in
IBM environment
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: I7edff1e9527ad2c2cfec236daacb83ad4864d785
Diffstat (limited to 'src/assets/styles')
-rw-r--r-- | src/assets/styles/bmc/custom/_forms.scss | 27 |
1 files changed, 27 insertions, 0 deletions
diff --git a/src/assets/styles/bmc/custom/_forms.scss b/src/assets/styles/bmc/custom/_forms.scss index b7747bf3..60f4a84d 100644 --- a/src/assets/styles/bmc/custom/_forms.scss +++ b/src/assets/styles/bmc/custom/_forms.scss @@ -100,3 +100,30 @@ fill: currentColor; } } + +.b-form-datepicker { + position: absolute; + right: 0; + top: 0; + z-index: $zindex-dropdown + 1; + .btn { + padding: 0.4rem 1rem; + svg { + margin-left: 0; + } + } +} + +// Form validation icon + .form-control.is-invalid, + .form-control.is-valid { + background-position: right 1rem bottom 50%; + } + +// Form validation icon with datepicker or password toggle icon +.form-control-with-button { + &.is-invalid, + &.is-valid { + background-position: right 3rem bottom 50%; + } +} |