setup complete

front/js/svelte/Account.svelte

@@ -24,7 +24,7 @@
     setContext("user", user);
 </script>
 <div style="text-align: center;background: var(--p20);padding: 20px;color: var(--p90)">
-    <h1><a class="text-decoration-none" href="{channel.lucentUrl}">{channel.name}</a></h1>
+    <h1><a class="text-decoration-none" href="{channel.lucentUrl}">{channel.name ?? "Lucent Setup"}</a></h1>
 </div>
 <div>
     <svelte:component this={components[view]} {title} {...data}/>

front/js/svelte/setup/Index.svelte

@@ -1,12 +1,20 @@
 <script>
     import Step from "./Step.svelte"
+
     export let steps;
+    export let allSuccess = false;
 
     console.log(steps);
 </script>
 <div class="wrapper-tiny">
 
-{#each steps as step}
-    <Step {step}></Step>
-{/each}
+    {#each steps as step}
+        <Step {step}></Step>
+    {/each}
+
+    <div style="text-align: center;margin-top: 30px;">
+    {#if allSuccess}
+        <a href="/lucent/register" class="bt">Create the first user</a>
+    {/if}
+    </div>
 </div>

front/sass/_datepicker.scss

@@ -0,0 +1,43 @@
+
+.flatpickr-wrapper {
+  display: block !important;
+}
+
+.editor-field {
+  .flatpickr-calendar {
+    border-radius: 12px !important;
+  }
+
+  .flatpickr-months .flatpickr-month {
+    background: var(--p30);
+      color: var(--text);
+      font-size: 12px;
+  }
+
+  .flatpickr-current-month .flatpickr-monthDropdown-months {
+      background: var(--p30);
+  }
+
+    .flatpickr-weekdays{
+        background: var(--p30);
+        color: var(--text);
+
+    }
+
+    .flatpickr-weekdaycontainer .flatpickr-weekday{
+        background: var(--p30);
+        color: var(--text);
+    }
+
+    .flatpickr-days{
+        background: var(--p10);
+        color: var(--text);
+    }
+
+    .flatpickr-time{
+        background: var(--p10);
+        color: var(--text);
+    }
+
+}
+

front/sass/_dialog.scss

@@ -15,7 +15,7 @@ body:has(dialog[open]) {
 
 dialog {
   margin: 2vh auto;
-  background-color: #fff;
+  background-color: var(--p10);
   padding: 34px;
   border: none;
   border-radius: 12px;
@@ -49,6 +49,6 @@ dialog::backdrop {
   position: sticky;
   top: -34px;
   z-index: 999;
-  background: #fff;
+  background-color: var(--p10);
   padding: 10px 0;
 }

front/sass/app.scss

@@ -70,6 +70,7 @@
 @import "./reference-tags";
 @import "./members";
 @import "./revisions";
+@import "./datepicker";
 
 body {
   background-color: var(--p10);
@@ -104,7 +105,3 @@ a {
 .lucent-component {
   position: relative;
 }
-
-.flatpickr-wrapper {
-  display: block!important;
-}