More theming improvements

src/lib/components/AuthUI/index.svelte

@@ -36,7 +36,7 @@
   <div class="container border border-gray bg-white dark:bg-gray-800">
     <div class="flex items-center flex-col p-2 lg:px-8 lg:py-3">
       {#if !showOnlyContent || showLogo}
-        <div class="flex items-center justify-center w-full pt-2">
+        <div class="flex flex-col items-center justify-center w-full pt-2">
           <Avatar
             src={$currentOrg.avatar_url ? $currentOrg.avatar_url : '/logo-192.png'}
             name={$currentOrg.name ? $currentOrg.name : 'ClassroomIO'}
@@ -45,7 +45,7 @@
             height="h-10"
             className="mr-2"
           />
-          <h4 class="dark:text-white text-xl">
+          <h4 class="dark:text-white text-xl mt-0">
             {$currentOrg.name ? $currentOrg.name : 'ClassroomIO'}
           </h4>
         </div>

src/lib/components/Avatar/index.svelte

@@ -7,4 +7,4 @@
   export let height = 'h-10';
 </script>
 
-<img alt={name} {src} class="{className} {width} {height} {shape} bg-primary-100" />
+<img alt={name} {src} class="{className} {width} {height} {shape}" />

src/lib/components/PageNav/index.svelte

@@ -63,12 +63,22 @@
   {#if Array.isArray(navItems) && navItems.length}
     <div class="flex justify-evenly items-center">
       {#each navItems as item}
-        <a class="mr-5 text-sm flex items-center {item.isActive && 'active'}" href={item.href}>
+        <a
+          class="mr-5 pb-2 text-sm flex items-center relative {item.isActive
+            ? 'text-primary-700'
+            : 'dark:bg-gray-500 dark:text-white'}"
+          href={item.href}
+        >
           {item.label}
 
           {#if typeof item.badgeValue === 'number'}
             <Chip value={item.badgeValue} className="ml-1 bg-gray-300 dark:text-black" />
           {/if}
+          <span
+            class="absolute bottom-0 left-0 h-1 bg-primary-700 transition-all ease-in-out duration-500 {item.isActive
+              ? 'w-full'
+              : 'w-0'}"
+          />
         </a>
       {/each}
       {#if addButtonHref}