diff --git a/vibn-frontend/_onboarding/onboarding-entrepreneur.tsx b/vibn-frontend/_onboarding/onboarding-entrepreneur.tsx index d2589b6..5d2f7cf 100644 --- a/vibn-frontend/_onboarding/onboarding-entrepreneur.tsx +++ b/vibn-frontend/_onboarding/onboarding-entrepreneur.tsx @@ -18,7 +18,7 @@ import { // Entrepreneur path β€” 4 steps. Each step is a focused question. const ENTREP_TOTAL = 4; -const ENTREP_STEP_NAMES = ["Type", "Idea", "Goal", "Look"]; +const ENTREP_STEP_NAMES = ["Type", "Idea", "Style", "Look"]; const IDEA_PROMPTS = [ "A community for indie game devs to swap playtesters, with weekly demo nights", @@ -172,62 +172,88 @@ function EntrepType({ value, onChange }) { ); } -const GOALS = [ +const SAAS_STYLES = [ { - id: "first_customer", - icon: "🎯", - label: "First real customer", - desc: "Someone I don't know pays me. Even once.", + id: "sidebar", + label: "Vertical Sidebar", + desc: "Left-side collapsible menu, data-dense. Ideal for CRM/dashboards.", }, { - id: "ten_users", - icon: "πŸ‘₯", - label: "Ten weekly users", - desc: "A signal the thing actually does something useful.", + id: "topbar", + label: "Top Horizontal + ⌘K", + desc: "Spacious top navigation with global command search bar.", }, { - id: "mrr_1k", - icon: "πŸ“ˆ", - label: "$1k MRR", - desc: "Enough to take it seriously.", - }, - { - id: "side_quit", - icon: "πŸšͺ", - label: "Replace my day job", - desc: "The long road. Make this the main thing.", - }, - { - id: "audience", - icon: "πŸ“£", - label: "Build a tiny audience", - desc: "200 emails, a community, something I can talk to.", - }, - { - id: "ship_it", - icon: "πŸš€", - label: "Just ship it", - desc: "I want the thing to exist.", + id: "rail", + label: "Slim Icon Rail", + desc: "Minimalist vertical narrow icon bar, maximizes workspace area.", }, ]; -function EntrepGoal({ value, onChange }) { +const MARKETPLACE_STYLES = [ + { + id: "flux", + label: "Dark Glass / Flux", + desc: "Modern dark-glass panels with glowing fuchsia aurora backdrops.", + }, + { + id: "minimal", + label: "Classic Minimal", + desc: "Warm parchment neutrals, high-contrast typography and clean grids.", + }, +]; + +const GENERAL_STYLES = [ + { + id: "bento", + label: "Dark Bento", + desc: "Modern dark UI, bento-box card clusters.", + }, + { + id: "swiss", + label: "Editorial Swiss", + desc: "Type-led, gridded, lots of white space β€” clean and academic.", + }, + { + id: "brutalist", + label: "Neo-Brutalist", + desc: "Bold offsets, thick hand-drawn borders, highly tactile and organic.", + }, +]; + +function EntrepStyle({ productType, value, onChange }) { + // Dynamically tailor the styles array based on what they picked on Page 2 + const isSaas = productType === "saas"; + const isMarketplace = productType === "marketplace"; + + const styles = isSaas + ? SAAS_STYLES + : isMarketplace + ? MARKETPLACE_STYLES + : GENERAL_STYLES; + return ( <> ({ - id: g.id, - label: g.label, - desc: g.desc, - icon: {g.icon}, + options={styles.map((s) => ({ + id: s.id, + label: s.label, + desc: s.desc, + icon: undefined, }))} value={value} onChange={onChange} - columns={2} + columns={styles.length === 3 ? 1 : 2} /> ); @@ -387,9 +413,13 @@ export function EntrepreneurPath({ canNext = (data.idea || "").trim().length >= 8; } else if (step === 2) { body = ( - onUpdate({ goal: v })} /> + onUpdate({ designStyle: v })} + /> ); - canNext = !!data.goal; + canNext = !!data.designStyle; } else { body = ( onUpdate({ vibe: v })} />