Skip to content

Commit

Permalink
Hide validation icons from multiple selects
Browse files Browse the repository at this point in the history
Implementation provided in #33411 does not take into account that some
Operating Systems may display a vertical scrollbar in the multiple
select field

This implementation will hide the validation icons from multiple select
fields, just like Bootstrap 4 does.

Fix: #33591
  • Loading branch information
tagliala authored and mdo committed Apr 14, 2021
1 parent db32b23 commit 6fe75df
Showing 1 changed file with 6 additions and 11 deletions.
17 changes: 6 additions & 11 deletions scss/mixins/_forms.scss
Expand Up @@ -88,17 +88,12 @@
border-color: $color;

@if $enable-validation-icons {
padding-right: $form-select-feedback-icon-padding-end;
background-image: escape-svg($form-select-indicator), escape-svg($icon);
background-position: $form-select-bg-position, $form-select-feedback-icon-position;
background-size: $form-select-bg-size, $form-select-feedback-icon-size;

&[multiple],
&[size]:not([size="1"]) {
padding-right: $input-height-inner;
background-image: escape-svg($icon);
background-position: top $input-height-inner-quarter right $input-height-inner-quarter;
background-size: $form-select-feedback-icon-size;
&:not([multiple]):not([size]),
&:not([multiple])[size="1"] {
padding-right: $form-select-feedback-icon-padding-end;
background-image: escape-svg($form-select-indicator), escape-svg($icon);
background-position: $form-select-bg-position, $form-select-feedback-icon-position;
background-size: $form-select-bg-size, $form-select-feedback-icon-size;
}
}

Expand Down

0 comments on commit 6fe75df

Please sign in to comment.