Sebastian Krüger
1771ca42eb
- Add Next.js 16 with Turbopack and React 19 - Add Tailwind CSS 4 with OKLCH color system - Implement FFmpeg.wasm for video/audio conversion - Implement ImageMagick WASM for image conversion - Add file upload with drag-and-drop - Add format selector with fuzzy search - Add conversion preview and download - Add conversion history with localStorage - Add dark/light theme support - Support 22+ file formats across video, audio, and images 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
70 lines
2.2 KiB
TypeScript
70 lines
2.2 KiB
TypeScript
'use client';
|
|
|
|
import { FileConverter } from '@/components/converter/FileConverter';
|
|
import { ThemeToggle } from '@/components/layout/ThemeToggle';
|
|
import { ToastProvider } from '@/components/ui/Toast';
|
|
|
|
export default function Home() {
|
|
return (
|
|
<ToastProvider>
|
|
<div className="min-h-screen bg-background">
|
|
{/* Header */}
|
|
<header className="border-b border-border">
|
|
<div className="container mx-auto px-4 py-4 flex items-center justify-between">
|
|
<div>
|
|
<h1 className="text-2xl font-bold text-foreground">Convert UI</h1>
|
|
<p className="text-sm text-muted-foreground">
|
|
File conversion in your browser
|
|
</p>
|
|
</div>
|
|
<ThemeToggle />
|
|
</div>
|
|
</header>
|
|
|
|
{/* Main content */}
|
|
<main className="container mx-auto px-4 py-8 md:py-16">
|
|
<FileConverter />
|
|
</main>
|
|
|
|
{/* Footer */}
|
|
<footer className="border-t border-border mt-16">
|
|
<div className="container mx-auto px-4 py-6 text-center text-sm text-muted-foreground">
|
|
<p>
|
|
Powered by{' '}
|
|
<a
|
|
href="https://github.com/ffmpegwasm/ffmpeg.wasm"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-primary hover:underline"
|
|
>
|
|
FFmpeg.wasm
|
|
</a>
|
|
,{' '}
|
|
<a
|
|
href="https://github.com/dlemstra/magick-wasm"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-primary hover:underline"
|
|
>
|
|
ImageMagick WASM
|
|
</a>
|
|
{' '}&{' '}
|
|
<a
|
|
href="https://nextjs.org"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-primary hover:underline"
|
|
>
|
|
Next.js 16
|
|
</a>
|
|
</p>
|
|
<p className="mt-2">
|
|
All conversions happen locally in your browser. No files are uploaded to any server.
|
|
</p>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</ToastProvider>
|
|
);
|
|
}
|