location eingebaut, back buttons angeglichen, paging & criteria korrigiert

bizmatch/src/app/pages/details/details-user/details-user.component.html

@@ -138,7 +138,7 @@
   @if(user){
   <div class="bg-white shadow-md rounded-lg overflow-hidden">
     <!-- Header -->
-    <div class="flex items-center justify-between p-4 border-b">
+    <div class="flex items-center justify-between p-4 border-b relative">
       <div class="flex items-center space-x-4">
         <!-- <img src="https://placehold.co/80x80" alt="Profile picture of Avery Brown smiling" class="w-20 h-20 rounded-full" /> -->
         @if(user.hasProfile){
@@ -167,7 +167,12 @@
         }
         <!-- <img src="https://placehold.co/45x60" class="w-11 h-14" /> -->
       </div>
-      <button class="text-red-500 text-2xl" (click)="historyService.goBack()">&times;</button>
+      <button
+        (click)="historyService.goBack()"
+        class="absolute top-4 right-4 bg-red-500 text-white rounded-full w-8 h-8 flex items-center justify-center hover:bg-red-600 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-opacity-50"
+      >
+        <i class="fas fa-times"></i>
+      </button>
     </div>
 
     <!-- Description -->
@@ -194,7 +199,7 @@
         </div>
         <div class="flex flex-col sm:flex-row sm:items-center">
           <span class="font-semibold w-40 p-2">Company Location</span>
-          <span class="p-2 flex-grow">{{ user.companyLocation }}</span>
+          <span class="p-2 flex-grow">{{ user.companyLocation.city }} - {{ user.companyLocation.state }}</span>
         </div>
       </div>