N°4283 - Fix spacing for Pills when wrapping

Also repalce some spacing with variables
This commit is contained in:
Molkobain
2021-11-26 10:34:57 +01:00
parent 77768e8400
commit db137d3816
5 changed files with 13 additions and 10 deletions

View File

@@ -6,6 +6,9 @@
$ibo-pill--spacing-left--with-same-block: $ibo-spacing-500 !default;
.ibo-pill + .ibo-pill {
margin-left: $ibo-pill--spacing-left--with-same-block;
/* For pills, margin is set on the right to keep them aligned horizontally when they wrap */
/* The drawback is that we can't set the margin only when next to another .ibo-pill as there is no such CSS selector */
/* Also :last-child is used instead of :last-of-type as pill can be either an <a> or a <span> */
.ibo-pill:not(:last-child) {
margin-right: $ibo-pill--spacing-left--with-same-block;
}

View File

@@ -18,7 +18,7 @@ $ibo-dashlet-badge--action-list-count--margin-right: $ibo-spacing-300 !default;
$ibo-dashlet-badge--icon-container--margin-right: $ibo-spacing-500 !default;
$ibo-dashlet-badge--icon--size: 48px !default;
$ibo-dashlet-badge--action-icon--margin-right: 6px !default;
$ibo-dashlet-badge--action-icon--margin-right: $ibo-spacing-300 !default;
/* CSS variables (can be changed directly from the browser) */
:root {

View File

@@ -26,7 +26,7 @@ $ibo-input-wrapper--is-error--background-color: $ibo-color-red-200 !default;
$ibo-input-wrapper--is-error--border-color: $ibo-color-red-600 !default;
$ibo-field-validation: $ibo-color-red-700 !default;
$ibo-input--margin-x: 5px !default;
$ibo-input--margin-x: $ibo-spacing-200 !default;
.ibo-input {
@extend %ibo-vertically-centered-content;