diff --git a/src/app/spinner/spinner.component.html b/src/app/spinner/spinner.component.html index 9edd48e..91af365 100644 --- a/src/app/spinner/spinner.component.html +++ b/src/app/spinner/spinner.component.html @@ -1,2 +1,2 @@ -
+ diff --git a/src/app/spinner/spinner.component.scss b/src/app/spinner/spinner.component.scss index 4557eef..ded7d41 100644 --- a/src/app/spinner/spinner.component.scss +++ b/src/app/spinner/spinner.component.scss @@ -6,14 +6,10 @@ left: 0; height: 100vh; width: 100vw; - background: $black-alpha; + background: $yellow-alpha; background-image: url('/assets/images/loader.svg'); background-size: 200px 200px; background-repeat: no-repeat; background-position: center center; z-index: 100; - - &.active { - display: block; - } } diff --git a/src/app/spinner/spinner.component.ts b/src/app/spinner/spinner.component.ts index 536f259..2def854 100644 --- a/src/app/spinner/spinner.component.ts +++ b/src/app/spinner/spinner.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core' +import { Component, OnInit, Input, ViewChild, ElementRef, SimpleChanges } from '@angular/core' @Component({ selector: 'app-spinner', @@ -13,7 +13,13 @@ export class SpinnerComponent implements OnInit { ngOnInit(): void { } -/* + + ngOnChanges(changes: SimpleChanges) { + if(changes.show && changes.show.firstChange) { + this.loader(changes.show.currentValue ? 'show' : 'hide') + } + } + loader(action) { let op = 0 let timer = null @@ -29,7 +35,7 @@ export class SpinnerComponent implements OnInit { this.spinner.nativeElement.style.opacity = op this.spinner.nativeElement.style.filter = 'alpha(opacity=' + op * 100 + ")" op -= op * 0.1 - }, 50) + }, 20) break case 'hide': @@ -42,9 +48,9 @@ export class SpinnerComponent implements OnInit { this.spinner.nativeElement.style.opacity = op this.spinner.nativeElement.style.filter = 'alpha(opacity=' + op * 100 + ")" op += op * 0.1 - }, 50) + }, 20) break } - }*/ + } }