vid-webpack-master/src/app/shared/components/spinner/spinner.component.scss

   1 .spinner {
   2   height: 150px;
   3   width: 150px;
   4   margin: 0 auto;
   5   -webkit-animation: rotation .6s infinite linear;
   6   animation: rotation .6s infinite linear;
   7   border: 6px solid rgba(0, 174, 239, 0.01);
   8   border-radius: 100%;
   9   position: absolute;
  10   z-index: 1000;
  11   left: 50%;
  12   right: 50%;
  13   top: 50%;
  14   bottom: 50%;
  15 }
  16
  17
  18
  19 .spinner:before {
  20   content: "";
  21   display: block;
  22   position: absolute;
  23   top: -6px;
  24   height: 100%;
  25   width: 100%;
  26   border-top: 6px solid #009fdb;
  27   border-left: 6px solid transparent;
  28   border-bottom: 6px solid #c3161600;
  29   border-right: 6px solid transparent;
  30   border-radius: 100%;
  31 }
  32
  33 @-webkit-keyframes rotation {
  34   from {-webkit-transform: rotate(0deg);}
  35   to {-webkit-transform: rotate(359deg);}
  36 }
  37 @-moz-keyframes rotation {
  38   from {-moz-transform: rotate(0deg);}
  39   to {-moz-transform: rotate(359deg);}
  40 }
  41 @-o-keyframes rotation {
  42   from {-o-transform: rotate(0deg);}
  43   to {-o-transform: rotate(359deg);}
  44 }
  45 @keyframes rotation {
  46   from {transform: rotate(0deg);}
  47   to {transform: rotate(359deg);}
  48 }
  49
  50 .spinner-sm {
  51   height:16px;
  52   width:16px;
  53 }
  54
  55 .spinner-md {
  56   height:40px;
  57   width:40px;
  58 }
  59
  60 .spinner-lr {
  61   height:150px;
  62   width:150px;
  63 }
  64
  65 .spinner-red {
  66   border:6px solid rgba(216, 27, 34, .15);
  67 }
  68
  69 .spinner-red:before {
  70   border-top:6px solid rgba(216, 27, 34, 1);
  71 }
  72
  73 .spinner-green {
  74   border:6px solid rgba(40, 183, 121, .15);
  75 }
  76
  77 .spinner-green:before {
  78   border-top:6px solid rgba(40, 183, 121, 1);
  79 }
  80
  81 .spinner-grey {
  82   border:6px solid rgba(139, 146, 154, .15);
  83 }
  84
  85 .spinner-grey:before {
  86   border-top:6px solid rgba(139, 146, 154, 1);
  87 }