Started to refactor pages

client/components/pages/welcome/AiFeature.vue

@@ -64,7 +64,7 @@
               </ul>
 
               <div class="mt-6 sm:mt-8 flex text-center justify-center lg:justify-start">
-<!--                <v-button v-if="!authenticated" class="mr-2 block" :to="{ name: 'forms.create.guest' }" :arrow="true">-->
+<!--                <v-button v-if="!authenticated" class="mr-2 block" :to="{ name: 'forms-create-guest' }" :arrow="true">-->
 <!--                  Get started for free-->
 <!--                </v-button>-->
 <!--                <v-button v-else class="mr-2 block" :to="{ name: 'forms.create' }" :arrow="true">-->

client/components/pages/welcome/Testimonials.vue

@@ -1,5 +1,5 @@
 <template>
-  <iframe v-if="!isDarkMode" id="testimonialto-carousel-all-notionforms"
+  <iframe v-if="!isDark" id="testimonialto-carousel-all-notionforms"
           loading="lazy"
           src="https://embed.testimonial.to/carousel/all/notionforms?theme=light&autoplay=on&showmore=on&one-row=on&same-height=off"
           frameBorder="0" scrolling="no" width="100%"
@@ -8,6 +8,8 @@
 </template>
 
 <script>
+import {useDark} from "@vueuse/core";
+
 export default {
 
   props: {
@@ -18,9 +20,10 @@ export default {
   },
   data: () => ({}),
 
-  computed: {
-    isDarkMode () {
-      return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
+  setup () {
+    const isDark = useDark()
+    return {
+      isDark
     }
   },