loading.vue 581 B

1234567891011121314151617181920212223242526272829303132333435363738
  1. <template>
  2. <div class="loader" />
  3. </template>
  4. <style scoped>
  5. .loader {
  6. border: 5px solid #f3f3f3;
  7. border-radius: 50%;
  8. border-top: 5px solid #3498db;
  9. width: 30px;
  10. height: 30px;
  11. -webkit-animation: spin 2s linear infinite;
  12. animation: spin 2s linear infinite;
  13. position: absolute;
  14. left: 50%;
  15. top: 50%;
  16. z-index: 22;
  17. }
  18. @-webkit-keyframes spin {
  19. 0% {
  20. -webkit-transform: rotate(0deg);
  21. }
  22. 100% {
  23. -webkit-transform: rotate(360deg);
  24. }
  25. }
  26. @keyframes spin {
  27. 0% {
  28. transform: rotate(0deg);
  29. }
  30. 100% {
  31. transform: rotate(360deg);
  32. }
  33. }
  34. </style>