bulma/sass/elements/icon.scss

70 lines
1.2 KiB
SCSS
Raw Normal View History

2022-11-23 17:44:02 +00:00
$icon-dimensions: 1.5rem !default;
$icon-dimensions-small: 1rem !default;
$icon-dimensions-medium: 2rem !default;
$icon-dimensions-large: 3rem !default;
$icon-text-spacing: 0.25em !default;
.icon {
align-items: center;
display: inline-flex;
justify-content: center;
height: $icon-dimensions;
width: $icon-dimensions;
// Sizes
&.is-small {
height: $icon-dimensions-small;
width: $icon-dimensions-small;
}
&.is-medium {
height: $icon-dimensions-medium;
width: $icon-dimensions-medium;
}
&.is-large {
height: $icon-dimensions-large;
width: $icon-dimensions-large;
}
}
.icon-text {
align-items: flex-start;
color: inherit;
display: inline-flex;
flex-wrap: wrap;
line-height: $icon-dimensions;
vertical-align: top;
.icon {
flex-grow: 0;
flex-shrink: 0;
&:not(:last-child) {
@include ltr {
margin-right: $icon-text-spacing;
}
@include rtl {
margin-left: $icon-text-spacing;
}
}
&:not(:first-child) {
@include ltr {
margin-left: $icon-text-spacing;
}
@include rtl {
margin-right: $icon-text-spacing;
}
}
}
}
div.icon-text {
display: flex;
}