aboutsummaryrefslogtreecommitdiffstats
path: root/csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss
diff options
context:
space:
mode:
authorpmikus <peter.mikus@protonmail.ch>2022-09-19 08:49:01 +0200
committerPeter Mikus <peter.mikus@protonmail.ch>2022-09-19 06:54:43 +0000
commitd6a60b5043c6f7c3dfc45853feb68d0aca5a4a5f (patch)
tree022343584d4e00a0da8ef12eb4e713d67344fc95 /csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss
parentd2ef7bc01df66f6a27f25d061db064cf4a463267 (diff)
feat(uti): Move directory
Signed-off-by: pmikus <peter.mikus@protonmail.ch> Change-Id: I7300ecfe756baaf3fbeedb020070f882cfaca445
Diffstat (limited to 'csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss')
-rw-r--r--csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss59
1 files changed, 59 insertions, 0 deletions
diff --git a/csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss b/csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss
new file mode 100644
index 0000000000..1bfafb58fa
--- /dev/null
+++ b/csit.infra.dash/app/pal/static/sass/bootstrap/_progress.scss
@@ -0,0 +1,59 @@
+// Disable animation if transitions are disabled
+
+// scss-docs-start progress-keyframes
+@if $enable-transitions {
+ @keyframes progress-bar-stripes {
+ 0% { background-position-x: $progress-height; }
+ }
+}
+// scss-docs-end progress-keyframes
+
+.progress {
+ // scss-docs-start progress-css-vars
+ --#{$prefix}progress-height: #{$progress-height};
+ @include rfs($progress-font-size, --#{$prefix}progress-font-size);
+ --#{$prefix}progress-bg: #{$progress-bg};
+ --#{$prefix}progress-border-radius: #{$progress-border-radius};
+ --#{$prefix}progress-box-shadow: #{$progress-box-shadow};
+ --#{$prefix}progress-bar-color: #{$progress-bar-color};
+ --#{$prefix}progress-bar-bg: #{$progress-bar-bg};
+ --#{$prefix}progress-bar-transition: #{$progress-bar-transition};
+ // scss-docs-end progress-css-vars
+
+ display: flex;
+ height: var(--#{$prefix}progress-height);
+ overflow: hidden; // force rounded corners by cropping it
+ @include font-size(var(--#{$prefix}progress-font-size));
+ background-color: var(--#{$prefix}progress-bg);
+ @include border-radius(var(--#{$prefix}progress-border-radius));
+ @include box-shadow(var(--#{$prefix}progress-box-shadow));
+}
+
+.progress-bar {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ overflow: hidden;
+ color: var(--#{$prefix}progress-bar-color);
+ text-align: center;
+ white-space: nowrap;
+ background-color: var(--#{$prefix}progress-bar-bg);
+ @include transition(var(--#{$prefix}progress-bar-transition));
+}
+
+.progress-bar-striped {
+ @include gradient-striped();
+ background-size: var(--#{$prefix}progress-height) var(--#{$prefix}progress-height);
+}
+
+@if $enable-transitions {
+ .progress-bar-animated {
+ animation: $progress-bar-animation-timing progress-bar-stripes;
+
+ @if $enable-reduced-motion {
+ @media (prefers-reduced-motion: reduce) {
+ animation: none;
+ }
+ }
+ }
+}