From 850affbd55fee9cd48a82ade94a3a5e60fd737a8 Mon Sep 17 00:00:00 2001
From: Leonardo Bishop <me@leonardobishop.com>
Date: Wed, 22 Jan 2025 02:09:56 +0000
Subject: Add version and some icons

---
 components/Nav.vue | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

(limited to 'components/Nav.vue')

diff --git a/components/Nav.vue b/components/Nav.vue
index 06a0295..280af02 100644
--- a/components/Nav.vue
+++ b/components/Nav.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+import { Calendar, Icon, SquareGanttChart, TrainTrack } from 'lucide-vue-next';
+
 const route = useRouter();
 
 const navList = ref([
-  { title: "Agenda", path: "/agenda", navigating: false },
-  { title: "Events", path: "/events", navigating: false },
-  { title: "Tracks", path: "/tracks", navigating: false },
+  { title: "Agenda", path: "/agenda", icon: Calendar, navigating: false },
+  { title: "Events", path: "/events", icon: SquareGanttChart, navigating: false },
+  { title: "Tracks", path: "/tracks", icon: TrainTrack, navigating: false },
 ])
 
 route.beforeEach((to, from, next) => {
@@ -26,14 +28,18 @@ route.afterEach(() => {
     <ul class="nav-list">
       <li v-for="item in navList" :key="item.title" :class="{ active: $route.path === item.path }">
         <NuxtLink :to="item.path">
-          <span>{{ item.title }}</span> <Spinner v-if="item.navigating" color="var(--color-text-muted)" :size="16"/></NuxtLink>
-          
+          <span class="text-icon"><component :is="item.icon" /> <span>{{ item.title }}</span></span> <Spinner v-if="item.navigating" color="var(--color-text-muted)" :size="16"/></NuxtLink>
       </li>
     </ul>
   </Panel>
 </template>
 
 <style scoped>
+.text-icon > svg {
+  width: var(--text-normal);
+  height: var(--text-normal);
+}
+
 .nav-list {
   list-style: none;
   padding: 0;
-- 
cgit v1.2.3-70-g09d2