mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-08 23:58:13 +08:00
bd22926c49
adds `--backdrop-opacity` to all overlays and `--ion-backdrop-opacity` for global control closes #16446
46 lines
1.1 KiB
SCSS
46 lines
1.1 KiB
SCSS
@import "./loading";
|
|
@import "./loading.ios.vars";
|
|
|
|
// iOS Loading Indicator
|
|
// --------------------------------------------------
|
|
|
|
:host {
|
|
--background: #{$loading-ios-background-color};
|
|
--max-width: #{$loading-ios-max-width};
|
|
--max-height: #{$loading-ios-max-height};
|
|
--spinner-color: #{$loading-ios-spinner-color};
|
|
--backdrop-opacity: var(--ion-backdrop-opacity, 0.3);
|
|
|
|
color: $loading-ios-text-color;
|
|
|
|
font-size: $loading-ios-font-size;
|
|
}
|
|
|
|
.loading-wrapper {
|
|
@include border-radius($loading-ios-border-radius);
|
|
@include padding($loading-ios-padding-top, $loading-ios-padding-end, $loading-ios-padding-bottom, $loading-ios-padding-start);
|
|
}
|
|
|
|
|
|
// iOS Translucent Loading
|
|
// -----------------------------------------
|
|
|
|
@supports (backdrop-filter: blur(0)) {
|
|
:host(.loading-translucent) .loading-wrapper {
|
|
background-color: $loading-ios-translucent-background-color;
|
|
backdrop-filter: $loading-ios-translucent-filter;
|
|
}
|
|
}
|
|
|
|
|
|
// iOS Loading Content
|
|
// -----------------------------------------
|
|
|
|
.loading-content {
|
|
font-weight: $loading-ios-content-font-weight;
|
|
}
|
|
|
|
.loading-spinner + .loading-content {
|
|
@include margin-horizontal(16px, null);
|
|
}
|