/** * @file */ /* Credit: https://github.com/tobiasahlin/SpinKit */ @-webkit-keyframes rotateplane { 0% { -webkit-transform: perspective(120px); transform: perspective(120px); } 50% { -webkit-transform: perspective(120px) rotateY(180deg); transform: perspective(120px) rotateY(180deg); } 100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg); transform: perspective(120px) rotateY(180deg) rotateX(180deg); } } @keyframes rotateplane { 0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg); } 50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); } 100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } } .is-b-loading:not(.is-b-loaded) { -webkit-backface-visibility: hidden; backface-visibility: hidden; position: relative; min-height: 30px; } /* Hide for non-js users. */ .is-b-loading:not(.is-b-loaded)::before { display: none; } /* Core drupal.init.js provides this .js class for free as long as loaded. */ .js .is-b-loading:not(.is-b-loaded)::before { display: block; } /* Prevents costly double animations when Blur is enabled. */ .is-b-loading:not(.is-b-loaded):not([data-animation])::before { content: ''; width: 30px; height: 30px; max-width: 30px; background: #2eaae0; position: absolute; left: 50%; top: 50%; margin-left: -15px; margin-top: -15px; font-size: 0; z-index: 22; -webkit-animation: rotateplane 1.2s infinite ease-in-out; animation: rotateplane 1.2s infinite ease-in-out; }