update layout ui

client/src/app/features/dashboard/dashboard.component.html

@@ -1,3 +1,45 @@
-<main class="flex justify-center">
-  <p>Dashboard</p>
+<main class="relative overflow-hidden shadow-md sm:rounded-lg">
+  <table class="w-full text-sm text-left text-gray-500">
+    <caption
+      class="p-5 text-lg font-semibold text-left text-gray-900 bg-primary"
+    >
+      Our products
+      <p class="mt-1 text-sm font-normal text-gray-200">
+        Browse a list of Flowbite products designed to help you work and play,
+        stay organized, get answers, keep in touch, grow your business, and
+        more.
+      </p>
+    </caption>
+    <thead class="text-xs text-gray-700 uppercase bg-secondary">
+      <tr>
+        <th scope="col" class="px-6 py-3">Product name</th>
+        <th scope="col" class="px-6 py-3">Color</th>
+        <th scope="col" class="px-6 py-3">Category</th>
+        <th scope="col" class="px-6 py-3 sm:hidden md:block">Price</th>
+        <th scope="col" class="px-6 py-3">
+          <span class="sr-only">Edit</span>
+        </th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
+        <th
+          scope="row"
+          class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white"
+        >
+          Apple MacBook Pro 17"
+        </th>
+        <td class="px-6 py-4">Silver</td>
+        <td class="px-6 py-4">Laptop</td>
+        <td class="px-6 py-4 sm:hidden md:block">$2999</td>
+        <td class="px-6 py-4 text-right">
+          <a
+            href="#"
+            class="font-medium text-blue-600 dark:text-blue-500 hover:underline"
+            >Edit</a
+          >
+        </td>
+      </tr>
+    </tbody>
+  </table>
 </main>