Init commit

resources/js/Components/Layout/AppLogo.vue

@@ -0,0 +1,10 @@
+<script setup>
+import { appName } from '@/app.ts'
+</script>
+
+<template>
+    <router-link class="flex justify-center items-center gap-3" to="/">
+        <img src="@/Assets/logo.png" alt="logo DatBrowser" class="h-20" />
+        <h1 class="text-xl font-display select-none">{{ appName }}</h1>
+    </router-link>
+</template>

resources/js/Components/Layout/Content/TitleDescription.vue

@@ -0,0 +1,4 @@
+<template>
+    <h2 class="text-xl"><slot name="title" /></h2>
+    <p class="text-dark-green"><slot name="description" /></p>
+</template>

resources/js/Components/Layout/MainNav/MainNavItem.vue

@@ -0,0 +1,21 @@
+<script setup lang="ts">
+import Card from "@/Components/ui/card/Card.vue";
+import CardContent from "@/Components/ui/card/CardContent.vue";
+import { Link } from "@inertiajs/vue3";
+
+defineProps<{
+    link: string;
+}>();
+</script>
+
+<template>
+    <li>
+        <Link :href="link">
+            <Card :class="{ 'bg-secondary': $page.url === link, 'hover:bg-gray': $page.url !== link ,'w-full transition': true }">
+                <CardContent class="p-3">
+                    <slot />
+                </CardContent>
+            </Card>
+        </Link>
+    </li>
+</template>

resources/js/Components/Layout/MainNav/MainNavJobLink.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+import MainNavItem from "@/Components/Layout/MainNav/MainNavItem.vue";
+import { Job } from "@/types/Jobs/job";
+
+defineProps<{
+    job: Job;
+}>();
+</script>
+
+<template>
+    <MainNavItem :link="`/job/${job.id}`">
+        {{ job.name }}
+    </MainNavItem>
+</template>