The Basics finished

Huascar321 · Jun 30, 2022 · e6b7fc3 · e6b7fc3
1 parent b7713dd
commit e6b7fc3
Show file tree

Hide file tree

Showing 3 changed files with 1 addition and 41 deletions.
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -13,7 +13,7 @@ <h3>I'm in the AppComponent!</h3>
       <hr>
       <button class="btn btn-primary" (click)="showHidden($event)">Display Details</button>
       <p *ngIf="isDisplaying">Secret: Password = tune</p>
-      <p [ngStyle]="{backgroundColor: getColor()}" *ngFor="let clicInfo of buttonClicks">{{ buttonClicks }}</p>
+      <div [ngStyle]="{backgroundColor: i >= 4 ? 'blue' : 'transparent'}" *ngFor="let clicInfo of buttonClicks; let i = index" [ngClass]="{}">{{ buttonClicks }}</div>
     </div>
   </div>
 </div>
diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -10,8 +10,6 @@ export class AppComponent {
   isUsernameEmpty: boolean = false;
   isDisplaying: boolean = false;
   buttonClicks: string[] = [];
-  counter: number = 0;
-  areFiveElements: boolean = false;
 
   onResetUsername(event: Event) {
     this.username = '';
@@ -28,15 +26,8 @@ export class AppComponent {
   }
 
   private registerButtonClicks(event: Event): void {
-    this.counter === 4 ? this.areFiveElements = true : false;
     let toDate = new Date(event.timeStamp);
     let data = `${toDate.getMinutes()}:${toDate.getUTCSeconds()}`
     this.buttonClicks.push(data);
-    this.counter++;
   }
-
-  getColor(): string {
-    return this.areFiveElements ? 'blue' : '' ;
-  }
-
 }