N°7264 - Fix visual glitches due to seletize.js upgrade

This commit is contained in:
Molkobain
2024-04-04 15:01:57 +02:00
parent 3f401e4de0
commit 4ca92affcf
5 changed files with 80 additions and 66 deletions

View File

@@ -49,10 +49,7 @@ $ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-60
.ibo-input-select {
display: inline-flex;
min-width: $ibo-input-select--value--min-midth;
&:not(.ibo-input-select-autocomplete):not(.ibo-input-selectize) {
appearance: none;
}
appearance: none;
&.ibo-input-selectize {
padding-right: 0;
@@ -108,7 +105,7 @@ $ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-60
outline: none !important; /* Overwrite browsers default focus outline */
}
}
&.input-active{
border: 1px solid $ibo-input--focus--border-color;
}
@@ -123,15 +120,16 @@ $ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-60
}
.ibo-input-select-wrapper::after{
position: absolute;
z-index: 1;
content: "\f0d7";
font-family: "Font Awesome 5 Free";
font-weight: 600;
height: $ibo-input-select-wrapper--after--height;
margin-left: $ibo-input-select-wrapper--after--margin-left;
margin-top: $ibo-input-select-wrapper--after--margin-top;
padding-top: $ibo-input-select-wrapper--after--padding-top;
background-color: $ibo-input-select-wrapper--after--background-color;
color: $ibo-input-select-wrapper--after--color;
pointer-events: none;
@@ -146,6 +144,7 @@ $ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-60
.ibo-input-select-wrapper--with-buttons:not(.ibo-input-select-autocomplete-wrapper)::after {
position: absolute;
z-index: 1;
content: "\f0d7";
font-family: "Font Awesome 5 Free";
font-weight: 600;
@@ -163,6 +162,7 @@ $ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-60
}
.ibo-input-select--action-buttons{
position: absolute;
z-index: 1;
display: flex;
height: $ibo-input-select--action-button--height;
margin-top: $ibo-input-select--action-button--margin-top;

View File

@@ -8,7 +8,11 @@ $ibo-input--width: 100% !default;
$ibo-input--color: $ibo-color-grey-900 !default;
$ibo-input--background-color: $ibo-color-white-100 !default;
$ibo-input--border-color: $ibo-color-grey-500 !default;
$ibo-input--border-size: 1px !default;
$ibo-input--border-style: solid !default;
$ibo-input--border: $ibo-input--border-size $ibo-input--border-style $ibo-input--border-color !default;
$ibo-input--padding-x: 10px !default;
$ibo-input--padding-y: $ibo-spacing-0 !default;
@@ -34,13 +38,13 @@ $ibo-input--margin-x: $ibo-spacing-200 !default;
background-color: $ibo-input--background-color;
color: $ibo-input--color;
padding: $ibo-input--padding-y $ibo-input--padding-x;
border: 1px solid $ibo-input--border-color;
border: $ibo-input--border;
border-radius: $ibo-input--border-radius;
@extend %ibo-font-ral-nor-150;
&:focus{
border: 1px solid $ibo-input--focus--border-color;
border-color: $ibo-input--focus--border-color;
}
&:disabled{
background-color: $ibo-input--disabled--background-color;
@@ -54,8 +58,8 @@ textarea.ibo-input{
height:unset;
}
.ibo-input-wrapper.is-error, .ibo-input-field-wrapper.is-error {
.ibo-input, .ibo-input-vanilla, .cke, textarea {
border: 1px solid $ibo-input-wrapper--is-error--border-color;
.ibo-input, .ibo-input-vanilla, .cke, textarea {
border-color: $ibo-input-wrapper--is-error--border-color;
}
.ibo-input-vanilla input{
border: 0;