wip

client/admin/src/app/app.component.html

@@ -7,7 +7,6 @@
       <div
         class="w-full flex items-center justify-end ms-auto md:justify-between gap-x-1 md:gap-x-3"
       >
-
         <div class="hidden md:block">
           <!-- Search Input -->
           <div class="relative">
@@ -65,10 +64,7 @@
             <div
               class="absolute inset-y-0 end-0 flex items-center pointer-events-none z-20 pe-3 text-gray-400"
             >
-
+              <span class="mx-1"> </span>
-            <span class="mx-1">
-
-            </span>
               <span class="text-xs">/</span>
             </div>
           </div>
@@ -98,6 +94,7 @@
             <span class="sr-only">Search</span>
           </button>
 
+          <div class="dropdown">
             <button
               type="button"
               class="size-[38px] relative inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-full border border-transparent text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:hover:bg-neutral-700 dark:focus:bg-neutral-700"
@@ -119,82 +116,21 @@
               </svg>
               <span class="sr-only">Notifications</span>
             </button>
+            <ul
+              tabindex="0"
+              class="dropdown-content menu bg-base-100 rounded-box z-[1] w-52 p-2 shadow"
+            >
+              <li><a>Item 1</a></li>
+              <li><a>Item 2</a></li>
+            </ul>
+          </div>
 
-        <button
+          <a (click)="logout()" class="btn btn-sm btn-primary">Logout</a>
-          type="button"
-          class="size-[38px] relative inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-full border border-transparent text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 disabled:opacity-50 disabled:pointer-events-none dark:text-white dark:hover:bg-neutral-700 dark:focus:bg-neutral-700"
-        >
-          <svg
-            class="shrink-0 size-4"
-            xmlns="http://www.w3.org/2000/svg"
-            width="24"
-            height="24"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          >
-            <path d="M22 12h-4l-3 9L9 3l-3 9H2" />
-          </svg>
-          <span class="sr-only">Activity</span>
-        </button>
-
-        <!-- Dropdown -->
-        <div
-          class="hs-dropdown [--placement:bottom-right] relative inline-flex"
-        >
-          <button
-            id="hs-dropdown-account"
-            type="button"
-            class="size-[38px] inline-flex justify-center items-center gap-x-2 text-sm font-semibold rounded-full border border-transparent text-gray-800 focus:outline-none disabled:opacity-50 disabled:pointer-events-none dark:text-white"
-            aria-haspopup="menu"
-            aria-expanded="false"
-            aria-label="Dropdown"
-          >
-            <img
-              class="shrink-0 size-[38px] rounded-full"
-              src="https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80"
-              alt="Avatar"
-            />
-          </button>
-
-            <div
-              class="hs-dropdown-menu transition-[opacity,margin] duration hs-dropdown-open:opacity-100 opacity-0 hidden min-w-60 bg-white shadow-md rounded-lg mt-2 dark:bg-neutral-800 dark:border dark:border-neutral-700 dark:divide-neutral-700 after:h-4 after:absolute after:-bottom-4 after:start-0 after:w-full before:h-4 before:absolute before:-top-4 before:start-0 before:w-full"
-              role="menu"
-              aria-orientation="vertical"
-              aria-labelledby="hs-dropdown-account"
-            >
-              <div
-                class="py-3 px-5 bg-gray-100 rounded-t-lg dark:bg-neutral-700"
-              >
-                <p class="text-sm text-gray-500 dark:text-neutral-500">
-                  Signed in as
-                </p>
-                <p
-                  class="text-sm font-medium text-gray-800 dark:text-neutral-200"
-                >
-                  jamessite.com
-                </p>
-              </div>
-              <div class="p-1.5 space-y-0.5">
-                <a
-                  class="flex items-center gap-x-3.5 py-2 px-3 rounded-lg text-sm text-gray-800 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 dark:text-neutral-400 dark:hover:bg-neutral-700 dark:hover:text-neutral-300 dark:focus:bg-neutral-700 dark:focus:text-neutral-300"
-                  (click)="logout()"
-                >
-                  Logout
-                </a>
-              </div>
-            </div>
-        </div>
-        <!-- End Dropdown -->
         </div>
       </div>
     </nav>
   </header>
-    }
+} @else {
-@else {
   <div class="relative flex flex-col h-full max-h-full">
     <div class="px-6 pt-4">
       <!-- Logo -->
@@ -306,8 +242,7 @@
       <router-outlet />
     </div>
   </div>
-}
+} @else {
-@else {
   <div class="w-full">
     <div class="p-4 sm:p-6 space-y-4 sm:space-y-6">
       <router-outlet />