diff --git a/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.html b/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.html index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..b160f02ce5794c071193441f24a969c5b9b540af 100644 --- a/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.html +++ b/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.html @@ -0,0 +1,4 @@ +<mat-icon *ngIf="classes === PENDING" + class="icon" +>autorenew +</mat-icon> diff --git a/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.scss b/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.scss index 633d97cec4af7c03cadc0e9e20a3ade5ddb06736..47cf7a6747fff89bb923e7c973e6038124af3e6d 100644 --- a/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.scss +++ b/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.scss @@ -2,6 +2,11 @@ $size: 20px; :host { + .icon { + font-size: $size; + color: $white; + } + width: $size; height: $size; background-color: $medium-light-grey; @@ -26,20 +31,17 @@ $size: 20px; } &.pending { - animation-name: blink; + animation-name: rotate; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: linear; - @keyframes blink { + @keyframes rotate { from { - opacity: 1; - } - 50% { - opacity: 0; + transform: rotate(0deg); } to { - opacity: 1; + transform: rotate(360deg); } } } diff --git a/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.ts b/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.ts index 50d48ed3d61b2cda06831c42152fbbec482e8ff7..2291683e658dac2ca502eae20a68b6811e7bfbce 100644 --- a/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.ts +++ b/src/app/shared/components/presentationals/shared-datafile-quick-status/shared-datafile-quick-status.presentational.ts @@ -32,6 +32,8 @@ export class SharedDatafileQuickStatusPresentational extends SharedAbstractPrese @HostBinding("class") classes: string; + readonly PENDING: string = "pending"; + getColor(): string { switch (this.value) { case DataFileStatusEnum.READY: @@ -51,7 +53,7 @@ export class SharedDatafileQuickStatusPresentational extends SharedAbstractPrese return "cleaned"; default: this.toolipToTranslate = TRANSLATE("dataFileQuickStatus.pending"); - return "pending"; + return this.PENDING; } } }