updated readme with html import and image embedding

This commit is contained in:
2026-03-21 15:40:25 +02:00
parent 7e6b52586d
commit a4ecda6403

View File

@@ -79,7 +79,7 @@ In a world where document formatting tools are increasingly locked behind paywal
### 🎯 Core Capabilities ### 🎯 Core Capabilities
- **📄 Universal Markdown Support** - Drop in any `.md`, `.txt`, or `.markdown` file - **📄 Universal Input Support** - Drop in any `.md`, `.html`, `.txt`, or `.markdown` file - HTML content is auto-detected and converted
- **🎨 165+ Typography Styles** - Curated across 8 aesthetic categories - **🎨 165+ Typography Styles** - Curated across 8 aesthetic categories
- **📐 Multiple Paper Sizes** - A4 and Letter formats supported - **📐 Multiple Paper Sizes** - A4 and Letter formats supported
- **💾 Local Processing** - Your documents never leave your machine - **💾 Local Processing** - Your documents never leave your machine
@@ -167,7 +167,7 @@ The `.docx` files TypoGenie generates are also built with accessibility in mind:
| **Document Metadata** | Every exported DOCX includes `title`, `description`, and `creator` properties for assistive technology | | **Document Metadata** | Every exported DOCX includes `title`, `description`, and `creator` properties for assistive technology |
| **Heading Structure** | Semantic `HeadingLevel` preserved in both rendering modes (semantic and high-fidelity table layout) | | **Heading Structure** | Semantic `HeadingLevel` preserved in both rendering modes (semantic and high-fidelity table layout) |
| **Table Headers** | Rows containing `<th>` elements are marked with `tableHeader: true` so screen readers can announce column/row headers | | **Table Headers** | Rows containing `<th>` elements are marked with `tableHeader: true` so screen readers can announce column/row headers |
| **Image Placeholders** | `<img>` elements in Markdown are converted to italic `[Image: alt text]` placeholders rather than silently dropped | | **Image Embedding** | Images linked via URL are fetched and embedded in the exported DOCX, scaled to fit the page width. Falls back to italic `[Image: alt text]` placeholders if the image can't be fetched |
| **Contrast-Safe Colors** | All template text colors are validated and auto-corrected against their backgrounds before being applied to the document | | **Contrast-Safe Colors** | All template text colors are validated and auto-corrected against their backgrounds before being applied to the document |
### Runtime Contrast Validation ### Runtime Contrast Validation
@@ -294,7 +294,7 @@ npm run desktop:build
### Usage ### Usage
1. **📤 Upload** - Drag and drop your Markdown file (or click to browse) 1. **📤 Upload** - Drag and drop your Markdown, HTML, or text file (or click to browse)
2. **🎨 Select Style** - Browse the gallery and click any style for live preview 2. **🎨 Select Style** - Browse the gallery and click any style for live preview
3. **📐 Choose Paper Size** - A4 or Letter, depending on your needs 3. **📐 Choose Paper Size** - A4 or Letter, depending on your needs
4. **✨ Generate** - Watch the magic happen (with a satisfying loading animation) 4. **✨ Generate** - Watch the magic happen (with a satisfying loading animation)
@@ -327,7 +327,7 @@ npm run desktop:build
│ ▼ ▼ ▼ │ │ ▼ ▼ ▼ │
│ ┌────────────────────────────────────────────────────────────┐ │ │ ┌────────────────────────────────────────────────────────────┐ │
│ │ PROCESSING PIPELINE │ │ │ │ PROCESSING PIPELINE │ │
│ │ Markdown → marked parser → HTML → docx library → .docx │ │ │ │ Input → detect/convert → Markdown → marked → HTML → .docx │ │
│ └────────────────────────────────────────────────────────────┘ │ │ └────────────────────────────────────────────────────────────┘ │
│ │ │ │
└─────────────────────────────────────────────────────────────────────────────┘ └─────────────────────────────────────────────────────────────────────────────┘
@@ -428,8 +428,10 @@ typogenie/
│ │ ├── templateLoader.ts # Loads JSON templates via Rust │ │ ├── templateLoader.ts # Loads JSON templates via Rust
│ │ └── templateRenderer.ts # Generates CSS/DOCX with contrast validation │ │ └── templateRenderer.ts # Generates CSS/DOCX with contrast validation
│ ├── 📁 utils/ # Utilities │ ├── 📁 utils/ # Utilities
│ │ ├── contentDetector.ts # Auto-detects HTML vs Markdown vs plain text
│ │ ├── contrastUtils.ts # WCAG contrast ratio validation │ │ ├── contrastUtils.ts # WCAG contrast ratio validation
│ │ ── docxConverter.ts # Accessible DOCX generation │ │ ── docxConverter.ts # Accessible DOCX generation with image embedding
│ │ └── htmlToMarkdown.ts # HTML-to-Markdown conversion via Turndown
│ └── 📄 App.tsx # Main application component │ └── 📄 App.tsx # Main application component
├── 📁 src-tauri/ # Tauri desktop app ├── 📁 src-tauri/ # Tauri desktop app
│ ├── 📁 src/ # Rust backend code (filesystem access) │ ├── 📁 src/ # Rust backend code (filesystem access)
@@ -453,6 +455,7 @@ typogenie/
| **Animation** | Framer Motion (motion/react) | Transitions with reduced-motion support | | **Animation** | Framer Motion (motion/react) | Transitions with reduced-motion support |
| **Icons** | Lucide React | Beautiful, consistent iconography | | **Icons** | Lucide React | Beautiful, consistent iconography |
| **Markdown** | marked 12.0.0 | Local Markdown parsing | | **Markdown** | marked 12.0.0 | Local Markdown parsing |
| **HTML Import** | turndown 7.2.0 | HTML-to-Markdown conversion with content type detection |
| **Documents** | docx 8.5.0 | Client-side DOCX generation | | **Documents** | docx 8.5.0 | Client-side DOCX generation |
| **Desktop** | Tauri 2.0 | Native desktop apps (Rust + WebView) | | **Desktop** | Tauri 2.0 | Native desktop apps (Rust + WebView) |
| **Backend** | Rust 1.77+ | Systems programming for desktop shell | | **Backend** | Rust 1.77+ | Systems programming for desktop shell |