apps/workbench/app/assets/stylesheets/loading.css.scss.erb

   1 <%# Copyright (C) The Arvados Authors. All rights reserved.
   2
   3 SPDX-License-Identifier: AGPL-3.0 %>
   4
   5 .loading {
   6     opacity: 0;
   7 }
   8
   9 .spinner {
  10     /* placeholder for stuff like $.find('.spinner').detach() */
  11 }
  12
  13 .spinner-32px {
  14     background-image: url('<%= asset_path('spinner_32px.gif') %>');
  15     background-repeat: no-repeat;
  16     width: 32px;
  17     height: 32px;
  18 }
  19
  20 .spinner-h-center {
  21     margin-left: auto;
  22     margin-right: auto;
  23 }
  24
  25 .spinner-v-center {
  26     position: relative;
  27     top: 45%;
  28 }
  29
  30 .rotating {
  31     color: #f00;
  32     /* Chrome and Firefox, at least in Linux, render a horrible shaky
  33        mess -- better not to bother.
  34
  35       animation-name: rotateThis;
  36       animation-duration: 2s;
  37       animation-iteration-count: infinite;
  38       animation-timing-function: linear;
  39       -moz-animation-name: rotateThis;
  40       -moz-animation-duration: 2s;
  41       -moz-animation-iteration-count: infinite;
  42       -moz-animation-timing-function: linear;
  43       -ms-animation-name: rotateThis;
  44       -ms-animation-duration: 2s;
  45       -ms-animation-iteration-count: infinite;
  46       -ms-animation-timing-function: linear;
  47       -webkit-animation-name: rotateThis;
  48       -webkit-animation-duration: 2s;
  49       -webkit-animation-iteration-count: infinite;
  50       -webkit-animation-timing-function: linear;
  51       */
  52 }
  53
  54 @keyframes rotateThis {
  55   from { transform: rotate( 0deg );   }
  56   to   { transform: rotate( 360deg ); }
  57 }
  58
  59 @-webkit-keyframes rotateThis {
  60   from { -webkit-transform: rotate( 0deg );   }
  61   to   { -webkit-transform: rotate( 360deg ); }
  62 }
  63
  64 @-moz-keyframes rotateThis {
  65   from { -moz-transform: rotate( 0deg );   }
  66   to   { -moz-transform: rotate( 360deg ); }
  67 }
  68
  69 @-ms-keyframes rotateThis {
  70   from { -ms-transform: rotate( 0deg );   }
  71   to   { -ms-transform: rotate( 360deg ); }
  72 }