docs: update README and GEMINI with favicon app and PWA info
This commit is contained in:
13
GEMINI.md
13
GEMINI.md
@@ -4,12 +4,15 @@ This file provides foundational context and instructions for Gemini CLI when wor
|
||||
|
||||
## 🚀 Project Overview
|
||||
|
||||
**Kit UI** is a high-performance, aesthetically pleasing toolkit built with **Next.js 16**, **React 19**, and **Tailwind CSS 4**. It provides four core specialized applications:
|
||||
**Kit UI** is a high-performance, aesthetically pleasing toolkit built with **Next.js 16**, **React 19**, and **Tailwind CSS 4**. It provides five core specialized applications:
|
||||
|
||||
1. **Color**: Advanced color theory, manipulation, and accessibility suite powered by `@valknarthing/pastel-wasm`.
|
||||
2. **Units**: Smart unit converter supporting 187+ units across 23 categories, including a custom `tempo` measure.
|
||||
3. **ASCII**: ASCII Art generator with 373 fonts and multi-format export.
|
||||
4. **Media**: Browser-based file converter using **FFmpeg** and **ImageMagick** via WebAssembly (Zero server uploads).
|
||||
4. **Media**: Browser-based file converter using **FFmpeg** and **ImageMagick** via WebAssembly.
|
||||
5. **Favicon**: Asset generator for web icons, PWA manifests, and HTML snippet headers.
|
||||
|
||||
**PWA Capabilities**: The toolkit is a fully functional Progressive Web App with service worker integration for offline usage of WASM-based tools.
|
||||
|
||||
## 🛠️ Tech Stack & Architecture
|
||||
|
||||
@@ -26,16 +29,18 @@ This file provides foundational context and instructions for Gemini CLI when wor
|
||||
```bash
|
||||
.
|
||||
├── app/ # Next.js App Router
|
||||
│ ├── (app)/ # Core Tool Pages (color, units, ascii, media)
|
||||
│ ├── (app)/ # Core Tool Pages (color, units, ascii, media, favicon)
|
||||
│ ├── manifest.ts # PWA manifest generation
|
||||
│ └── globals.css # Tailwind 4 configuration & global styles
|
||||
├── components/ # UI Components
|
||||
│ ├── [tool]/ # Tool-specific components (e.g., components/color/)
|
||||
│ ├── [tool]/ # Tool-specific components (e.g., components/color/, components/favicon/)
|
||||
│ ├── layout/ # AppShell, Sidebar, Header
|
||||
│ └── ui/ # Base Atomic Components (shadcn)
|
||||
├── lib/ # Business Logic
|
||||
│ ├── [tool]/ # Tool-specific logic & WASM wrappers
|
||||
│ └── utils/ # General utilities (cn, format, etc.)
|
||||
├── public/ # Static assets
|
||||
│ ├── sw.js # Service worker for PWA offline support
|
||||
│ ├── wasm/ # WASM binaries (ffmpeg, imagemagick)
|
||||
│ └── fonts/ # ASCII fonts (.flf)
|
||||
└── types/ # TypeScript definitions
|
||||
|
||||
17
README.md
17
README.md
@@ -13,7 +13,7 @@ Built with **Next.js 16**, **React 19**, and **Tailwind CSS 4**, Kit UI delivers
|
||||
|
||||
## 🚀 The Toolkit
|
||||
|
||||
Kit UI is divided into four core specialized applications:
|
||||
Kit UI is divided into five core specialized applications:
|
||||
|
||||
### 🎨 [Color](./app/(app)/color) — Professional Color Toolkit
|
||||
A comprehensive suite for color theory, manipulation, and accessibility.
|
||||
@@ -43,12 +43,20 @@ Privacy-first, local-only media conversion powered by WebAssembly.
|
||||
- **Zero Server Uploads**: All processing happens locally in your browser for maximum privacy.
|
||||
- **Advanced Options**: Fine-tune bitrates, codecs, resolutions, and quality presets.
|
||||
|
||||
### 🌐 [Favicon](./app/(app)/favicon) — Favicon & PWA Generator
|
||||
Complete asset generation for modern web presence.
|
||||
- **Complete Icon Set**: Generates standard favicons, Apple Touch icons, and Android Chrome icons.
|
||||
- **PWA Manifest**: Automatically generates a standards-compliant `site.webmanifest`.
|
||||
- **HTML Snippets**: Copy-paste ready `<head>` tags for easy integration.
|
||||
- **Privacy-First**: Powered by ImageMagick WASM—no server-side processing.
|
||||
|
||||
---
|
||||
|
||||
## ✨ Core Features
|
||||
|
||||
- 🎭 **Glassmorphic UI**: A modern, translucent aesthetic with smooth Framer Motion transitions.
|
||||
- ⚡ **Turbopack Optimized**: Built for speed using the latest Next.js 16 Turbopack engine.
|
||||
- 📱 **Full PWA Support**: Installable application with offline usage capabilities and service worker integration.
|
||||
- ♿ **Accessibility First**: Integrated tools to ensure your designs meet global standards.
|
||||
- 📱 **Responsive & Fluid**: Tailored experience across mobile, tablet, and desktop.
|
||||
- 🛠️ **Developer Friendly**: Keyboard shortcuts, command palettes, and URL-state sharing.
|
||||
@@ -73,19 +81,22 @@ Privacy-first, local-only media conversion powered by WebAssembly.
|
||||
```bash
|
||||
.
|
||||
├── app/ # Next.js App Router (Pages & Layouts)
|
||||
│ ├── (app)/ # Core Tool Pages (Color, Units, ASCII, Media)
|
||||
│ ├── (app)/ # Core Tool Pages (Color, Units, ASCII, Media, Favicon)
|
||||
│ ├── manifest.ts # PWA manifest generation
|
||||
│ └── api/ # Backend API routes
|
||||
├── components/ # Reusable UI & Logic Components
|
||||
│ ├── color/ # Color-specific components
|
||||
│ ├── units/ # Converter-specific components
|
||||
│ ├── ascii/ # ASCII-specific components
|
||||
│ ├── media/ # Media conversion components
|
||||
│ ├── favicon/ # Favicon-specific components
|
||||
│ └── ui/ # Base Atomic Components (Buttons, Cards, etc.)
|
||||
├── lib/ # Business Logic & Utilities
|
||||
│ ├── color/ # WASM wrappers & Color logic
|
||||
│ ├── units/ # Conversion algorithms
|
||||
│ ├── ascii/ # Font loading & ASCII generation
|
||||
│ └── media/ # FFmpeg & ImageMagick WASM orchestration
|
||||
│ ├── media/ # FFmpeg & ImageMagick WASM orchestration
|
||||
│ └── favicon/ # Favicon generation logic
|
||||
├── public/ # Static assets & ASCII fonts
|
||||
├── Dockerfile # Multi-stage Docker build
|
||||
└── nginx.conf # Production Nginx configuration
|
||||
|
||||
Reference in New Issue
Block a user