Initial Commit

2026-08-28 21:50:26 +10:00
commit d8d4ecbe8a
142 changed files with 25234 additions and 0 deletions
@@ -0,0 +1,73 @@
+<!-- index.vue -->
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted } from 'vue';
+import Feed from '@/components/dredge/Feed/Feed.vue';
+import MainHeader from '@/components/dredge/MainHeader.vue';
+import Sidebar from '@/components/dredge/Sidebar/Sidebar.vue';
+import Stories from '@/components/dredge/Stories/Stories.vue';
+
+const depth = ref(0);
+const maxDepth = 4000;
+
+function onScroll() {
+    const scrolled = window.scrollY;
+    depth.value = Math.min(maxDepth, Math.round(scrolled * 3.4));
+}
+
+onMounted(() => window.addEventListener('scroll', onScroll, { passive: true }));
+onUnmounted(() => window.removeEventListener('scroll', onScroll));
+</script>
+
+<template>
+    <Main>
+        <div class="dredge">
+            <MainHeader />
+            <div class="dredge__body">
+                <div class="dredge__main">
+                    <Stories />
+                    <slot />
+                </div>
+                <Sidebar />
+            </div>
+        </div>
+    </Main>
+</template>
+
+<style scoped>
+.dredge {
+    --abyss: #050b14;
+    --midwater: #0e1f2e;
+    --panel: #10222f;
+    --line: #1c3140;
+    --sediment: #cdbfa4;
+    --sediment-dim: #8f8a78;
+    --haze: #6e8a96;
+    --bioluminum: #4ce0d2;
+    --rust-net: #b8663f;
+
+    background: var(--abyss);
+    color: var(--sediment);
+    min-height: 100vh;
+    font-family: 'Inter', system-ui, sans-serif;
+}
+
+.dredge__main {
+    min-width: 0;
+}
+
+.dredge__body {
+    display: grid;
+    grid-template-columns: minmax(0, 640px) 320px;
+    gap: 2.5rem;
+    max-width: 1040px;
+    margin: 0 auto;
+    padding: 2rem 1.5rem 4rem;
+    align-items: start;
+}
+
+@media (max-width: 860px) {
+    .dredge__body {
+        grid-template-columns: 1fr;
+    }
+}
+</style>