feat: dashboard billing (#193)

* feat: move plans into sharable json

* remove unused code

* update pnpm lock

* update plans.json

* implement early adopter pricing

* docs: update meta title and description

* Finished the UI for upgrading plans

* Updated the pricing plans

* Updated the cards ui

* use relative import

* improve styling of upgrade plan card

* styling improvements, lemonsqueezy setup

* trigger lemonsqueezy payment and add webhook

* update pnpm lock

* add logout route

* feat: complete billing functionality

* generate lock file

* make crypto false on browser

* feat: adding upgrade prompts to org

* chore: add upgrade icon to upload video

* feat: add upgrade prompt to certificate and settings

* feat: implement onboarding setup page (#229)

* working on the onboarding setup

* working on the onboarding page

* Almost done with the onboarding UI

* finished the UI of the onBoarding setup

* finished the UI of the onBoarding setup

* Implementing the functions to carryout the logic of updating the UI onmount if a user has carried out a certain step or not

* Implementing the functions to carryout the logic of updating the UI onmount if a user has carried out a certain step or not

* making some chnages

* finished the onBoarding task

* updated some logic

* Removed the uneeded svg from the static folder

* fixed isCoursePublished not returning a boolean

* improved the setup link protection

* chore: make menuItems reactive

* improve formatting

* format supabase queries

---------

Co-authored-by: Rotimi Best <[email protected]>

* revamp setup

* improve the upgrade experience

* migration

* feat: add lemonsqueezy customer portal

---------

Co-authored-by: emmanuel <[email protected]>

apps/dashboard/src/lib/components/Modal/index.svelte

@@ -24,7 +24,7 @@
 
 {#if open}
   <div
-    class="dialog fixed overflow-x-hidden overflow-y-auto inset-0 flex justify-center items-center z-50 bg-gray-100 bg-opacity-50"
+    class="dialog fixed inset-0 z-50 flex items-center justify-center overflow-y-auto overflow-x-hidden bg-gray-100 bg-opacity-50"
     on:click={onClose}
     role="presentation"
   >
@@ -32,12 +32,14 @@
     <div
       class="{maxWidth || 'container'} {size === 'sm'
         ? 'small'
-        : ''} bg-white dark:bg-neutral-800 mx-auto {width} shadow-lg p-5 pt-2 rounded-md"
+        : ''} mx-auto bg-white dark:bg-neutral-800 {width} rounded-md pt-2 shadow-lg"
       on:click={(e) => e.stopPropagation()}
       role="presentation"
     >
-      <div class="flex items-center justify-between mb-4">
-        <p class="dark:text-white text-md font-medium m-0">
+      <div
+        class="mb-4 flex items-center justify-between border border-l-0 border-r-0 border-t-0 border-gray-100 dark:border-neutral-600 p-4 px-5"
+      >
+        <p class="text-md m-0 font-medium dark:text-white">
           {modalHeading}
         </p>
         {#if isCloseable}
@@ -47,7 +49,7 @@
         {/if}
       </div>
 
-      <div class="body p-1 h-4/5 overflow-y-auto {containerClass}">
+      <div class="body h-4/5 overflow-y-auto p-6 {containerClass}">
         <slot />
       </div>
     </div>