Transferred and translated the frontend code from L10 to L12

resources/js/layouts/AuthenticatedLayout.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
+import AuthLayout from '@/layouts/auth/AuthSimpleLayout.vue';
+
+defineProps<{
+    title?: string;
+    description?: string;
+}>();
+</script>
+
+<template>
+    <div class="w-full p-8 bg-gray-900">
+        <ul class="flex justify-end gap-3 text-sm leading-normal">
+            <li>
+                <Link
+                    :href="route('forsiden')"
+                    target="_blank"
+                    class="inline-block mr-4 rounded-sm border border-black bg-[#1b1b18] px-5 py-1.5 text-sm leading-normal text-white hover:border-black hover:bg-black dark:border-[#eeeeec] dark:bg-[#eeeeec] dark:text-[#1C1C1A] dark:hover:border-white dark:hover:bg-white"
+                >
+                    ⬅️ Tilbake
+                </Link>
+                <Link
+                    :href="route('page-builder.landing-page.create')"
+                    target="_blank"
+                    class="inline-block rounded-sm border border-black bg-[#1b1b18] px-5 py-1.5 text-sm leading-normal text-white hover:border-black hover:bg-black dark:border-[#eeeeec] dark:bg-[#eeeeec] dark:text-[#1C1C1A] dark:hover:border-white dark:hover:bg-white"
+                >
+                    🧾 Ny side
+                </Link>
+            </li>
+        </ul>
+    </div>
+    <AuthLayout :title="title" :description="description">
+        <slot />
+    </AuthLayout>
+</template>

resources/js/layouts/PageBuilderLayout.vue

@@ -0,0 +1,47 @@
+<script setup>
+    import { onMounted, useSlots, computed } from 'vue';
+    import { initFlowbite } from 'flowbite';
+    import Toast from '@/Components/Toast.vue';
+
+    const slots = useSlots();
+    const hasHeader = computed(() => !!slots.header)
+
+    onMounted(() => {
+        initFlowbite();
+
+        // Force light mode (dark mode not implemented, yet)
+        // if the user has selected darkmode in the dashboard
+        document.documentElement.classList.remove('dark');
+        localStorage.setItem('dark', 'false');
+    });
+</script>
+
+<template>
+    <Toast :duration="8" />
+    <!-- Warn for small screens -->
+    <div class="lg:hidden text-center p-6 bg-yellow-100 text-yellow-800">
+        Denne funksjonen er kun tilgjengelig på større skjermer (LG og opp).
+    </div>
+
+    <!-- Main layout for large screens -->
+    <div class="hidden lg:block min-h-screen">
+        <!-- Optional Sticky Header -->
+         <header
+            v-if="slots.header"
+            class="fixed top-0 left-0 w-full z-30 bg-white dark:bg-gray-900 border-b border-gray-200 dark:border-gray-700 px-6 py-2 shadow-sm"
+         >
+            <div class="max-w-screen-xl mx-auto flex justify-between items-center h-[48px]">
+                <slot name="header" />
+            </div>
+         </header>
+
+         <main :class="{ 'pt-[56px]': hasHeader }">
+            <slot />
+         </main>
+    </div>
+    
+</template>
+
+<style scoped>
+/* Add any layout-specific styling here */
+</style>

resources/js/layouts/auth/AuthCardLayout.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import AppLogoIcon from '@/components/AppLogoIcon.vue';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import PageLogo from '@/Components/ArcticFooterLogo.vue';
 import { Link } from '@inertiajs/vue3';
 
 defineProps<{
@@ -12,9 +13,9 @@ defineProps<{
 <template>
     <div class="flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10">
         <div class="flex w-full max-w-md flex-col gap-6">
-            <Link :href="route('home')" class="flex items-center gap-2 self-center font-medium">
+            <Link :href="route('forsiden')" class="flex items-center gap-2 self-center font-medium">
                 <div class="flex h-9 w-9 items-center justify-center">
-                    <AppLogoIcon class="size-9 fill-current text-black dark:text-white" />
+                    <PageLogo />
                 </div>
             </Link>
 

resources/js/layouts/auth/AuthSimpleLayout.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import AppLogoIcon from '@/components/AppLogoIcon.vue';
 import { Link } from '@inertiajs/vue3';
+import PageLogo from '@/Components/ArcticFooterLogo.vue';
 
 defineProps<{
     title?: string;
@@ -13,18 +14,19 @@ defineProps<{
         <div class="w-full max-w-sm">
             <div class="flex flex-col gap-8">
                 <div class="flex flex-col items-center gap-4">
-                    <Link :href="route('home')" class="flex flex-col items-center gap-2 font-medium">
-                        <div class="mb-1 flex h-9 w-9 items-center justify-center rounded-md">
-                            <AppLogoIcon class="size-9 fill-current text-[var(--foreground)] dark:text-white" />
-                        </div>
-                        <span class="sr-only">{{ title }}</span>
-                    </Link>
                     <div class="space-y-2 text-center">
                         <h1 class="text-xl font-medium">{{ title }}</h1>
                         <p class="text-center text-sm text-muted-foreground">{{ description }}</p>
                     </div>
                 </div>
                 <slot />
+                
+                <Link :href="route('forsiden')" class="flex flex-col items-center gap-2 font-medium my-8">
+                    <div class="flex h-9 w-9 items-center justify-center rounded-md">
+                        <PageLogo />
+                    </div>
+                    <span class="sr-only">{{ title }}</span>
+                </Link>
             </div>
         </div>
     </div>

resources/js/layouts/auth/AuthSplitLayout.vue

@@ -16,7 +16,7 @@ defineProps<{
     <div class="relative grid h-dvh flex-col items-center justify-center px-8 sm:px-0 lg:max-w-none lg:grid-cols-2 lg:px-0">
         <div class="relative hidden h-full flex-col bg-muted p-10 text-white dark:border-r lg:flex">
             <div class="absolute inset-0 bg-zinc-900" />
-            <Link :href="route('home')" class="relative z-20 flex items-center text-lg font-medium">
+            <Link :href="route('forsiden')" class="relative z-20 flex items-center text-lg font-medium">
                 <AppLogoIcon class="mr-2 size-8 fill-current text-white" />
                 {{ name }}
             </Link>