Migrate to modernize template

Web/src/app/pages/front-pages/about-us/about-us.component.ts

@@ -0,0 +1,48 @@
+import { Component, computed, signal } from '@angular/core';
+import { IconModule } from '../../../icon/icon.module';
+import { MaterialModule } from '../../../material.module';
+import { ImageSliderComponent } from '../image-slider/image-slider.component';
+import { FooterComponent } from '../footer/footer.component';
+//import { PagePricingComponent } from '../page-pricing/page-pricing.component';
+import {
+  setupCards,
+  stats,
+  users,
+} from '../front-pagesData';
+import { CommonModule } from '@angular/common';
+
+@Component({
+  selector: 'app-about-us',
+  imports: [IconModule,MaterialModule ,CommonModule,ImageSliderComponent,FooterComponent,
+    //PagePricingComponent
+  ],
+  templateUrl: './about-us.component.html',
+  styleUrl: './about-us.component.scss'
+})
+export class AboutUsComponent {
+  setupCards=setupCards;
+  stats = stats;
+    currentIndex = signal(0); // Starting from 0
+    users = users;
+   // Computed values to auto-update template
+   currentUser = computed(() => this.users[this.currentIndex()]);
+   displayCount = computed(
+     () => `${this.currentIndex() + 1}/${this.users.length}`
+   ); 
+    goPrev() {
+       if (this.currentIndex() > 0) {
+         this.currentIndex.update((i) => i - 1);
+       }
+     }
+   
+     goNext() {
+       if (this.currentIndex() < this.users.length - 1) {
+         this.currentIndex.update((i) => i + 1);
+       }
+ 
+ 
+      }
+
+
+     
+}