draft market

src/sidebar/Sidebar.vue

@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { RouterLink } from 'vue-router';
+</script>
+
+<template>
+    <aside class="fixed top-0 left-0 z-40 w-64 h-screen transition-transform -translate-x-full sm:translate-x-0">
+        <div class="h-full px-3 py-4 overflow-y-auto bg-slate-700">
+            <ul class="space-y-2 font-medium">
+                <li>
+                    <RouterLink to="/reprocess" class="flex items-center p-2 rounded-md">
+                        <span>Reprocess</span>
+                    </RouterLink>
+                </li>
+                <li>
+                    <RouterLink to="/market" class="flex items-center p-2 rounded-md">
+                        <span>Market</span>
+                    </RouterLink>
+                </li>
+            </ul>
+        </div>
+    </aside>
+</template>
+
+<style scoped>
+.router-link-active {
+    @apply bg-emerald-500;
+}
+</style>

src/sidebar/index.ts

@@ -0,0 +1 @@
+export { default as Sidebar } from './Sidebar.vue';