app/layout.tsx

import type { Metadata } from 'next';
import './globals.css';
import { Providers } from '@/components/providers/Providers';

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', 'pastel', '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" className="dark" suppressHydrationWarning>
      <head>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        {isProd && umamiScript && umamiId && (
          <script defer src={umamiScript} data-website-id={umamiId}></script>
        )}
        <script
          dangerouslySetInnerHTML={{
            __html: `
              (function() {
                try {
                  var theme = localStorage.getItem('theme');
                  var isLanding = window.location.pathname === '/';
                  if (isLanding) {
                    document.documentElement.classList.add('dark');
                    document.documentElement.classList.remove('light');
                  } else if (theme === 'light' || (!theme && window.matchMedia('(prefers-color-scheme: light)').matches)) {
                    document.documentElement.classList.add('light');
                    document.documentElement.classList.remove('dark');
                  } else {
                    document.documentElement.classList.add('dark');
                    document.documentElement.classList.remove('light');
                  }
                } catch (e) {}
              })();
            `,
          }}
        />
      </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: implement Figlet, Pastel, and Unit tools with a unified layout - Add Figlet text converter with font selection and history - Add Pastel color palette generator and manipulation suite - Add comprehensive Units converter with category-based logic - Introduce AppShell with Sidebar and Header for navigation - Modernize theme system with CSS variables and new animations - Update project configuration and dependencies 2026-02-22 21:35:53 +01:00			`import { Providers } from '@/components/providers/Providers';`
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
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.',`
update: rebrand Vert to Convert with improved description - Rename tool from "Vert" to "Convert" across all files - Update URL: vert.kit.pivoine.art → convert.kit.pivoine.art - Improve description to highlight WebAssembly technology - Update metadata keywords from 'vert' to 'convert' - Better reflect actual features: videos, images, and audio conversion 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com> 2025-11-17 11:18:52 +01:00			`keywords: ['tools', 'utilities', 'file converter', 'image editor', 'color palette', 'creative toolkit', 'convert', 'paint', 'pastel', '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 (`
refactor: consolidate utilities, clean up components, and improve theme persistence - Consolidate common utilities (cn, format, time) into lib/utils - Remove redundant utility files from pastel and units directories - Clean up unused components (Separator, KeyboardShortcutsHelp) - Relocate CommandPalette to components/units/ui/ - Force dark mode on landing page and improve theme persistence logic - Add FOUC prevention script to RootLayout - Fix sidebar height constraint in AppShell 2026-02-23 00:40:45 +01:00			`<html lang="en" className="dark" suppressHydrationWarning>`
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: add Umami tracking support 2026-02-23 17:09:44 +01:00			`{isProd && umamiScript && umamiId && (`
			`<script defer src={umamiScript} data-website-id={umamiId}></script>`
			`)}`
refactor: consolidate utilities, clean up components, and improve theme persistence - Consolidate common utilities (cn, format, time) into lib/utils - Remove redundant utility files from pastel and units directories - Clean up unused components (Separator, KeyboardShortcutsHelp) - Relocate CommandPalette to components/units/ui/ - Force dark mode on landing page and improve theme persistence logic - Add FOUC prevention script to RootLayout - Fix sidebar height constraint in AppShell 2026-02-23 00:40:45 +01:00			`<script`
			`dangerouslySetInnerHTML={{`
			__html: `
			`(function() {`
			`try {`
			`var theme = localStorage.getItem('theme');`
			`var isLanding = window.location.pathname === '/';`
			`if (isLanding) {`
			`document.documentElement.classList.add('dark');`
			`document.documentElement.classList.remove('light');`
			`} else if (theme === 'light' \|\| (!theme && window.matchMedia('(prefers-color-scheme: light)').matches)) {`
			`document.documentElement.classList.add('light');`
			`document.documentElement.classList.remove('dark');`
			`} else {`
			`document.documentElement.classList.add('dark');`
			`document.documentElement.classList.remove('light');`
			`}`
			`} catch (e) {}`
			`})();`
			`,
			`}}`
			`/>`
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>`
			`);`
			`}`