More themeing improvements

src/lib/components/Course/components/Ceritficate/Design.svelte

@@ -3,6 +3,7 @@
   import { goto } from '$app/navigation';
   import { updateCourse } from '$lib/utils/services/courses';
   import PrimaryButton from '$lib/components/PrimaryButton/index.svelte';
+  import { VARIANTS } from '$lib/components/PrimaryButton/constants';
   import TextArea from '$lib/components/Form/TextArea.svelte';
   import Professional from './certificates/Professional.svelte';
   import Plain from './certificates/Plain.svelte';
@@ -68,6 +69,7 @@
           </p>
           <PrimaryButton
             label="Go to Settings"
+            variant={VARIANTS.OUTLINED}
             className="rounded-md mt-3"
             onClick={() => goto(`org/${$currentOrg.siteName}/settings`)}
           />

src/lib/components/Course/components/Navigation/NavExpandable.svelte

@@ -24,7 +24,7 @@
 
 <div class="">
   <button
-    class="item relative flex items-center py-3 px-4 ml-2 mb-1 rounded hover:bg-gray-200 dark:hover:bg-gray-700 {isGroupActive &&
+    class="item relative flex items-center py-3 px-4 ml-2 mb-1 rounded hover:opacity-80 dark:hover:bg-gray-700 {isGroupActive &&
       NavClasses.active} w-[95%]"
     tabindex="0"
     on:click={onClick}

src/lib/components/Course/components/Navigation/index.svelte

@@ -197,7 +197,7 @@
                     aria-disabled={!item.is_unlocked}
                   >
                     <div
-                      class="flex items-center py-3 px-4 rounded hover:bg-gray-200 dark:hover:bg-gray-800 w-full {(
+                      class="flex items-center py-3 px-4 rounded hover:opacity-80 w-full {(
                         path || $page.url.pathname
                       ).includes(item.id) && NavClasses.active}"
                     >