This commit will add many fixes

package.json

@@ -31,6 +31,7 @@
     "@angular-devkit/build-angular": "^17.1.2",
     "@angular/cli": "^17.1.2",
     "@angular/compiler-cli": "^17.1.0",
+    "@tailwindcss/line-clamp": "^0.4.4",
     "@types/jasmine": "~5.1.0",
     "daisyui": "^4.7.3",
     "jasmine-core": "~5.1.0",

src/app/components/home/home.component.html

@@ -13,8 +13,7 @@
     </form>
   </div>
 
-
-  <div class="grid grid-cols-1 md:grid-cols-4 gap-6 lg:gap-4 sm:grid-cols-2 z-50">
+  <div class="grid grid-cols-1 md:grid-cols-4 gap-6 lg:gap-4 sm:grid-cols-2 z-50 auto-rows-fr">
     @for(project of projects | filter:searchText | paginate: { itemsPerPage: 8, currentPage: pageNumber }; track
     project.id){
     <app-project [metadata]="project" (info)="receiveInfo($event)"></app-project>

src/app/components/home/home.component.ts

@@ -50,7 +50,7 @@ export class HomeComponent {
     this._projectService.getProjects().pipe(
       takeUntilDestroyed(),
       map((data: Project[]) => {
-        this.projects = data ? data : []
+        this.projects = this.shuffleArray(data)
       }),
       catchError((_) => {
         return of([])
@@ -182,5 +182,9 @@ export class HomeComponent {
     return `${date.getDate()}/${date.getMonth() + 1}/${date.getFullYear()}`
   }
 
+  shuffleArray(array: Project[]): Project[]{
+    return array.sort(()=> Math.random() - 0.5)
+  }
+
 }
 

src/app/components/project/project.component.html

@@ -8,8 +8,8 @@
   </figure>
   <div class="card-body">
     <h2 class="card-title">{{metadata.name}}</h2>
-    <p>{{metadata.description}}</p>
-    <div class="card-actions justify-end">
+    <p  class="md:xl:lg:line-clamp-2 line-clamp-none">{{metadata.description}}</p>
+    <div class="card-actions justify-end pt-2">
       <button class="btn btn-neutral" (click)="shareInfo(metadata.name, metadata.url)">Check</button>
     </div>
   </div>

src/app/components/shared/footer/footer.component.html

@@ -1,6 +1,6 @@
-<footer class="footer footer-center p-4 text-base-content">
+<!-- <footer class="footer footer-center p-4 text-base-content">
   <aside>
     <p>Copyright © {{anio}} - All right reserved by <a class="link"
         href="https://lb.linkedin.com/in/ali-alachkar-47b48a190" target="_blank">Ali Alachkar</a></p>
   </aside>
-</footer>
+</footer> -->