diff --git a/static/includes/_forms.scss b/static/includes/_forms.scss index 55180cec..91ada671 100644 --- a/static/includes/_forms.scss +++ b/static/includes/_forms.scss @@ -445,6 +445,13 @@ span.select2-container { } span.select2-selection--multiple { min-height: 0; + padding-top: calc(#{extract-top($widget-padding)} - 0.2rem); + padding-bottom: calc(#{extract-bottom($widget-padding)} - 0.2rem); + + .select2-selection__choice, .select2-search { + margin: 0.2rem 0.5rem 0.2rem 0; + } + .select2-selection__rendered { display: block; } diff --git a/static/includes/_utils.scss b/static/includes/_utils.scss index ce969a74..dfbf8c05 100644 --- a/static/includes/_utils.scss +++ b/static/includes/_utils.scss @@ -34,6 +34,58 @@ $black: #000000 !default; @return 0; } +@function extract-top($spacing){ + @return nth($spacing, 1); +} + +@function extract-right($spacing){ + @if (length($spacing) == 1) { + @return nth($spacing, 1); + } + + @if (length($spacing) == 2) { + @return nth($spacing, 2); + } + + @if (length($spacing) == 4) { + @return nth($spacing, 2); + } + + @error "Invalid spacing #{spacing}"; +} + +@function extract-bottom($spacing){ + @if (length($spacing) == 1) { + @return nth($spacing, 1); + } + + @if (length($spacing) == 2) { + @return nth($spacing, 1); + } + + @if (length($spacing) == 4) { + @return nth($spacing, 3); + } + + @error "Invalid spacing #{spacing}"; +} + +@function extract-left($spacing){ + @if (length($spacing) == 1) { + @return nth($spacing, 1); + } + + @if (length($spacing) == 2) { + @return nth($spacing, 2); + } + + @if (length($spacing) == 4) { + @return nth($spacing, 4); + } + + @error "Invalid spacing #{spacing}"; +} + // Check if value is a number > 0; @function is-positive-number($value) { @return type-of($value) == 'number' and $value > 0;