| @keyframes dw-spin { | |
| 0% { | |
| transform: rotate(0deg); | |
| } | |
| 100% { | |
| transform: rotate(360deg); | |
| } | |
| } | |
| @keyframes spin { | |
| 0% { | |
| transform: rotate(0deg); | |
| } | |
| 100% { | |
| transform: rotate(360deg); | |
| } | |
| } | |
| .dw-spinner { | |
| display: inline-block; | |
| box-sizing: border-box; | |
| flex-shrink: 0; | |
| border: 2px solid currentColor; | |
| border-top-color: transparent ; | |
| border-right-color: currentColor; | |
| border-bottom-color: currentColor; | |
| border-left-color: currentColor; | |
| border-radius: 50% ; | |
| opacity: 0.85; | |
| animation: dw-spin 0.75s linear infinite ; | |
| vertical-align: middle; | |
| transform-origin: center center; | |
| will-change: transform; | |
| } | |
| @media (prefers-reduced-motion: reduce) { | |
| .dw-spinner { | |
| animation: dw-spin 1.2s linear infinite ; | |
| } | |
| } | |