Button: Force content (icon + text) to be on 1 line

This commit is contained in:
Molkobain
2021-04-04 22:23:50 +02:00
parent 0bc2f2c818
commit 54b718e7cd

View File

@@ -461,12 +461,14 @@ $ibo-button-colors: (
}
.ibo-button {
padding: $ibo-button--padding-y $ibo-button--padding-x;
border: $ibo-button--border;
border-radius: $ibo-button--border-radius;
cursor: pointer;
display: inline-flex; /* Used to allow truncated text on .ibo-button--label */
padding: $ibo-button--padding-y $ibo-button--padding-x;
border: $ibo-button--border;
border-radius: $ibo-button--border-radius;
cursor: pointer;
text-transform: uppercase;
@extend %ibo-font-ral-sembol-100;
white-space: nowrap; /* To force sub elements to be on 1 line */
@extend %ibo-font-ral-sembol-100;
& ~ .ibo-button {
margin-left: $ibo-button--sibling-spacing;
@@ -477,6 +479,10 @@ $ibo-button-colors: (
}
}
.ibo-button--label {
@extend %ibo-text-truncated-with-ellipsis;
}
/* Only when a button has both an icon and a label */
.ibo-button--icon + .ibo-button--label {
margin-left: $ibo-button--label--margin-left;