first iteration on frontend, done by claude because i'm lazy with frontend

2026-05-20 12:02:51 -06:00
parent 887ad1e981
commit 64efed0809
49 changed files with 11864 additions and 0 deletions
@@ -0,0 +1,93 @@
+<template>
+  <aside
+    id="sidenav-main"
+    :class="[
+      'max-w-62.5 ease-nav-brand z-990 fixed inset-y-0 my-4 ml-4 block w-full flex-wrap items-center justify-between overflow-y-auto rounded-2xl border-0 bg-white p-0 antialiased shadow-none transition-transform duration-200 xl:left-0 xl:translate-x-0 xl:bg-transparent',
+      open ? 'translate-x-0' : '-translate-x-full',
+    ]"
+  >
+    <div class="h-19.5">
+      <RouterLink
+        to="/dashboard"
+        class="block px-8 py-6 m-0 text-sm whitespace-nowrap text-slate-700"
+      >
+        <span class="ml-1 font-semibold transition-all duration-200 ease-nav-brand">
+          SoloPM
+        </span>
+      </RouterLink>
+    </div>
+
+    <hr class="h-px mt-0 bg-transparent bg-gradient-horizontal-dark" />
+
+    <div class="items-center block w-auto max-h-screen overflow-auto h-sidenav">
+      <ul class="flex flex-col pl-0 mb-0 list-none">
+
+        <li class="mt-0.5 w-full">
+          <RouterLink
+            to="/dashboard"
+            custom
+            v-slot="{ isActive, href, navigate }"
+          >
+            <a
+              :href="href"
+              @click="navigate"
+              :class="[
+                'py-2.7 text-sm ease-nav-brand my-0 mx-4 flex items-center whitespace-nowrap rounded-lg px-4 font-semibold transition-colors',
+                isActive
+                  ? 'shadow-soft-xl bg-white text-slate-700'
+                  : 'text-slate-500 hover:text-slate-700',
+              ]"
+            >
+              <div
+                :class="[
+                  'mr-2 flex h-8 w-8 items-center justify-center rounded-lg bg-center stroke-0 text-center xl:p-2.5',
+                  isActive
+                    ? 'bg-gradient-to-tl from-purple-700 to-pink-500 shadow-soft-2xl'
+                    : 'bg-white shadow-soft-sm',
+                ]"
+              >
+                <i
+                  :class="[
+                    'fas fa-tachometer-alt text-sm',
+                    isActive ? 'text-white' : 'text-slate-700',
+                  ]"
+                ></i>
+              </div>
+              Dashboard
+            </a>
+          </RouterLink>
+        </li>
+
+        <li class="pt-4 ml-2 pl-6 mt-4">
+          <h6 class="pl-6 ml-2 font-bold leading-tight uppercase text-xs opacity-60">
+            Projects
+          </h6>
+        </li>
+
+      </ul>
+    </div>
+
+    <div class="mx-4 mt-4">
+      <div class="relative flex min-w-0 flex-col items-center break-words rounded-2xl border-0 bg-white bg-clip-border shadow-none">
+        <div class="mb-7.5 h-28 w-full overflow-hidden rounded-xl">
+          <div class="bg-gradient-to-tl from-slate-600 to-slate-300 h-full w-full"></div>
+        </div>
+        <div class="-mt-14 w-3/4 text-center">
+          <p class="mt-0 mb-4 font-semibold leading-tight text-xs">Need help?</p>
+          <a
+            href="#"
+            class="inline-block w-full px-8 py-2 mb-4 font-bold text-center text-black uppercase transition-all ease-in bg-white border-0 rounded-lg shadow-soft-md bg-150 leading-pro text-xs hover:shadow-soft-2xl hover:scale-102"
+          >
+            Documentation
+          </a>
+        </div>
+      </div>
+    </div>
+  </aside>
+</template>
+
+<script setup lang="ts">
+import { RouterLink } from 'vue-router'
+
+defineProps<{ open: boolean }>()
+</script>