source: imaps-frontend/node_modules/bootstrap/scss/_spinners.scss@ d565449

main
Last change on this file since d565449 was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago

Update repo after prototype presentation

  • Property mode set to 100644
File size: 2.4 KB
RevLine 
[d565449]1//
2// Rotating border
3//
4
5.spinner-grow,
6.spinner-border {
7 display: inline-block;
8 width: var(--#{$prefix}spinner-width);
9 height: var(--#{$prefix}spinner-height);
10 vertical-align: var(--#{$prefix}spinner-vertical-align);
11 // stylelint-disable-next-line property-disallowed-list
12 border-radius: 50%;
13 animation: var(--#{$prefix}spinner-animation-speed) linear infinite var(--#{$prefix}spinner-animation-name);
14}
15
16// scss-docs-start spinner-border-keyframes
17@keyframes spinner-border {
18 to { transform: rotate(360deg) #{"/* rtl:ignore */"}; }
19}
20// scss-docs-end spinner-border-keyframes
21
22.spinner-border {
23 // scss-docs-start spinner-border-css-vars
24 --#{$prefix}spinner-width: #{$spinner-width};
25 --#{$prefix}spinner-height: #{$spinner-height};
26 --#{$prefix}spinner-vertical-align: #{$spinner-vertical-align};
27 --#{$prefix}spinner-border-width: #{$spinner-border-width};
28 --#{$prefix}spinner-animation-speed: #{$spinner-animation-speed};
29 --#{$prefix}spinner-animation-name: spinner-border;
30 // scss-docs-end spinner-border-css-vars
31
32 border: var(--#{$prefix}spinner-border-width) solid currentcolor;
33 border-right-color: transparent;
34}
35
36.spinner-border-sm {
37 // scss-docs-start spinner-border-sm-css-vars
38 --#{$prefix}spinner-width: #{$spinner-width-sm};
39 --#{$prefix}spinner-height: #{$spinner-height-sm};
40 --#{$prefix}spinner-border-width: #{$spinner-border-width-sm};
41 // scss-docs-end spinner-border-sm-css-vars
42}
43
44//
45// Growing circle
46//
47
48// scss-docs-start spinner-grow-keyframes
49@keyframes spinner-grow {
50 0% {
51 transform: scale(0);
52 }
53 50% {
54 opacity: 1;
55 transform: none;
56 }
57}
58// scss-docs-end spinner-grow-keyframes
59
60.spinner-grow {
61 // scss-docs-start spinner-grow-css-vars
62 --#{$prefix}spinner-width: #{$spinner-width};
63 --#{$prefix}spinner-height: #{$spinner-height};
64 --#{$prefix}spinner-vertical-align: #{$spinner-vertical-align};
65 --#{$prefix}spinner-animation-speed: #{$spinner-animation-speed};
66 --#{$prefix}spinner-animation-name: spinner-grow;
67 // scss-docs-end spinner-grow-css-vars
68
69 background-color: currentcolor;
70 opacity: 0;
71}
72
73.spinner-grow-sm {
74 --#{$prefix}spinner-width: #{$spinner-width-sm};
75 --#{$prefix}spinner-height: #{$spinner-height-sm};
76}
77
78@if $enable-reduced-motion {
79 @media (prefers-reduced-motion: reduce) {
80 .spinner-border,
81 .spinner-grow {
82 --#{$prefix}spinner-animation-speed: #{$spinner-animation-speed * 2};
83 }
84 }
85}
Note: See TracBrowser for help on using the repository browser.