app/layout.tsx

import type { Metadata } from 'next';
import './globals.css';

const siteUrl = process.env.NEXT_PUBLIC_SITE_URL || 'http://localhost:3000';

export const metadata: Metadata = {
  title: 'Kit - Your Creative Toolkit',
  description: 'A curated collection of creative and utility tools for developers and creators. Features file conversion, image editing, and color manipulation.',
  keywords: ['tools', 'utilities', 'file converter', 'image editor', 'color palette', 'creative toolkit', 'convert', 'paint', 'color', 'open source'],
  metadataBase: new URL(siteUrl),
  icons: {
    icon: '/icon.png',
    shortcut: '/icon.png',
    apple: '/icon.png',
  },
  robots: {
    index: true,
    follow: true,
    googleBot: {
      index: true,
      follow: true,
      'max-video-preview': -1,
      'max-image-preview': 'large',
      'max-snippet': -1,
    },
  },
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  const umamiScript = process.env.UMAMI_SCRIPT;
  const umamiId = process.env.UMAMI_ID;
  const isProd = process.env.NODE_ENV === 'production';

  return (
    <html lang="en">
      <head>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="default" />
        <meta name="apple-mobile-web-app-title" content="Kit" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="mobile-web-app-capable" content="yes" />
        <meta name="theme-color" content="#8b5cf6" />
        {isProd && umamiScript && umamiId && (
          <script defer src={umamiScript} data-website-id={umamiId}></script>
        )}
      </head>
      <body className="antialiased">
        {children}
      </body>
    </html>
  );
}
Initial commit: Kit landing page - Next.js 16 with Turbopack - React 19 - Tailwind CSS 4 with CSS-first config - Framer Motion animations - Animated logo and hero section - Tool cards for Vert and Paint - Glassmorphism effects and gradient animations - Fully responsive design - Docker support with Nginx - Static export ready 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 11:26:19 +01:00			`import type { Metadata } from 'next';`
			`import './globals.css';`

feat: use NEXT_PUBLIC_SITE_URL and remove redundant preconnect 2026-02-23 17:21:46 +01:00			`const siteUrl = process.env.NEXT_PUBLIC_SITE_URL \|\| 'http://localhost:3000';`

Initial commit: Kit landing page - Next.js 16 with Turbopack - React 19 - Tailwind CSS 4 with CSS-first config - Framer Motion animations - Animated logo and hero section - Tool cards for Vert and Paint - Glassmorphism effects and gradient animations - Fully responsive design - Docker support with Nginx - Static export ready 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 11:26:19 +01:00			`export const metadata: Metadata = {`
			`title: 'Kit - Your Creative Toolkit',`
polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 12:30:08 +01:00			`description: 'A curated collection of creative and utility tools for developers and creators. Features file conversion, image editing, and color manipulation.',`
refactor: rename pastel app to color and update all references 2026-02-26 12:19:22 +01:00			`keywords: ['tools', 'utilities', 'file converter', 'image editor', 'color palette', 'creative toolkit', 'convert', 'paint', 'color', 'open source'],`
feat: use NEXT_PUBLIC_SITE_URL and remove redundant preconnect 2026-02-23 17:21:46 +01:00			`metadataBase: new URL(siteUrl),`
feat: integrate icon.png as favicon and remove legacy icon.svg 2026-02-24 15:27:16 +01:00			`icons: {`
			`icon: '/icon.png',`
			`shortcut: '/icon.png',`
			`apple: '/icon.png',`
polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 12:30:08 +01:00			`},`
			`robots: {`
			`index: true,`
			`follow: true,`
			`googleBot: {`
			`index: true,`
			`follow: true,`
			`'max-video-preview': -1,`
			`'max-image-preview': 'large',`
			`'max-snippet': -1,`
			`},`
			`},`
Initial commit: Kit landing page - Next.js 16 with Turbopack - React 19 - Tailwind CSS 4 with CSS-first config - Framer Motion animations - Animated logo and hero section - Tool cards for Vert and Paint - Glassmorphism effects and gradient animations - Fully responsive design - Docker support with Nginx - Static export ready 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 11:26:19 +01:00			`};`

			`export default function RootLayout({`
			`children,`
			`}: Readonly<{`
			`children: React.ReactNode;`
			`}>) {`
feat: add Umami tracking support 2026-02-23 17:09:44 +01:00			`const umamiScript = process.env.UMAMI_SCRIPT;`
			`const umamiId = process.env.UMAMI_ID;`
			`const isProd = process.env.NODE_ENV === 'production';`

Initial commit: Kit landing page - Next.js 16 with Turbopack - React 19 - Tailwind CSS 4 with CSS-first config - Framer Motion animations - Animated logo and hero section - Tool cards for Vert and Paint - Glassmorphism effects and gradient animations - Fully responsive design - Docker support with Nginx - Static export ready 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 11:26:19 +01:00			`return (`
feat: refactor theme, add tailwind-scrollbar, and improve UI components - Removed manual theme switching logic and ThemeProvider - Installed and configured tailwind-scrollbar plugin - Updated FileConverter and ConversionOptions to use shadcn Input - Refactored FontSelector to use shadcn Tabs - Simplified global styles and adjusted glassmorphic effects 2026-02-26 22:22:32 +01:00			`<html lang="en">`
polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 12:30:08 +01:00			`<head>`
			`<meta name="viewport" content="width=device-width, initial-scale=1" />`
feat: convert app to PWA with offline support and service worker 2026-02-26 18:01:33 +01:00			`<meta name="apple-mobile-web-app-capable" content="yes" />`
			`<meta name="apple-mobile-web-app-status-bar-style" content="default" />`
			`<meta name="apple-mobile-web-app-title" content="Kit" />`
			`<meta name="format-detection" content="telephone=no" />`
			`<meta name="mobile-web-app-capable" content="yes" />`
			`<meta name="theme-color" content="#8b5cf6" />`
feat: add Umami tracking support 2026-02-23 17:09:44 +01:00			`{isProd && umamiScript && umamiId && (`
			`<script defer src={umamiScript} data-website-id={umamiId}></script>`
			`)}`
polish: Priority 1 improvements - gradients, stats, metadata, footer ✨ Visual Enhancements: - Unique gradients per tool (green-teal for Vert, orange-pink for Paint, indigo-purple for Pastel) - Added new gradient utilities for better color differentiation 📊 Stats Section: - New animated stats component showing "3 Tools, 100% Open Source, ∞ Privacy First" - Glassmorphism cards with hover effects - Icon badges for each stat 🔍 Enhanced Metadata: - Comprehensive Open Graph tags for social sharing - Twitter Card support - Enhanced SEO with detailed keywords (vert, paint, pastel) - Added SVG favicon with gradient toolbox icon - Viewport meta tag and preconnect optimization 🔗 Improved Footer: - 3-column responsive layout - GitHub repository link with icon - Quick links to all tools (Vert, Paint, Pastel) - Tool count badge - Updated tech stack mention (Next.js 16 & Tailwind CSS 4) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 12:30:08 +01:00			`</head>`
Initial commit: Kit landing page - Next.js 16 with Turbopack - React 19 - Tailwind CSS 4 with CSS-first config - Framer Motion animations - Animated logo and hero section - Tool cards for Vert and Paint - Glassmorphism effects and gradient animations - Fully responsive design - Docker support with Nginx - Static export ready 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-07 11:26:19 +01:00			`<body className="antialiased">`
			`{children}`
			`</body>`
			`</html>`
			`);`
			`}`