src/CoreBundle/Resources/views/Core/preloader_style.html.twig line 1

Open in your IDE?
  1. <style>
  2.     #vidiCorePreload{
  3.         background: white url('/bundles/landing/img/preload.svg') center center no-repeat;
  4.         position: fixed;
  5.         top: 0;
  6.         left: 0;
  7.         z-index: 10000;
  8.         width: 100%;
  9.         height: 100%;
  11.     }
  12.     #vidiCorePreload .needle{
  13.         width: 20px;
  14.         background: #DF2A2A;
  15.         height: 20px;
  16.         border-radius: 50%;
  17.         border: 1px #DF2A2A solid;
  18.         position: absolute;
  19.         left: 50%; top: 50%;
  20.         margin: -8px 0 0 -8px;
  21.         -webkit-animation: pegIt 4s infinite ease-in-out;
  22.         animation: pegIt 4s infinite ease-in-out;
  23.     }
  24.     #vidiCorePreload .needle:before{
  25.         content: "";
  26.         border-style: solid;
  27.         border-width: 3.5px 120px 3.5px 0;
  28.         width: 0px;
  29.         height: 1px;
  30.         border-color: transparent #df2a2a transparent transparent;
  31.         position: absolute;
  32.         right: 50%;
  33.         top: 50%;
  34.         margin: -3.5px 0 0 0;
  35.         border-radius: 0 50% 50% 20px;}
  36.     @keyframes pegIt {
  37.         0% {transform: rotate(0deg);}
  38.         16% {transform: rotate(75deg);}
  39.         25% {transform: rotate(55deg);}
  40.         30% {transform: rotate(90deg);}
  41.         36% {transform: rotate(170deg);}
  42.         42% {transform: rotate(150deg);}
  43.         50% {transform: rotate(227deg);}
  44.         100% {transform: rotate(227deg);}
  45.     }
  46.     @-webkit-keyframes pegIt {
  47.         0% {-webkit-transform: rotate(0deg);}
  48.         16% {-webkit-transform: rotate(75deg);}
  49.         25% {-webkit-transform: rotate(55deg);}
  50.         30% {-webkit-transform: rotate(90deg);}
  51.         36% {-webkit-transform: rotate(170deg);}
  52.         42% {-webkit-transform: rotate(150deg);}
  53.         50% {-webkit-transform: rotate(227deg);}
  54.         100% {-webkit-transform: rotate(227deg);}
  55.     }
  56.     /*MEDIA*/
  57.     @media (max-width: 575.98px) {
  58.         #vidiCorePreload {
  59.             background-size: 50% !important;
  60.         }
  62.         #vidiCorePreload .needle:before {
  63.             border-width: 3.5px 60px 3.5px 0 !important;
  64.         }
  65.     }
  66. </style>