mark/master-ai
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: remove deprecated modular marketing components (Group 3)

Browse Source
This commit is contained in:
mawkone
2026-06-06 18:27:17 -07:00
parent 135fc2d1e6
commit 1ed76c99b8
16 changed files with 1 additions and 1361 deletions
Download Patch File Download Diff File Expand all files Collapse all files

281
vibn-frontend/app/(justine)/features/page.tsx
View File

@@ -1,281 +0,0 @@
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import {
Code2,
Brain,
BarChart3,
Zap,
Github,
Sparkles,
Clock,
DollarSign,
Users,
FileCode,
TrendingUp,
Shield
} from "lucide-react";
export default function FeaturesPage() {
return (
<div className="container py-8 md:py-12 lg:py-24">
<div className="mx-auto flex max-w-[980px] flex-col items-center gap-4">
<h1 className="font-serif text-4xl font-bold leading-tight tracking-tight md:text-6xl lg:leading-[1.1]">
Powerful Features for AI Developers
</h1>
<p className="max-w-[750px] text-center text-lg text-muted-foreground">
Everything you need to track, analyze, and optimize your AI-powered development workflow.
</p>
</div>
{/* Main Features */}
<div className="mx-auto grid max-w-6xl grid-cols-1 gap-6 pt-12 md:grid-cols-2 lg:grid-cols-3">
<Card>
<CardHeader>
<Code2 className="h-12 w-12 text-primary" />
<CardTitle>Automatic Session Tracking</CardTitle>
<CardDescription>
Every coding session is automatically captured with zero configuration.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Real-time session monitoring</li>
<li>• File change tracking</li>
<li>• Keystroke and activity metrics</li>
<li>• AI request logging</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Brain className="h-12 w-12 text-primary" />
<CardTitle>AI Usage Analytics</CardTitle>
<CardDescription>
Deep insights into how you and your team use AI tools.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Token usage by model</li>
<li>• Request/response tracking</li>
<li>• Prompt effectiveness analysis</li>
<li>• Model performance comparison</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<DollarSign className="h-12 w-12 text-primary" />
<CardTitle>Cost Tracking</CardTitle>
<CardDescription>
Real-time cost monitoring for all your AI services.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Per-project cost breakdown</li>
<li>• Daily/weekly/monthly reports</li>
<li>• Budget alerts</li>
<li>• Cost attribution per developer</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Clock className="h-12 w-12 text-primary" />
<CardTitle>Productivity Metrics</CardTitle>
<CardDescription>
Track your velocity and identify productivity patterns.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Active coding time</li>
<li>• Lines of code metrics</li>
<li>• Time-to-completion tracking</li>
<li>• Peak productivity hours</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Github className="h-12 w-12 text-primary" />
<CardTitle>GitHub Integration</CardTitle>
<CardDescription>
Connect your repositories for comprehensive code analysis.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Repository structure analysis</li>
<li>• Dependency tracking</li>
<li>• Architecture visualization</li>
<li>• Tech stack detection</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Sparkles className="h-12 w-12 text-primary" />
<CardTitle>Smart Summaries</CardTitle>
<CardDescription>
AI-powered summaries of your work and progress.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Daily work summaries</li>
<li>• Project progress reports</li>
<li>• Key accomplishments</li>
<li>• Improvement suggestions</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Users className="h-12 w-12 text-primary" />
<CardTitle>Team Collaboration</CardTitle>
<CardDescription>
Built for teams working with AI tools together.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Team dashboards</li>
<li>• Shared project insights</li>
<li>• Collaborative analytics</li>
<li>• Knowledge sharing</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<FileCode className="h-12 w-12 text-primary" />
<CardTitle>Code Quality Tracking</CardTitle>
<CardDescription>
Monitor code quality and AI-generated code effectiveness.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• AI vs manual code tracking</li>
<li>• Quality metrics</li>
<li>• Bug pattern detection</li>
<li>• Code review insights</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<TrendingUp className="h-12 w-12 text-primary" />
<CardTitle>Trend Analysis</CardTitle>
<CardDescription>
Understand long-term patterns in your development process.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Historical trend charts</li>
<li>• Performance over time</li>
<li>• Seasonal patterns</li>
<li>• Predictive insights</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Shield className="h-12 w-12 text-primary" />
<CardTitle>Privacy & Security</CardTitle>
<CardDescription>
Your code and data stay private and secure.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• End-to-end encryption</li>
<li>• No code storage</li>
<li>• GDPR compliant</li>
<li>• SOC 2 Type II certified</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<Zap className="h-12 w-12 text-primary" />
<CardTitle>Real-Time Insights</CardTitle>
<CardDescription>
Get instant feedback as you code.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Live dashboards</li>
<li>• Instant notifications</li>
<li>• Real-time cost updates</li>
<li>• Activity streaming</li>
</ul>
</CardContent>
</Card>
<Card>
<CardHeader>
<BarChart3 className="h-12 w-12 text-primary" />
<CardTitle>Custom Reports</CardTitle>
<CardDescription>
Create custom reports tailored to your needs.
</CardDescription>
</CardHeader>
<CardContent>
<ul className="space-y-2 text-sm text-muted-foreground">
<li>• Customizable dashboards</li>
<li>• Export to CSV/PDF</li>
<li>• Scheduled reports</li>
<li>• Custom metrics</li>
</ul>
</CardContent>
</Card>
</div>
{/* Integration Section */}
<div className="mx-auto mt-24 max-w-4xl">
<h2 className="mb-8 text-center text-3xl font-bold">Seamless Integrations</h2>
<div className="grid grid-cols-2 gap-8 md:grid-cols-4">
<div className="flex flex-col items-center gap-2">
<div className="flex h-16 w-16 items-center justify-center rounded-lg bg-muted">
<Code2 className="h-8 w-8" />
</div>
<span className="text-sm font-medium">Cursor</span>
</div>
<div className="flex flex-col items-center gap-2">
<div className="flex h-16 w-16 items-center justify-center rounded-lg bg-muted">
<Brain className="h-8 w-8" />
</div>
<span className="text-sm font-medium">ChatGPT</span>
</div>
<div className="flex flex-col items-center gap-2">
<div className="flex h-16 w-16 items-center justify-center rounded-lg bg-muted">
<Github className="h-8 w-8" />
</div>
<span className="text-sm font-medium">GitHub</span>
</div>
<div className="flex flex-col items-center gap-2">
<div className="flex h-16 w-16 items-center justify-center rounded-lg bg-muted">
<Sparkles className="h-8 w-8" />
</div>
<span className="text-sm font-medium">More Soon</span>
</div>
</div>
</div>
</div>
);
}

47
vibn-frontend/app/(justine)/layout.tsx
View File

@@ -1,47 +0,0 @@
import type { Metadata } from "next";
import { Plus_Jakarta_Sans } from "next/font/google";
import { homepage } from "@/marketing/content/homepage";
import { JustineNav } from "@/marketing/components/justine/JustineNav";
import { JustineFooter } from "@/marketing/components/justine/JustineFooter";
import "../styles/justine/01-homepage.css";
const justineJakarta = Plus_Jakarta_Sans({
subsets: ["latin"],
weight: ["400", "500", "600", "700", "800"],
variable: "--font-justine-jakarta",
display: "swap",
});
export const metadata: Metadata = {
title: homepage.meta.title,
description: homepage.meta.description,
openGraph: {
title: homepage.meta.title,
description: homepage.meta.description,
url: "https://www.vibnai.com",
siteName: "VIBN",
type: "website",
},
twitter: {
card: "summary_large_image",
title: homepage.meta.title,
description: homepage.meta.description,
},
};
export default function JustineLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<div
data-justine
className={`${justineJakarta.variable} flex min-h-screen flex-col`}
>
<JustineNav />
<main>{children}</main>
<JustineFooter />
</div>
);
}

195
vibn-frontend/app/(justine)/pricing/page.tsx
View File

@@ -1,195 +0,0 @@
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import Link from "next/link";
import { Check } from "lucide-react";
export default function PricingPage() {
return (
<div className="container py-8 md:py-12 lg:py-24">
<div className="mx-auto flex max-w-[980px] flex-col items-center gap-4">
<h1 className="text-4xl font-extrabold leading-tight tracking-tighter md:text-6xl lg:leading-[1.1]">
Simple, Transparent Pricing
</h1>
<p className="max-w-[750px] text-center text-lg text-muted-foreground">
Start free, upgrade when you need more. No hidden fees, no surprises.
</p>
</div>
<div className="mx-auto grid max-w-5xl grid-cols-1 gap-6 pt-12 md:grid-cols-3">
{/* Free Tier */}
<Card>
<CardHeader>
<CardTitle className="text-2xl">Free</CardTitle>
<CardDescription>Perfect for trying out Vibn</CardDescription>
<div className="mt-4">
<span className="text-4xl font-bold">$0</span>
<span className="text-muted-foreground">/month</span>
</div>
</CardHeader>
<CardContent className="space-y-4">
<ul className="space-y-3">
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Up to 100 sessions/month</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>1 project</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Basic analytics</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>7-day data retention</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Cursor integration</span>
</li>
</ul>
<Link href="/auth" className="block">
<Button variant="outline" className="w-full">
Get Started
</Button>
</Link>
</CardContent>
</Card>
{/* Pro Tier */}
<Card className="relative border-primary shadow-lg">
<div className="absolute right-4 top-4 rounded-full bg-primary px-3 py-1 text-xs text-primary-foreground">
Popular
</div>
<CardHeader>
<CardTitle className="text-2xl">Pro</CardTitle>
<CardDescription>For serious developers</CardDescription>
<div className="mt-4">
<span className="text-4xl font-bold">$19</span>
<span className="text-muted-foreground">/month</span>
</div>
</CardHeader>
<CardContent className="space-y-4">
<ul className="space-y-3">
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span className="font-medium">Unlimited sessions</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span className="font-medium">Unlimited projects</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Advanced analytics</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>90-day data retention</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>ChatGPT integration</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>GitHub integration</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Priority support</span>
</li>
</ul>
<Link href="/auth" className="block">
<Button className="w-full">
Start Pro Trial
</Button>
</Link>
</CardContent>
</Card>
{/* Team Tier */}
<Card>
<CardHeader>
<CardTitle className="text-2xl">Team</CardTitle>
<CardDescription>For teams and organizations</CardDescription>
<div className="mt-4">
<span className="text-4xl font-bold">$49</span>
<span className="text-muted-foreground">/month</span>
</div>
</CardHeader>
<CardContent className="space-y-4">
<ul className="space-y-3">
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span className="font-medium">Everything in Pro</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Up to 10 team members</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Team analytics</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Unlimited data retention</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Custom integrations</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>SSO support</span>
</li>
<li className="flex items-center gap-2">
<Check className="h-5 w-5 text-green-600" />
<span>Dedicated support</span>
</li>
</ul>
<Link href="/auth" className="block">
<Button variant="outline" className="w-full">
Contact Sales
</Button>
</Link>
</CardContent>
</Card>
</div>
{/* FAQ Section */}
<div className="mx-auto mt-16 max-w-3xl">
<h2 className="mb-8 text-center text-3xl font-bold">Frequently Asked Questions</h2>
<div className="space-y-6">
<div>
<h3 className="mb-2 text-lg font-semibold">Can I try Pro for free?</h3>
<p className="text-muted-foreground">
Yes! All new accounts get a 14-day free trial of Pro features. No credit card required.
</p>
</div>
<div>
<h3 className="mb-2 text-lg font-semibold">What happens when I exceed the free tier limits?</h3>
<p className="text-muted-foreground">
We&apos;ll notify you when you&apos;re approaching your limits. You can upgrade anytime to continue tracking without interruption.
</p>
</div>
<div>
<h3 className="mb-2 text-lg font-semibold">Can I cancel anytime?</h3>
<p className="text-muted-foreground">
Yes, you can cancel your subscription at any time. You&apos;ll retain access until the end of your billing period.
</p>
</div>
<div>
<h3 className="mb-2 text-lg font-semibold">Do you offer discounts for students or non-profits?</h3>
<p className="text-muted-foreground">
Yes! Contact us at support@vibnai.com for special pricing for students, educators, and non-profit organizations.
</p>
</div>
</div>
</div>
</div>
);
}

181
vibn-frontend/app/(justine)/privacy/page.tsx
View File

@@ -1,181 +0,0 @@
import type { Metadata } from "next";
export const metadata: Metadata = {
title: "Privacy Policy — Vib'n",
description: "How Vib'n collects, uses, and protects your personal information.",
};
export default function PrivacyPage() {
const lastUpdated = "February 19, 2026";
return (
<div className="container max-w-3xl mx-auto py-16 px-6">
<h1 className="text-3xl font-bold mb-2">Privacy Policy</h1>
<p className="text-sm text-muted-foreground mb-10">Last updated: {lastUpdated}</p>
<div className="prose prose-neutral dark:prose-invert max-w-none space-y-8">
<section>
<p>
Vib&apos;n (&quot;we&quot;, &quot;us&quot;, or &quot;our&quot;) is operated by Mark Henderson,
located in Victoria, British Columbia, Canada. We are committed to protecting your
personal information in accordance with the <em>Personal Information Protection Act</em> (BC PIPA)
and Canada&apos;s <em>Personal Information Protection and Electronic Documents Act</em> (PIPEDA).
</p>
<p className="mt-4">
This policy explains what information we collect when you use vibnai.com, how we use
it, and what rights you have over it.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">1. Information We Collect</h2>
<h3 className="font-medium mb-2">Information you provide</h3>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>Your name and email address when you sign in with Google</li>
<li>Project names, descriptions, and content you create on the platform</li>
<li>Code and files stored in your Vib&apos;n repositories</li>
<li>Conversations with the AI assistant</li>
</ul>
<h3 className="font-medium mt-4 mb-2">Information collected automatically</h3>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>Session tokens to keep you signed in</li>
<li>Basic usage data (pages visited, features used) for product improvement</li>
<li>Server logs including IP address and browser type for security and debugging</li>
</ul>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">2. How We Use Your Information</h2>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>To provide, operate, and improve the Vib&apos;n platform</li>
<li>To authenticate you and maintain your session</li>
<li>To power AI features — your project context is sent to the Gemini API to generate responses</li>
<li>To send transactional emails (account, billing) when necessary</li>
<li>To detect and prevent fraud, abuse, or security incidents</li>
</ul>
<p className="mt-3 text-muted-foreground">
We do not sell your personal information to third parties. We do not use your data
to train AI models.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">3. Third-Party Services</h2>
<p className="text-muted-foreground mb-3">We use the following third-party services to operate Vib&apos;n:</p>
<div className="overflow-x-auto">
<table className="w-full text-sm border-collapse">
<thead>
<tr className="border-b">
<th className="text-left py-2 pr-4 font-medium">Service</th>
<th className="text-left py-2 pr-4 font-medium">Purpose</th>
<th className="text-left py-2 font-medium">Location</th>
</tr>
</thead>
<tbody className="text-muted-foreground">
<tr className="border-b">
<td className="py-2 pr-4">Google OAuth</td>
<td className="py-2 pr-4">Sign-in authentication</td>
<td className="py-2">USA</td>
</tr>
<tr className="border-b">
<td className="py-2 pr-4">Google Gemini API</td>
<td className="py-2 pr-4">AI chat and code assistance</td>
<td className="py-2">USA</td>
</tr>
<tr className="border-b">
<td className="py-2 pr-4">Google Cloud Run</td>
<td className="py-2 pr-4">IDE workspace hosting</td>
<td className="py-2">Canada</td>
</tr>
<tr>
<td className="py-2 pr-4">PostgreSQL (self-hosted)</td>
<td className="py-2 pr-4">User and project data storage</td>
<td className="py-2">Canada</td>
</tr>
</tbody>
</table>
</div>
<p className="mt-3 text-muted-foreground text-sm">
By using Vib&apos;n, you consent to your data being processed in these jurisdictions.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">4. Data Retention</h2>
<p className="text-muted-foreground">
We retain your account and project data for as long as your account is active.
If you delete your account, we will delete your personal information within 30 days,
except where we are required to retain it by law (e.g. billing records for 7 years
under Canadian tax regulations).
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">5. Your Rights</h2>
<p className="text-muted-foreground mb-3">Under BC PIPA and PIPEDA, you have the right to:</p>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>Access the personal information we hold about you</li>
<li>Correct inaccurate information</li>
<li>Request deletion of your account and associated data</li>
<li>Withdraw consent for non-essential data processing</li>
<li>Lodge a complaint with the Office of the Information and Privacy Commissioner for BC</li>
</ul>
<p className="mt-3 text-muted-foreground">
To exercise any of these rights, email us at{" "}
<a href="mailto:privacy@vibnai.com" className="underline underline-offset-4">
privacy@vibnai.com
</a>.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">6. Cookies</h2>
<p className="text-muted-foreground">
We use a single session cookie to keep you signed in. We do not use advertising
cookies or third-party tracking pixels. You can clear cookies in your browser at any
time, which will sign you out of Vib&apos;n.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">7. Security</h2>
<p className="text-muted-foreground">
We use HTTPS for all data in transit, encrypted storage for sensitive credentials,
and session-based authentication. No system is 100% secure — if you discover a
security issue please contact us at{" "}
<a href="mailto:security@vibnai.com" className="underline underline-offset-4">
security@vibnai.com
</a>.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">8. Changes to This Policy</h2>
<p className="text-muted-foreground">
We may update this policy from time to time. We will notify you of material changes
by posting the new policy on this page with an updated date. Continued use of Vib&apos;n
after changes constitutes acceptance of the updated policy.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">9. Contact</h2>
<p className="text-muted-foreground">
For any privacy questions or concerns:
</p>
<address className="not-italic mt-2 text-muted-foreground">
Mark Henderson<br />
Vib&apos;n<br />
Victoria, British Columbia, Canada<br />
<a href="mailto:privacy@vibnai.com" className="underline underline-offset-4">
privacy@vibnai.com
</a>
</address>
</section>
</div>
</div>
);
}

1
vibn-frontend/app/(justine)/stories/page.tsx
View File

@@ -1 +0,0 @@
export { default } from "../features/page";

188
vibn-frontend/app/(justine)/terms/page.tsx
View File

@@ -1,188 +0,0 @@
import type { Metadata } from "next";
export const metadata: Metadata = {
title: "Terms of Service — Vib'n",
description: "Terms governing your use of the Vib'n platform.",
};
export default function TermsPage() {
const lastUpdated = "February 19, 2026";
return (
<div className="container max-w-3xl mx-auto py-16 px-6">
<h1 className="text-3xl font-bold mb-2">Terms of Service</h1>
<p className="text-sm text-muted-foreground mb-10">Last updated: {lastUpdated}</p>
<div className="prose prose-neutral dark:prose-invert max-w-none space-y-8">
<section>
<p>
These Terms of Service (&quot;Terms&quot;) govern your use of Vib&apos;n, operated by
Mark Henderson in Victoria, British Columbia, Canada (&quot;we&quot;, &quot;us&quot;,
or &quot;our&quot;). By creating an account or using vibnai.com, you agree to these Terms.
If you do not agree, do not use the service.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">1. The Service</h2>
<p className="text-muted-foreground">
Vib&apos;n is an AI-powered software development platform that provides code repositories,
a browser-based IDE, and AI assistance tools. We reserve the right to modify, suspend,
or discontinue any part of the service at any time with reasonable notice where possible.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">2. Accounts</h2>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>You must be at least 16 years old to use Vib&apos;n</li>
<li>You are responsible for maintaining the security of your account</li>
<li>You are responsible for all activity that occurs under your account</li>
<li>You must notify us immediately of any unauthorized access at{" "}
<a href="mailto:security@vibnai.com" className="underline underline-offset-4">
security@vibnai.com
</a>
</li>
<li>One person may not maintain more than one free account</li>
</ul>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">3. Acceptable Use</h2>
<p className="text-muted-foreground mb-3">You agree not to use Vib&apos;n to:</p>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>Violate any applicable law or regulation</li>
<li>Build, distribute, or host malware, spyware, or other malicious software</li>
<li>Infringe on the intellectual property rights of others</li>
<li>Harass, threaten, or harm any person</li>
<li>Attempt to gain unauthorized access to any system or network</li>
<li>Use automated tools to scrape or stress-test the platform without permission</li>
<li>Resell or sublicense access to the platform without our written consent</li>
<li>Use AI features to generate content that is illegal, defamatory, or harmful</li>
</ul>
<p className="mt-3 text-muted-foreground">
We reserve the right to suspend or terminate accounts that violate these terms.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">4. Your Content</h2>
<p className="text-muted-foreground">
You retain ownership of all code, files, and content you create on Vib&apos;n.
By using the platform, you grant us a limited licence to store, display, and process
your content solely to provide the service. We do not claim ownership of your work
and do not use your content to train AI models.
</p>
<p className="mt-3 text-muted-foreground">
You are responsible for ensuring you have the rights to any content you upload or
generate through the platform.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">5. AI Features</h2>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>AI-generated code and suggestions are provided as-is without warranty</li>
<li>You are responsible for reviewing and testing any AI-generated output before use</li>
<li>Do not submit sensitive personal data, passwords, or confidential business secrets to the AI assistant</li>
<li>AI responses may be inaccurate — always verify critical information independently</li>
</ul>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">6. Payment and Credits</h2>
<ul className="list-disc pl-6 space-y-1 text-muted-foreground">
<li>Subscription fees are billed monthly or annually as selected at checkout</li>
<li>Credits for AI usage are consumed as you use AI features and do not roll over unless stated</li>
<li>All fees are in Canadian dollars (CAD) unless otherwise stated</li>
<li>We do not offer refunds for partial months or unused credits, except where required by law</li>
<li>We will provide 30 days notice before any price changes take effect</li>
</ul>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">7. Availability and Uptime</h2>
<p className="text-muted-foreground">
We aim to maintain high availability but do not guarantee uninterrupted service.
Scheduled maintenance will be announced in advance where possible. We are not liable
for losses arising from service downtime or interruptions.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">8. Intellectual Property</h2>
<p className="text-muted-foreground">
The Vib&apos;n name, logo, platform design, and underlying software are owned by us and
protected by applicable intellectual property laws. You may not copy, modify, or
distribute our platform or branding without express written permission.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">9. Disclaimer of Warranties</h2>
<p className="text-muted-foreground">
Vib&apos;n is provided &quot;as is&quot; and &quot;as available&quot; without warranties of any kind,
express or implied, including but not limited to merchantability, fitness for a
particular purpose, or non-infringement. We do not warrant that the service will
be error-free or that AI outputs will be accurate or complete.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">10. Limitation of Liability</h2>
<p className="text-muted-foreground">
To the maximum extent permitted by applicable law, we shall not be liable for any
indirect, incidental, special, consequential, or punitive damages, or any loss of
profits or data, arising from your use of the service. Our total liability to you
for any claim shall not exceed the amount you paid us in the 3 months prior to the
claim.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">11. Termination</h2>
<p className="text-muted-foreground">
You may cancel your account at any time from your account settings. We may suspend
or terminate your account for violation of these Terms, with notice where reasonably
possible. Upon termination, you may request an export of your data within 30 days.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">12. Governing Law</h2>
<p className="text-muted-foreground">
These Terms are governed by the laws of the Province of British Columbia and the
federal laws of Canada applicable therein. Any disputes shall be resolved in the
courts of Victoria, British Columbia, Canada.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">13. Changes to These Terms</h2>
<p className="text-muted-foreground">
We may update these Terms from time to time. We will notify you of material changes
at least 30 days in advance by email or by posting a notice on the platform.
Continued use after changes take effect constitutes acceptance.
</p>
</section>
<section>
<h2 className="text-xl font-semibold mb-3">14. Contact</h2>
<p className="text-muted-foreground">
For questions about these Terms:
</p>
<address className="not-italic mt-2 text-muted-foreground">
Mark Henderson<br />
Vib&apos;n<br />
Victoria, British Columbia, Canada<br />
<a href="mailto:legal@vibnai.com" className="underline underline-offset-4">
legal@vibnai.com
</a>
</address>
</section>
</div>
</div>
);
}

33
vibn-frontend/marketing/components/cta.tsx
View File

@@ -1,33 +0,0 @@
import { Button } from "@/components/ui/button";
import { Sparkles, Calendar } from "lucide-react";
import Link from "next/link";
import { homepage } from "@/marketing/content/homepage";
export function CTA() {
return (
<section className="w-full py-16 md:py-24">
<div className="container mx-auto px-6">
<div className="vibn-cta-surface mx-auto flex max-w-[980px] flex-col items-center gap-6 rounded-2xl border border-border p-12 md:p-16">
<h2 className="font-serif text-2xl font-semibold leading-tight tracking-tight md:text-4xl lg:text-5xl text-center max-w-[800px]">
{homepage.finalCTA.title}
</h2>
<div className="flex flex-col sm:flex-row gap-4 pt-4">
<Link href="/auth?new=1">
<Button size="lg" className="h-12 px-8 text-base">
<Sparkles className="mr-2 h-5 w-5" />
{homepage.finalCTA.cta.primary}
</Button>
</Link>
<Link href="https://calendly.com/your-link" target="_blank" rel="noopener noreferrer">
<Button variant="outline" size="lg" className="h-12 px-8 text-base">
<Calendar className="mr-2 h-5 w-5" />
{homepage.finalCTA.cta.secondary}
</Button>
</Link>
</div>
</div>
</div>
</section>
);
}

22
vibn-frontend/marketing/components/emotional-hook.tsx
View File

@@ -1,22 +0,0 @@
import { homepage } from "@/marketing/content/homepage";
export function EmotionalHook() {
return (
<section className="w-full py-16 md:py-24">
<div className="container mx-auto px-6">
<div className="mx-auto max-w-[800px] text-center space-y-4">
<h2 className="font-serif text-3xl font-semibold tracking-tight md:text-5xl">
{homepage.emotionalHook.title}
</h2>
<p className="vibn-gradient-text font-serif text-4xl font-semibold tracking-tight md:text-6xl">
{homepage.emotionalHook.subtitle}
</p>
<p className="text-lg text-muted-foreground md:text-xl pt-4 leading-relaxed">
{homepage.emotionalHook.description}
</p>
</div>
</div>
</section>
);
}

32
vibn-frontend/marketing/components/features.tsx
View File

@@ -1,32 +0,0 @@
import { Card, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { homepage } from "@/marketing/content/homepage";
export function Features() {
return (
<section id="features" className="w-full py-16 md:py-24">
<div className="container mx-auto px-6">
<div className="mx-auto flex max-w-[980px] flex-col items-center gap-4 mb-12">
<h2 className="font-serif text-3xl font-semibold leading-tight tracking-tight md:text-5xl text-center">
{homepage.features.title}
</h2>
<p className="max-w-[750px] text-center text-lg text-muted-foreground md:text-xl">
{homepage.features.description}
</p>
</div>
<div className="mx-auto grid max-w-6xl grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3">
{homepage.features.list.map((feature, index) => (
<Card key={index} className="transition-all hover:border-primary/50">
<CardHeader>
<CardTitle className="text-lg">{feature.title}</CardTitle>
<CardDescription className="text-base leading-relaxed">
{feature.description}
</CardDescription>
</CardHeader>
</Card>
))}
</div>
</div>
</section>
);
}

140
vibn-frontend/marketing/components/footer.tsx
View File

@@ -1,140 +0,0 @@
import Link from "next/link";
import { Github, Mail } from "lucide-react";
const YEAR = new Date().getFullYear();
const links = {
product: [
{ label: "Features", href: "/#features" },
{ label: "How It Works", href: "/#how-it-works" },
{ label: "Pricing", href: "/#pricing" },
{ label: "Sign In", href: "/auth" },
{ label: "Get Started", href: "/auth?new=1" },
],
resources: [
{ label: "GitHub", href: "https://github.com/MawkOne/viben", external: true },
{ label: "Documentation", href: "https://github.com/MawkOne/viben", external: true },
{ label: "Changelog", href: "https://github.com/MawkOne/viben/releases", external: true },
],
legal: [
{ label: "Privacy Policy", href: "/privacy" },
{ label: "Terms of Service", href: "/terms" },
{ label: "Contact", href: "mailto:hello@vibnai.com", external: true },
],
};
export function Footer() {
return (
<footer className="border-t bg-muted/30">
<div className="container mx-auto px-6 py-12 md:py-16">
{/* Top — logo + columns */}
<div className="grid grid-cols-2 gap-8 md:grid-cols-4 lg:grid-cols-4">
{/* Brand */}
<div className="col-span-2 md:col-span-1">
<Link href="/" className="flex items-center gap-2 mb-4">
<img src="/vibn-black-circle-logo.png" alt="Vib'n" className="h-8 w-8" />
<span className="font-serif text-lg font-bold tracking-tight">Vib&apos;n</span>
</Link>
<p className="text-sm text-muted-foreground leading-relaxed max-w-[220px]">
AI-powered development platform for vibe coders. From idea to market.
</p>
<div className="flex items-center gap-3 mt-5">
<a
href="https://github.com/MawkOne/viben"
target="_blank"
rel="noopener noreferrer"
aria-label="GitHub"
className="text-muted-foreground hover:text-foreground transition-colors"
>
<Github className="h-5 w-5" />
</a>
<a
href="mailto:hello@vibnai.com"
aria-label="Email"
className="text-muted-foreground hover:text-foreground transition-colors"
>
<Mail className="h-5 w-5" />
</a>
</div>
</div>
{/* Product */}
<div>
<h3 className="text-sm font-semibold mb-4">Product</h3>
<ul className="space-y-3">
{links.product.map((l) => (
<li key={l.label}>
<Link
href={l.href}
className="text-sm text-muted-foreground hover:text-foreground transition-colors"
>
{l.label}
</Link>
</li>
))}
</ul>
</div>
{/* Resources */}
<div>
<h3 className="text-sm font-semibold mb-4">Resources</h3>
<ul className="space-y-3">
{links.resources.map((l) => (
<li key={l.label}>
<a
href={l.href}
target={l.external ? "_blank" : undefined}
rel={l.external ? "noopener noreferrer" : undefined}
className="text-sm text-muted-foreground hover:text-foreground transition-colors"
>
{l.label}
</a>
</li>
))}
</ul>
</div>
{/* Legal */}
<div>
<h3 className="text-sm font-semibold mb-4">Legal</h3>
<ul className="space-y-3">
{links.legal.map((l) => (
<li key={l.label}>
{l.external ? (
<a
href={l.href}
className="text-sm text-muted-foreground hover:text-foreground transition-colors"
>
{l.label}
</a>
) : (
<Link
href={l.href}
className="text-sm text-muted-foreground hover:text-foreground transition-colors"
>
{l.label}
</Link>
)}
</li>
))}
</ul>
</div>
</div>
{/* Bottom bar */}
<div className="mt-12 pt-8 border-t flex flex-col items-center justify-between gap-3 md:flex-row">
<p className="text-xs text-muted-foreground">
© {YEAR} Vib&apos;n · Victoria, British Columbia, Canada
</p>
<p className="text-xs text-muted-foreground">
Built with ❤️ for vibe coders everywhere
</p>
</div>
</div>
</footer>
);
}

43
vibn-frontend/marketing/components/hero.tsx
View File

@@ -1,43 +0,0 @@
import { Button } from "@/components/ui/button";
import Link from "next/link";
import { Sparkles, ArrowRight } from "lucide-react";
import { homepage } from "@/marketing/content/homepage";
export function Hero() {
return (
<section className="w-full">
<div className="container mx-auto px-6">
<div className="flex flex-col items-center gap-6 pb-16 pt-16 md:py-24 lg:py-32">
<div className="flex max-w-[980px] flex-col items-center gap-6 text-center">
{/* Main title */}
<h1 className="font-serif text-3xl font-bold leading-tight tracking-tight md:text-5xl md:font-semibold lg:text-6xl lg:leading-[1.1]">
{homepage.hero.title}
</h1>
{/* Subtitle */}
<p className="max-w-[750px] text-lg text-muted-foreground sm:text-xl md:text-2xl">
{homepage.hero.subtitle}
</p>
{/* CTAs */}
<div className="flex flex-col sm:flex-row gap-4 mt-4">
<Link href="/auth?new=1">
<Button size="lg" className="h-12 px-8 text-base">
<Sparkles className="mr-2 h-5 w-5" />
{homepage.hero.cta.primary}
</Button>
</Link>
<Link href="#how-it-works">
<Button variant="outline" size="lg" className="h-12 px-8 text-base">
{homepage.hero.cta.secondary}
<ArrowRight className="ml-2 h-5 w-5" />
</Button>
</Link>
</div>
</div>
</div>
</div>
</section>
);
}

39
vibn-frontend/marketing/components/how-it-works.tsx
View File

@@ -1,39 +0,0 @@
import { homepage } from "@/marketing/content/homepage";
export function HowItWorks() {
return (
<section id="how-it-works" className="w-full py-16 md:py-24">
<div className="container mx-auto px-6">
<div className="mx-auto max-w-[900px] space-y-12">
<div className="text-center space-y-4">
<h2 className="font-serif text-3xl font-semibold tracking-tight md:text-5xl">
{homepage.howItWorks.title}
</h2>
<p className="text-lg text-muted-foreground md:text-xl">
{homepage.howItWorks.description}
</p>
</div>
<div className="space-y-8 pt-8">
{homepage.howItWorks.steps.map((step) => (
<div key={step.number} className="flex gap-6">
<div className="flex-shrink-0">
<div className="flex h-12 w-12 items-center justify-center rounded-full bg-primary text-primary-foreground font-bold text-xl">
{step.number}
</div>
</div>
<div className="space-y-2 pt-1">
<h3 className="text-2xl font-bold">{step.title}</h3>
<p className="text-lg text-muted-foreground leading-relaxed">
{step.description}
</p>
</div>
</div>
))}
</div>
</div>
</div>
</section>
);
}

16
vibn-frontend/marketing/components/index.ts
View File

@@ -1,15 +1 @@
/** // Public components exports from subdirectories when needed
* Marketing Components
* All marketing-specific components for the landing page
*/
export { Hero } from "./hero";
export { EmotionalHook } from "./emotional-hook";
export { WhoItsFor } from "./who-its-for";
export { Transformation } from "./transformation";
export { Features } from "./features";
export { HowItWorks } from "./how-it-works";
export { Pricing } from "./pricing";
export { CTA } from "./cta";
export { Footer } from "./footer";

69
vibn-frontend/marketing/components/pricing.tsx
View File

@@ -1,69 +0,0 @@
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Check } from "lucide-react";
import Link from "next/link";
import { homepage } from "@/marketing/content/homepage";
export function Pricing() {
return (
<section id="pricing" className="w-full py-16 md:py-24">
<div className="container mx-auto px-6">
<div className="mx-auto max-w-[980px] space-y-12">
<div className="text-center space-y-4">
<h2 className="font-serif text-3xl font-semibold tracking-tight md:text-5xl">
{homepage.pricing.title}
</h2>
<p className="text-lg text-muted-foreground md:text-xl">
{homepage.pricing.description}
</p>
</div>
<div className="grid gap-8 md:grid-cols-3 pt-8">
{homepage.pricing.tiers.map((tier) => (
<Card
key={tier.name}
className={`flex flex-col ${
tier.highlighted
? "border-primary shadow-lg scale-105"
: ""
}`}
>
<CardHeader>
<CardTitle className="text-2xl">{tier.name}</CardTitle>
<CardDescription className="text-base">
{tier.description}
</CardDescription>
<div className="pt-4">
<span className="text-4xl font-bold">{tier.price}</span>
{tier.price !== "Free" && (
<span className="text-muted-foreground">/month</span>
)}
</div>
</CardHeader>
<CardContent className="flex-1 space-y-4">
<ul className="space-y-3">
{tier.features.map((feature, index) => (
<li key={index} className="flex items-start gap-3">
<Check className="h-5 w-5 text-primary mt-0.5 flex-shrink-0" />
<span className="text-sm">{feature}</span>
</li>
))}
</ul>
<Link href="/auth" className="block pt-4">
<Button
className="w-full"
variant={tier.highlighted ? "default" : "outline"}
>
{tier.price === "Free" ? "Start Free" : "Get Started"}
</Button>
</Link>
</CardContent>
</Card>
))}
</div>
</div>
</div>
</section>
);
}

36
vibn-frontend/marketing/components/transformation.tsx
View File

@@ -1,36 +0,0 @@
import { Sparkles } from "lucide-react";
import { homepage } from "@/marketing/content/homepage";
export function Transformation() {
return (
<section className="w-full py-16 md:py-24 bg-muted/30">
<div className="container mx-auto px-6">
<div className="mx-auto max-w-[900px] space-y-12">
<div className="text-center space-y-4">
<h2 className="font-serif text-3xl font-semibold tracking-tight md:text-5xl">
{homepage.transformation.title}
</h2>
<p className="text-lg text-muted-foreground md:text-xl pt-4 leading-relaxed">
{homepage.transformation.description}
</p>
</div>
<div className="grid gap-6 md:grid-cols-2 pt-8">
{homepage.transformation.outcomes.map((outcome, index) => (
<div
key={index}
className="flex items-start gap-4 rounded-lg border bg-background p-6 shadow-sm"
>
<div className="mt-1 rounded-full bg-primary p-2 text-primary-foreground">
<Sparkles className="h-5 w-5" />
</div>
<p className="text-lg leading-relaxed font-medium">{outcome}</p>
</div>
))}
</div>
</div>
</div>
</section>
);
}

39
vibn-frontend/marketing/components/who-its-for.tsx
View File

@@ -1,39 +0,0 @@
import { Check } from "lucide-react";
import { homepage } from "@/marketing/content/homepage";
export function WhoItsFor() {
return (
<section id="who-its-for" className="w-full py-16 md:py-24">
<div className="container mx-auto px-6">
<div className="mx-auto max-w-[900px] space-y-12">
<div className="text-center space-y-4">
<h2 className="font-serif text-3xl font-semibold tracking-tight md:text-5xl">
{homepage.whoItsFor.title}
</h2>
<p className="text-2xl font-semibold text-muted-foreground md:text-3xl">
{homepage.whoItsFor.subtitle}
</p>
<p className="text-lg text-muted-foreground md:text-xl pt-4 leading-relaxed">
{homepage.whoItsFor.description}
</p>
</div>
<div className="grid gap-4 pt-8">
{homepage.whoItsFor.traits.map((trait, index) => (
<div
key={index}
className="flex items-start gap-4 rounded-lg border bg-card p-6 transition-all hover:border-primary/50"
>
<div className="rounded-full bg-primary/10 p-2 mt-1">
<Check className="h-5 w-5 text-primary" />
</div>
<p className="text-lg leading-relaxed">{trait}</p>
</div>
))}
</div>
</div>
</div>
</section>
);
}