feat: flatten routes and merge marketing and onboarding directories

2026-06-06 18:52:03 -07:00
parent 47417d13a0
commit 0480b306f1
139 changed files with 36409 additions and 229 deletions
--- a/design-templates/VIBN
+++ b/design-templates/VIBN
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<title>Atlas — Two-sided marketplace templates</title>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Inter+Tight:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400&family=DM+Serif+Display:ital@0;1&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="vibn-ai-templates/tokens.css">
+<link rel="stylesheet" href="vibn-marketplace/marketplace-tokens.css">
+<style>
+  html, body { margin: 0; padding: 0; min-height: 100%; background: #f0eee9; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif; }
+</style>
+<script src="https://unpkg.com/react@18.3.1/umd/react.development.js" integrity="sha384-hD6/rw4ppMLGNu3tX5cjIb+uRZ7UkRJ6BPkLpg4hAu/6onKUg4lLsHAs9EBPT82L" crossorigin="anonymous"></script>
+<script src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.development.js" integrity="sha384-u6aeetuaXnQ38mYT8rp6sbXaQe3NL9t+IBXmnYxwkUI2Hw4bsp2Wvmx4yRQF1uAm" crossorigin="anonymous"></script>
+<script src="https://unpkg.com/@babel/standalone@7.29.0/babel.min.js" integrity="sha384-m08KidiNqLdpJqLq95G/LEi8Qvjl/xUYll3QILypMoQ65QorJ9Lvtp2RXYGBFj1y" crossorigin="anonymous"></script>
+</head>
+<body>
+<div id="root"></div>
+
+<script type="text/babel" src="design-canvas.jsx"></script>
+<!-- Vibn base library -->
+<script type="text/babel" src="vibn-ai-templates/icons.jsx"></script>
+<script type="text/babel" src="vibn-ai-templates/components.jsx"></script>
+<script type="text/babel" src="vibn-ai-templates/shells.jsx"></script>
+<!-- Marketplace extension -->
+<script type="text/babel" src="vibn-marketplace/marketplace-components.jsx"></script>
+<script type="text/babel" src="vibn-marketplace/marketplace-shells.jsx"></script>
+
+<script type="text/babel" src="atlas-pages.jsx"></script>
+
+<script type="text/babel">
+  const { DesignCanvas, DCSection, DCArtboard } = window;
+  const {
+    AtlasHome, AtlasSearch, AtlasListing, AtlasCheckout,
+    AtlasMessages, AtlasGuestDash, AtlasHostDash, AtlasNewListing,
+  } = window;
+
+  // Wrap each page in .theme-flux — modern dark-glass aesthetic
+  // with violet/fuchsia aurora backdrop. The marketplace components
+  // are theme-aware, so swapping the class to `theme-atlas` or any
+  // other theme re-skins the whole tree.
+  const Atlas = ({ children }) => (
+    <div className="theme-flux" style={{ width: "100%", height: "100%" }}>{children}</div>
+  );
+
+  const W = 1440, H = 900;
+
+  function App() {
+    return (
+      <DesignCanvas>
+        <DCSection
+          id="public"
+          title="Public-facing · discovery → booking"
+          subtitle="The guest's path from landing to confirmed booking."
+        >
+          <DCArtboard id="home"     label="01 · Home / discovery" width={W} height={1500}><Atlas><AtlasHome/></Atlas></DCArtboard>
+          <DCArtboard id="search"   label="02 · Search results + map" width={W} height={H}><Atlas><AtlasSearch/></Atlas></DCArtboard>
+          <DCArtboard id="listing"  label="03 · Listing detail"  width={W} height={2400}><Atlas><AtlasListing/></Atlas></DCArtboard>
+          <DCArtboard id="checkout" label="04 · Checkout"         width={W} height={1100}><Atlas><AtlasCheckout/></Atlas></DCArtboard>
+        </DCSection>
+
+        <DCSection
+          id="guest"
+          title="Guest (demand-side) experience"
+          subtitle="Post-booking: managing trips and talking to hosts."
+        >
+          <DCArtboard id="g-trips"    label="05 · Guest dashboard · trips" width={W} height={H}><Atlas><AtlasGuestDash/></Atlas></DCArtboard>
+          <DCArtboard id="messages"   label="06 · Messages inbox"          width={W} height={H}><Atlas><AtlasMessages/></Atlas></DCArtboard>
+        </DCSection>
+
+        <DCSection
+          id="host"
+          title="Host (supply-side) experience"
+          subtitle="Earnings, calendar and listing creation."
+        >
+          <DCArtboard id="h-today"   label="07 · Host dashboard · today" width={W} height={H}><Atlas><AtlasHostDash/></Atlas></DCArtboard>
+          <DCArtboard id="h-new"     label="08 · New listing · step 3 of 6" width={W} height={H}><Atlas><AtlasNewListing/></Atlas></DCArtboard>
+        </DCSection>
+      </DesignCanvas>
+    );
+  }
+
+  ReactDOM.createRoot(document.getElementById('root')).render(<App />);
+</script>
+</body>
+</html>