| // Loader Spinner |
| |
| @keyframes rotate { |
| 0% { transform: rotate(0deg);} |
| 100% { transform: rotate(360deg);} |
| } |
| |
| .loader__wrapper { |
| width: 115px; |
| height: 115px; |
| position: fixed; |
| top: 50%; |
| left: 50%; |
| transform: translate(-50%, -50%); |
| margin: 3em 0; |
| z-index: 91; |
| } |
| |
| .icon__loader { |
| width:100%; |
| height:100%; |
| transform: translateZ(0) rotate(360deg); |
| transform-origin: center center; |
| -moz-transform-origin: center center; /* firefox requires fixed values */ |
| animation: rotate 1s linear infinite; |
| svg circle { |
| stroke-dasharray: 80px; |
| stroke-dashoffset: 9.7px; |
| fill: transparent; |
| stroke: $base-01--02; |
| stroke-width: 5px; |
| stroke-linecap: round; |
| } |
| } |
| |
| .icon__loader-sm { |
| width: 1.4rem; |
| height: 1.4rem; |
| vertical-align: text-bottom; |
| border-width: .2em; |
| line-height:0; |
| } |
| |
| .loader__overlay { |
| display: block; |
| position: fixed; |
| top: 0; |
| left: 0; |
| background: $base-02--07; |
| height: 100%; |
| z-index: 90; |
| width: 100%; |
| } |