Customization

// src/components/shared/logo.tsx
{
  showIcon && (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 24 24"
      className={cn("h-6 w-6", iconClassName)}
    >
      <path d="your-svg-path-data" fill="currentColor" />
    </svg>
  );
}

import Image from "next/image";

<Image src="/logo.svg" alt="Your Logo" width={100} height={24} />;

export default function Icon() {
  return new ImageResponse(
    <div
      style={
        {
          /* your icon styles */
        }
      }
    >
      {/* Your icon content */}
    </div>,
    { width: 32, height: 32 }
  );
}

:root {
  --primary: 239 84% 67%; /* HSL values */
  --primary-foreground: 0 0% 100%;
  /* ... other colors */
}

.dark {
  --primary: 239 84% 67%;
  --primary-foreground: 0 0% 100%;
  /* ... dark mode colors */
}

export const siteConfig = {
  name: "KwikSaaS",
  tagline: "Launch Your SaaS Faster",
  description: "Your site description...",
  url: "https://www.kwiksaasapp.com",

  company: {
    name: "KwikSaaS Technologies Inc.",
    email: "support@kwiksaasapp.com",
  },

  links: {
    twitter: "https://x.com/yourusername",
    linkedin: "https://linkedin.com/in/yourusername",
    github: "https://github.com/yourusername",
  },

  twitterHandle: "yourusername",
};

// Update headline
<h1>Your Headline Here</h1>

// Update subheading
<p>Your value proposition...</p>

// Update CTA buttons
<Button>Get Started</Button>
<Button variant="outline">View Demo</Button>

export const features = [
  {
    title: "Feature Name",
    description: "Feature description...",
    icon: IconComponent,
  },
  // ... more features
];

export const plans: Plan[] = [
  {
    id: "standard",
    name: "Standard",
    description: "Lifetime access to core features",
    monthlyPrice: 39,
    features: [
      "Lifetime access",
      "Core SaaS boilerplate",
      "Email & Auth setup",
    ],
    stripePriceIds: {
      monthly: process.env.NEXT_PUBLIC_STRIPE_PRICE_ID_STANDARD_LIFETIME,
    },
  },
  // ... more plans
];

export const faqs = [
  {
    question: "Your question?",
    answer: "Your answer...",
  },
  // ... more FAQs
];

const testimonials = [
  {
    quote: "Customer quote...",
    author: "Name",
    role: "Title",
    company: "Company",
    avatar: "/path/to/avatar.jpg",
  },
];

const navItems = [
  { label: "Features", href: "/#features" },
  { label: "Pricing", href: "/pricing" },
  { label: "Blog", href: "/blog" },
  // Add your links
];

const footerLinks = {
  product: [
    { label: "Features", href: "/#features" },
    { label: "Pricing", href: "/pricing" },
  ],
  company: [
    { label: "About", href: "/about" },
    { label: "Blog", href: "/blog" },
  ],
  legal: [
    { label: "Privacy", href: "/privacy" },
    { label: "Terms", href: "/terms-of-service" },
  ],
};

const navMain = [
  {
    title: "Dashboard",
    url: "/dashboard",
    icon: LayoutDashboard,
    items: [
      { title: "Overview", url: "/dashboard" },
      { title: "Analytics", url: "/dashboard/analytics" },
    ],
  },
  {
    title: "Settings",
    url: "/dashboard/settings",
    icon: Settings,
    isActive: pathname.startsWith("/dashboard/settings"),
    items: [
      { title: "General", url: "/dashboard/settings/general" },
      { title: "Billing", url: "/dashboard/settings/billing" },
    ],
  },
];

const pathname = usePathname();
const isActive = pathname.startsWith("/dashboard/settings");

---
title: "Your Post Title"
description: "Post description..."
date: "2024-01-25"
author:
  name: "Author Name"
  picture: "/blog/authors/author.jpg"
tags: ["Tutorial", "Guide"]
thumbnail: "https://images.unsplash.com/..."
---

Your content here...

---
title: "v1.2.0"
date: "2024-01-25"
---

## New Features

- Feature 1
- Feature 2

## Bug Fixes

- Fix 1

// In your page.tsx
import { createMetadata } from "@/lib/seo";

export const metadata = createMetadata({
  title: "Page Title",
  description: "Page description...",
  path: "/your-path",
});