12fe395ac0
Statische Webseite zur Vorstellung der Anwendung mit: - Hauptseite mit Features, Workflow, Technologie und Download-Bereichen - Datenschutzerklärung (speziell für Desktop-App) - Impressum-Vorlage - Modernes Dark-Theme Design mit Gradient-Akzenten - Vollständig responsiv (Desktop, Tablet, Mobile) - Interaktive JavaScript-Features (Smooth Scrolling, Animationen) - 8 Feature-Cards mit Hauptfunktionalitäten - Drei-Panel PDF-Vergleich, Batch-Verarbeitung, Duplikatserkennung - Installation und Download-Bereich für alle Plattformen 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
311 lines
15 KiB
HTML
311 lines
15 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>DocuMentor - Professionelle XSL-Transformations-Verwaltung</title>
|
|
<link rel="stylesheet" href="styles.css">
|
|
</head>
|
|
<body>
|
|
<!-- Navigation -->
|
|
<nav class="navbar">
|
|
<div class="container">
|
|
<div class="nav-brand">
|
|
<h1>DocuMentor</h1>
|
|
</div>
|
|
<ul class="nav-menu">
|
|
<li><a href="#features">Features</a></li>
|
|
<li><a href="#workflow">Workflow</a></li>
|
|
<li><a href="#technologie">Technologie</a></li>
|
|
<li><a href="#download">Download</a></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Hero Section -->
|
|
<section class="hero">
|
|
<div class="container">
|
|
<div class="hero-content">
|
|
<h1 class="hero-title">Professionelle XSL-Transformations-Verwaltung</h1>
|
|
<p class="hero-subtitle">
|
|
DocuMentor ist Ihre leistungsstarke Desktop-Anwendung zur effizienten Verwaltung
|
|
und Validierung von XSL-Transformationen mit automatischer PDF-Generierung.
|
|
</p>
|
|
<div class="hero-buttons">
|
|
<a href="#download" class="btn btn-primary">Jetzt Herunterladen</a>
|
|
<a href="#features" class="btn btn-secondary">Mehr Erfahren</a>
|
|
</div>
|
|
</div>
|
|
<div class="hero-image">
|
|
<div class="screenshot-placeholder">
|
|
<svg viewBox="0 0 800 600" xmlns="http://www.w3.org/2000/svg">
|
|
<rect width="800" height="600" fill="#1e293b" rx="8"/>
|
|
<rect x="20" y="20" width="760" height="50" fill="#334155" rx="4"/>
|
|
<circle cx="40" cy="45" r="8" fill="#ef4444"/>
|
|
<circle cx="70" cy="45" r="8" fill="#eab308"/>
|
|
<circle cx="100" cy="45" r="8" fill="#22c55e"/>
|
|
<rect x="20" y="90" width="250" height="490" fill="#334155" rx="4"/>
|
|
<rect x="290" y="90" width="490" height="150" fill="#334155" rx="4"/>
|
|
<rect x="290" y="260" width="490" height="320" fill="#334155" rx="4"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Features Section -->
|
|
<section id="features" class="features">
|
|
<div class="container">
|
|
<h2 class="section-title">Leistungsstarke Features</h2>
|
|
<p class="section-subtitle">Alles, was Sie für professionelle XSL-Transformationen benötigen</p>
|
|
|
|
<div class="features-grid">
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Hierarchische Projektverwaltung</h3>
|
|
<p>Organisieren Sie Ihre XSL-Transformationen in einer übersichtlichen Baumstruktur mit flexiblen Workflow-Definitionen.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Asynchrone Batch-Verarbeitung</h3>
|
|
<p>Verarbeiten Sie große Mengen von XML-Dateien im Hintergrund mit Fortschrittsanzeige und optimaler Performance.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Intelligente Duplikatserkennung</h3>
|
|
<p>Automatische Hash-basierte Erkennung von identischen XML-Dateien verhindert Redundanzen und spart Speicherplatz.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<rect x="3" y="3" width="18" height="18" rx="2"/>
|
|
<path d="M9 3v18M15 3v18M3 9h18M3 15h18"/>
|
|
</svg>
|
|
</div>
|
|
<h3>PDF-Vergleichsansicht</h3>
|
|
<p>Drei-Panel-Ansicht mit Referenz-, Diff- und Neu-PDF inkl. Alpha-Blending für präzise visuelle Vergleiche.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4"/>
|
|
</svg>
|
|
</div>
|
|
<h3>PostgreSQL-Integration</h3>
|
|
<p>Nahtlose Datenbankanbindung mit Polars und ConnectorX für performante SQL-Abfragen und Datenverarbeitung.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Konfigurierbare Toolchains</h3>
|
|
<p>Flexible Verwaltung von Saxon, Apache FOP und diff-pdf mit Versionierung und plattformübergreifender Unterstützung.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Drag & Drop-Unterstützung</h3>
|
|
<p>Intuitive Bedienung durch Drag-and-Drop für XML-Dateien mit automatischer Hash-Prüfung und Zuordnung.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Blake2b-Hash-Validierung</h3>
|
|
<p>Robuste Integritätsprüfung mit automatischer Hash-Berechnung für alle XML-Dateien im Hintergrund.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Workflow Section -->
|
|
<section id="workflow" class="workflow">
|
|
<div class="container">
|
|
<h2 class="section-title">Ihr Workflow mit DocuMentor</h2>
|
|
<div class="workflow-steps">
|
|
<div class="workflow-step">
|
|
<div class="step-number">1</div>
|
|
<h3>Projekt erstellen</h3>
|
|
<p>Legen Sie ein neues Projekt an und konfigurieren Sie Ihre Transformations-Tools (Saxon, Apache FOP).</p>
|
|
</div>
|
|
<div class="workflow-arrow">→</div>
|
|
<div class="workflow-step">
|
|
<div class="step-number">2</div>
|
|
<h3>Struktur aufbauen</h3>
|
|
<p>Organisieren Sie Ihre XSL-Stylesheets und XML-Dateien in der hierarchischen Baumstruktur.</p>
|
|
</div>
|
|
<div class="workflow-arrow">→</div>
|
|
<div class="workflow-step">
|
|
<div class="step-number">3</div>
|
|
<h3>Transformationen ausführen</h3>
|
|
<p>Führen Sie Batch-Transformationen aus und profitieren Sie von der Worker-Pool-Performance.</p>
|
|
</div>
|
|
<div class="workflow-arrow">→</div>
|
|
<div class="workflow-step">
|
|
<div class="step-number">4</div>
|
|
<h3>PDFs vergleichen</h3>
|
|
<p>Nutzen Sie die Drei-Panel-Ansicht für präzise Vergleiche zwischen Referenz und generierten PDFs.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Technology Section -->
|
|
<section id="technologie" class="technology">
|
|
<div class="container">
|
|
<h2 class="section-title">Moderne Technologie</h2>
|
|
<div class="tech-grid">
|
|
<div class="tech-item">
|
|
<h3>PySide6</h3>
|
|
<p>Native Qt-basierte Benutzeroberfläche für beste Performance und plattformübergreifende Kompatibilität</p>
|
|
</div>
|
|
<div class="tech-item">
|
|
<h3>Pydantic</h3>
|
|
<p>Typsichere Konfigurationsverwaltung mit automatischer Validierung und Serialisierung</p>
|
|
</div>
|
|
<div class="tech-item">
|
|
<h3>Saxon</h3>
|
|
<p>Industrie-Standard XSLT-Prozessor für höchste Transformations-Qualität</p>
|
|
</div>
|
|
<div class="tech-item">
|
|
<h3>Apache FOP</h3>
|
|
<p>Professionelle PDF-Generierung aus XSL-FO mit umfangreichen Formatierungsoptionen</p>
|
|
</div>
|
|
<div class="tech-item">
|
|
<h3>PostgreSQL</h3>
|
|
<p>Enterprise-Datenbankintegration mit Polars für schnelle Datenverarbeitung</p>
|
|
</div>
|
|
<div class="tech-item">
|
|
<h3>Blake2b</h3>
|
|
<p>Kryptographische Hash-Funktion für sichere Integritätsprüfung und Duplikatserkennung</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Key Benefits Section -->
|
|
<section class="benefits">
|
|
<div class="container">
|
|
<h2 class="section-title">Ihre Vorteile</h2>
|
|
<div class="benefits-grid">
|
|
<div class="benefit-item">
|
|
<div class="benefit-number">4x</div>
|
|
<p>Schnellere XSLT-Transformationen durch Worker-Pool-Architektur</p>
|
|
</div>
|
|
<div class="benefit-item">
|
|
<div class="benefit-number">100%</div>
|
|
<p>Automatische Duplikatserkennung verhindert redundante Dateien</p>
|
|
</div>
|
|
<div class="benefit-item">
|
|
<div class="benefit-number">∞</div>
|
|
<p>Unbegrenzte Projektgröße durch effiziente Hash-basierte Verwaltung</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Download Section -->
|
|
<section id="download" class="download">
|
|
<div class="container">
|
|
<h2 class="section-title">Jetzt Starten</h2>
|
|
<p class="section-subtitle">DocuMentor ist verfügbar für Windows, macOS und Linux</p>
|
|
<div class="download-buttons">
|
|
<div class="download-card">
|
|
<h3>Linux</h3>
|
|
<p>Ubuntu, Debian, Fedora, Arch</p>
|
|
<a href="#" class="btn btn-download">Download für Linux</a>
|
|
</div>
|
|
<div class="download-card">
|
|
<h3>Windows</h3>
|
|
<p>Windows 10/11</p>
|
|
<a href="#" class="btn btn-download">Download für Windows</a>
|
|
</div>
|
|
<div class="download-card">
|
|
<h3>macOS</h3>
|
|
<p>macOS 10.15+</p>
|
|
<a href="#" class="btn btn-download">Download für macOS</a>
|
|
</div>
|
|
</div>
|
|
<div class="installation-note">
|
|
<h3>Installation</h3>
|
|
<div class="code-block">
|
|
<code>
|
|
# Installation mit uv Paketmanager<br>
|
|
uv sync<br>
|
|
<br>
|
|
# Anwendung starten<br>
|
|
uv run python src/main.py
|
|
</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<div class="footer-content">
|
|
<div class="footer-section">
|
|
<h3>DocuMentor</h3>
|
|
<p>Professionelle XSL-Transformations-Verwaltung für anspruchsvolle Projekte.</p>
|
|
</div>
|
|
<div class="footer-section">
|
|
<h4>Ressourcen</h4>
|
|
<ul>
|
|
<li><a href="#">Dokumentation</a></li>
|
|
<li><a href="#">GitHub Repository</a></li>
|
|
<li><a href="#">Issue Tracker</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="footer-section">
|
|
<h4>Community</h4>
|
|
<ul>
|
|
<li><a href="#">Forum</a></li>
|
|
<li><a href="#">Support</a></li>
|
|
<li><a href="#">Changelog</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="footer-section">
|
|
<h4>Rechtliches</h4>
|
|
<ul>
|
|
<li><a href="impressum.html">Impressum</a></li>
|
|
<li><a href="datenschutz.html">Datenschutz</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="footer-bottom">
|
|
<p>© 2025 DocuMentor. Alle Rechte vorbehalten.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
</html>
|