47 lines
1 KiB
SCSS
47 lines
1 KiB
SCSS
|
@use "sass:map";
|
||
|
|
@use "../settings" as *;
|
||
|
|
|
||
|
|
@if map.get($modules, "components/loading") {
|
||
|
|
/**
|
||
|
|
* Loading ([aria-busy=true])
|
||
|
|
*/
|
||
|
|
|
||
|
|
// Everything except form elements
|
||
|
|
#{$parent-selector} [aria-busy="true"]:not(input, select, textarea, html) {
|
||
|
|
white-space: nowrap;
|
||
|
|
|
||
|
|
&::before {
|
||
|
|
display: inline-block;
|
||
|
|
width: 1em;
|
||
|
|
height: 1em;
|
||
|
|
background-image: var(#{$css-var-prefix}icon-loading);
|
||
|
|
background-size: 1em auto;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
content: "";
|
||
|
|
vertical-align: -0.125em; // Visual alignment
|
||
|
|
}
|
||
|
|
|
||
|
|
&:not(:empty) {
|
||
|
|
&::before {
|
||
|
|
margin-inline-end: calc(var(#{$css-var-prefix}spacing) * 0.5);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
&:empty {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// Buttons and links
|
||
|
|
#{$parent-selector} button,
|
||
|
|
#{$parent-selector} [type="submit"],
|
||
|
|
#{$parent-selector} [type="button"],
|
||
|
|
#{$parent-selector} [type="reset"],
|
||
|
|
#{$parent-selector} [role="button"],
|
||
|
|
#{$parent-selector} a {
|
||
|
|
&[aria-busy="true"] {
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|