@vicoders/angular
Version:
- [Vicoders Angular Common Module](#vicoders-angular-common-module) - [Install](#install) - [How to use](#how-to-use) - [Pipes](#pipes) - [hasItem](#hasitem) - [isArray](#isarray) - [length](#length) - [orderBy](#orderby)
22 lines • 7.94 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component } from '@angular/core';
export class LoaderComponent {
constructor() { }
/**
* @return {?}
*/
ngOnInit() { }
}
LoaderComponent.decorators = [
{ type: Component, args: [{
// tslint:disable-next-line:component-selector
selector: 'loader',
template: "<div class=\"preloader-wrapper active small\">\n <div class=\"spinner-layer spinner-red-only\">\n <div class=\"circle-clipper left\">\n <div class=\"circle\"></div>\n </div>\n <div class=\"gap-patch\">\n <div class=\"circle\"></div>\n </div>\n <div class=\"circle-clipper right\">\n <div class=\"circle\"></div>\n </div>\n </div>\n</div>\n",
styles: [".preloader-wrapper{display:inline-block;position:relative;width:48px;height:48px}.preloader-wrapper.small{width:36px;height:36px}.preloader-wrapper.big{width:64px;height:64px}.preloader-wrapper.active{-webkit-animation:1568ms linear infinite container-rotate;animation:1568ms linear infinite container-rotate}@-webkit-keyframes container-rotate{to{-webkit-transform:rotate(360deg)}}@keyframes container-rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.spinner-layer{position:absolute;width:100%;height:100%;opacity:0;border-color:color(\"teal\", \"lighten-1\")}.spinner-blue,.spinner-blue-only{border-color:#4285f4}.spinner-red,.spinner-red-only{border-color:#ef6b59}.spinner-yellow,.spinner-yellow-only{border-color:#f4b400}.spinner-green,.spinner-green-only{border-color:#0f9d58}.active .spinner-layer.spinner-blue{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both blue-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both blue-fade-in-out}.active .spinner-layer.spinner-red{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both red-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both red-fade-in-out}.active .spinner-layer.spinner-yellow{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both yellow-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both yellow-fade-in-out}.active .spinner-layer.spinner-green{-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both green-fade-in-out;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate,5332ms cubic-bezier(.4,0,.2,1) infinite both green-fade-in-out}.active .spinner-layer,.active .spinner-layer.spinner-blue-only,.active .spinner-layer.spinner-green-only,.active .spinner-layer.spinner-red-only,.active .spinner-layer.spinner-yellow-only{opacity:1;-webkit-animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate;animation:5332ms cubic-bezier(.4,0,.2,1) infinite both fill-unfill-rotate}@-webkit-keyframes fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg)}}@keyframes fill-unfill-rotate{12.5%{-webkit-transform:rotate(135deg);transform:rotate(135deg)}25%{-webkit-transform:rotate(270deg);transform:rotate(270deg)}37.5%{-webkit-transform:rotate(405deg);transform:rotate(405deg)}50%{-webkit-transform:rotate(540deg);transform:rotate(540deg)}62.5%{-webkit-transform:rotate(675deg);transform:rotate(675deg)}75%{-webkit-transform:rotate(810deg);transform:rotate(810deg)}87.5%{-webkit-transform:rotate(945deg);transform:rotate(945deg)}to{-webkit-transform:rotate(1080deg);transform:rotate(1080deg)}}@-webkit-keyframes blue-fade-in-out{100%,25%,90%,from{opacity:1}26%,89%{opacity:0}}@keyframes blue-fade-in-out{100%,25%,90%,from{opacity:1}26%,89%{opacity:0}}@-webkit-keyframes red-fade-in-out{15%,51%,from{opacity:0}25%,50%{opacity:1}}@keyframes red-fade-in-out{15%,51%,from{opacity:0}25%,50%{opacity:1}}@-webkit-keyframes yellow-fade-in-out{40%,76%,from{opacity:0}50%,75%{opacity:1}}@keyframes yellow-fade-in-out{40%,76%,from{opacity:0}50%,75%{opacity:1}}@-webkit-keyframes green-fade-in-out{100%,65%,from{opacity:0}75%,90%{opacity:1}}@keyframes green-fade-in-out{100%,65%,from{opacity:0}75%,90%{opacity:1}}.gap-patch{position:absolute;top:0;left:45%;width:10%;height:100%;overflow:hidden;border-color:inherit}.gap-patch .circle{width:1000%;left:-450%}.circle-clipper{display:inline-block;position:relative;width:50%;height:100%;overflow:hidden;border-color:inherit}.circle-clipper .circle{width:200%;height:100%;border-width:3px;border-style:solid;border-color:inherit;border-bottom-color:transparent!important;border-radius:50%;-webkit-animation:none;animation:none;position:absolute;top:0;right:0;bottom:0}.circle-clipper.left .circle{left:0;border-right-color:transparent!important;-webkit-transform:rotate(129deg);transform:rotate(129deg)}.circle-clipper.right .circle{left:-100%;border-left-color:transparent!important;-webkit-transform:rotate(-129deg);transform:rotate(-129deg)}.active .circle-clipper.left .circle{-webkit-animation:1333ms cubic-bezier(.4,0,.2,1) infinite both left-spin;animation:1333ms cubic-bezier(.4,0,.2,1) infinite both left-spin}.active .circle-clipper.right .circle{-webkit-animation:1333ms cubic-bezier(.4,0,.2,1) infinite both right-spin;animation:1333ms cubic-bezier(.4,0,.2,1) infinite both right-spin}@-webkit-keyframes left-spin{from,to{-webkit-transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg)}}@keyframes left-spin{from,to{-webkit-transform:rotate(130deg);transform:rotate(130deg)}50%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}}@-webkit-keyframes right-spin{from,to{-webkit-transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg)}}@keyframes right-spin{from,to{-webkit-transform:rotate(-130deg);transform:rotate(-130deg)}50%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}}#spinnerContainer.cooldown{-webkit-animation:1568ms linear infinite container-rotate,.4s cubic-bezier(.4,0,.2,1) fade-out;animation:1568ms linear infinite container-rotate,.4s cubic-bezier(.4,0,.2,1) fade-out}@-webkit-keyframes fade-out{from{opacity:1}to{opacity:0}}@keyframes fade-out{from{opacity:1}to{opacity:0}}loader{display:block;width:100%;text-align:center;padding:20px}loader .preloader-wrapper .spinner-layer .left{float:left}loader .preloader-wrapper .spinner-layer .right{float:right}"]
}] }
];
LoaderComponent.ctorParameters = () => [];
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0B2aWNvZGVycy9hbmd1bGFyLyIsInNvdXJjZXMiOlsibGliL2RpcmVjdGl2ZXMvbG9hZGVyL2xvYWRlci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFRbEQsTUFBTTtJQUNKLGdCQUFlLENBQUM7Ozs7SUFFaEIsUUFBUSxLQUFJLENBQUM7OztZQVRkLFNBQVMsU0FBQzs7Z0JBRVQsUUFBUSxFQUFFLFFBQVE7Z0JBQ2xCLGtZQUFzQzs7YUFFdkMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgLy8gdHNsaW50OmRpc2FibGUtbmV4dC1saW5lOmNvbXBvbmVudC1zZWxlY3RvclxuICBzZWxlY3RvcjogJ2xvYWRlcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9sb2FkZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9sb2FkZXIuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBMb2FkZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgbmdPbkluaXQoKSB7fVxufVxuIl19