diff --git a/html/datenschutz.html b/html/datenschutz.html deleted file mode 100644 index 73b44f9..0000000 --- a/html/datenschutz.html +++ /dev/null @@ -1,290 +0,0 @@ - - - - - - Datenschutzerklärung - DocuMentor - - - - - - - - -
-
-
- ← Zurück zur Startseite - -

Datenschutzerklärung

-

Stand: Januar 2025

- -

1. Datenschutz auf einen Blick

- -

Allgemeine Hinweise

-

- Die folgenden Hinweise geben einen einfachen Überblick darüber, was mit Ihren personenbezogenen - Daten passiert, wenn Sie DocuMentor nutzen. Personenbezogene Daten sind alle Daten, mit denen - Sie persönlich identifiziert werden können. -

- -

DocuMentor als Desktop-Anwendung

-

- DocuMentor ist eine Desktop-Anwendung, die lokal auf Ihrem Computer ausgeführt wird. Die - Anwendung sammelt, speichert oder überträgt keine personenbezogenen Daten an externe Server. -

- -

2. Datenerfassung durch die Anwendung

- -

Welche Daten werden erfasst?

-

- DocuMentor speichert ausschließlich lokal auf Ihrem Computer: -

-
    -
  • Anwendungskonfigurationen (Tool-Pfade, Einstellungen)
    • -
  • Projektdaten (XSL-Transformations-Workflows, XML-Dateien)
    • -
  • Datei-Hashwerte (Blake2b) zur Duplikatserkennung
    • -
  • Datenbankverbindungsinformationen (falls konfiguriert)
    • -
- -

Wo werden diese Daten gespeichert?

-

- Alle Daten werden lokal in folgenden Verzeichnissen gespeichert: -

-
    -
  • Linux: ~/.config/DocuMentor/
    • -
  • Windows: %APPDATA%\DocuMentor\
    • -
  • macOS: ~/Library/Application Support/DocuMentor/
    • -
-

- Zusätzlich werden projektspezifische Daten in dem von Ihnen gewählten Projektverzeichnis - als project.yaml gespeichert. -

- -

Keine Datenübertragung

-

- DocuMentor überträgt keine Daten an externe Server oder Dritte. Die Anwendung funktioniert - vollständig offline. Eine Internetverbindung ist weder für die Installation noch für die - Nutzung erforderlich. -

- -

3. Datenerfassung auf dieser Webseite

- -

Server-Log-Dateien

-

- Der Provider dieser Webseite erhebt und speichert automatisch Informationen in sogenannten - Server-Log-Dateien, die Ihr Browser automatisch an uns übermittelt. Dies sind: -

-
    -
  • Browsertyp und Browserversion
    • -
  • Verwendetes Betriebssystem
    • -
  • Referrer URL
    • -
  • Hostname des zugreifenden Rechners
    • -
  • Uhrzeit der Serveranfrage
    • -
  • IP-Adresse
    • -
-

- Eine Zusammenführung dieser Daten mit anderen Datenquellen wird nicht vorgenommen. - Die Erfassung dieser Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO. - Der Webseitenbetreiber hat ein berechtigtes Interesse an der technisch fehlerfreien - Darstellung und der Optimierung seiner Webseite. -

- -

Keine Cookies

-

- Diese Webseite verwendet keine Cookies. Es werden keine Tracking- oder Analytics-Dienste - eingesetzt. -

- -

4. Datenbankverbindungen

- -

PostgreSQL-Integration

-

- DocuMentor bietet die Möglichkeit, sich mit PostgreSQL-Datenbanken zu verbinden. Die - Verbindungsinformationen (Server, Port, Benutzername, Passwort) werden ausschließlich - lokal in der Anwendungskonfiguration gespeichert. -

-

- Die Verbindung zur Datenbank erfolgt direkt von Ihrem Computer aus. DocuMentor fungiert - nicht als Vermittler und speichert keine Datenbankabfragen oder -ergebnisse außerhalb - Ihres lokalen Systems. -

- -

5. Ihre Rechte

- -

Recht auf Auskunft, Löschung und Berichtigung

-

- Da alle Daten ausschließlich lokal auf Ihrem Computer gespeichert werden, haben Sie - jederzeit volle Kontrolle über diese Daten: -

-
    -
  • Auskunft: Sie können jederzeit in die Konfigurationsdateien einsehen
    • -
  • Löschung: Sie können die Anwendung und alle Konfigurationsdateien jederzeit löschen
    • -
  • Berichtigung: Sie können alle gespeicherten Einstellungen jederzeit ändern
    • -
- -

Widerruf Ihrer Einwilligung zur Datenverarbeitung

-

- Viele Datenverarbeitungsvorgänge sind nur mit Ihrer ausdrücklichen Einwilligung möglich. - Sie können eine bereits erteilte Einwilligung jederzeit widerrufen, indem Sie die - Anwendung deinstallieren und die Konfigurationsdateien löschen. -

- -

6. Open Source

-

- DocuMentor ist eine Open-Source-Software. Der Quellcode ist öffentlich einsehbar, sodass - Sie jederzeit überprüfen können, wie Ihre Daten verarbeitet werden. -

- -

7. Kontakt

-

- Bei Fragen zum Datenschutz oder zur Datenverarbeitung in DocuMentor können Sie sich - jederzeit an uns wenden. Die Kontaktdaten finden Sie im Impressum. -

- -

8. Änderungen dieser Datenschutzerklärung

-

- Wir behalten uns vor, diese Datenschutzerklärung anzupassen, damit sie stets den aktuellen - rechtlichen Anforderungen entspricht oder um Änderungen unserer Leistungen in der - Datenschutzerklärung umzusetzen. Für Ihren erneuten Besuch gilt dann die neue - Datenschutzerklärung. -

- -
-

- Diese Datenschutzerklärung wurde erstellt für die Desktop-Anwendung DocuMentor - und die zugehörige Webseite. -

-
-
-
-
- - - - - - - diff --git a/html/impressum.html b/html/impressum.html deleted file mode 100644 index f32235e..0000000 --- a/html/impressum.html +++ /dev/null @@ -1,299 +0,0 @@ - - - - - - Impressum - DocuMentor - - - - - - - - -
-
-
- ← Zurück zur Startseite - -

Impressum

- -
- Hinweis: Dies ist ein Platzhalter-Impressum. Bitte ersetzen Sie die folgenden - Informationen mit Ihren tatsächlichen Angaben gemäß den gesetzlichen Anforderungen. -
- -

Angaben gemäß § 5 TMG

- -
-

[Ihr Name / Firmenname]

-

[Straße und Hausnummer]

-

[PLZ] [Ort]

-

[Land]

-
- -

Kontakt

- -
-

Telefon: [Ihre Telefonnummer]

-

E-Mail: [Ihre E-Mail-Adresse]

-

Webseite: [Ihre Webseite]

-
- -

Umsatzsteuer-ID

-

- Umsatzsteuer-Identifikationsnummer gemäß § 27 a Umsatzsteuergesetz:
- [Ihre USt-IdNr.] (falls zutreffend) -

- -

Wirtschafts-ID

-

- [Ihre Wirtschafts-ID] (falls zutreffend) -

- -

Verantwortlich für den Inhalt

-

- Verantwortlich für den Inhalt nach § 55 Abs. 2 RStV: -

-
-

[Name des Verantwortlichen]

-

[Adresse]

-
- -

EU-Streitschlichtung

-

- Die Europäische Kommission stellt eine Plattform zur Online-Streitbeilegung (OS) bereit: - - https://ec.europa.eu/consumers/odr/ - -

-

- Unsere E-Mail-Adresse finden Sie oben im Impressum. -

- -

Verbraucherstreitbeilegung / Universalschlichtungsstelle

-

- Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer - Verbraucherschlichtungsstelle teilzunehmen. -

- -

Haftung für Inhalte

-

- Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG für eigene Inhalte auf diesen Seiten nach - den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter - jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen - oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen. -

-

- Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den - allgemeinen Gesetzen bleiben hiervon unberührt. Eine diesbezügliche Haftung ist jedoch erst - ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekanntwerden - von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen. -

- -

Haftung für Links

-

- Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir keinen - Einfluss haben. Deshalb können wir für diese fremden Inhalte auch keine Gewähr übernehmen. - Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der - Seiten verantwortlich. Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf - mögliche Rechtsverstöße überprüft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung - nicht erkennbar. -

-

- Eine permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete - Anhaltspunkte einer Rechtsverletzung nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen - werden wir derartige Links umgehend entfernen. -

- -

Urheberrecht

-

- Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen - dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art - der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen - Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind - nur für den privaten, nicht kommerziellen Gebrauch gestattet. -

-

- Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die - Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche - gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, - bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen - werden wir derartige Inhalte umgehend entfernen. -

- -

Open Source Software

-

- DocuMentor ist eine Open-Source-Software. Der Quellcode ist unter einer Open-Source-Lizenz - verfügbar. Details zur Lizenzierung finden Sie im GitHub-Repository der Anwendung. -

- -

Verwendete Technologien

-

- DocuMentor verwendet folgende Technologien und Bibliotheken: -

-
    -
  • PySide6 (Qt für Python)
    • -
  • Pydantic (Datenvalidierung)
    • -
  • Saxon (XSLT-Prozessor)
    • -
  • Apache FOP (PDF-Generierung)
    • -
  • PostgreSQL (Datenbank, optional)
    • -
  • Polars (Datenverarbeitung)
    • -
-

- Für diese Technologien gelten die jeweiligen Lizenzbedingungen der Urheber. -

- -
-

- Quelle: Erstellt für DocuMentor
- Stand: Januar 2025 -

-
-
-
-
- - - - - - - diff --git a/html/index.html b/html/index.html deleted file mode 100644 index 4a9e886..0000000 --- a/html/index.html +++ /dev/null @@ -1,310 +0,0 @@ - - - - - - DocuMentor - Professionelle XSL-Transformations-Verwaltung - - - - - - - -
-
-
-

Professionelle XSL-Transformations-Verwaltung

-

- DocuMentor ist Ihre leistungsstarke Desktop-Anwendung zur effizienten Verwaltung - und Validierung von XSL-Transformationen mit automatischer PDF-Generierung. -

-
- Jetzt Herunterladen - Mehr Erfahren -
-
-
-
- - - - - - - - - - -
-
-
-
- - -
-
-

Leistungsstarke Features

-

Alles, was Sie für professionelle XSL-Transformationen benötigen

- -
-
-
- - - -
-

Hierarchische Projektverwaltung

-

Organisieren Sie Ihre XSL-Transformationen in einer übersichtlichen Baumstruktur mit flexiblen Workflow-Definitionen.

-
- -
-
- - - -
-

Asynchrone Batch-Verarbeitung

-

Verarbeiten Sie große Mengen von XML-Dateien im Hintergrund mit Fortschrittsanzeige und optimaler Performance.

-
- -
-
- - - -
-

Intelligente Duplikatserkennung

-

Automatische Hash-basierte Erkennung von identischen XML-Dateien verhindert Redundanzen und spart Speicherplatz.

-
- -
-
- - - - -
-

PDF-Vergleichsansicht

-

Drei-Panel-Ansicht mit Referenz-, Diff- und Neu-PDF inkl. Alpha-Blending für präzise visuelle Vergleiche.

-
- -
-
- - - -
-

PostgreSQL-Integration

-

Nahtlose Datenbankanbindung mit Polars und ConnectorX für performante SQL-Abfragen und Datenverarbeitung.

-
- -
-
- - - -
-

Konfigurierbare Toolchains

-

Flexible Verwaltung von Saxon, Apache FOP und diff-pdf mit Versionierung und plattformübergreifender Unterstützung.

-
- -
-
- - - -
-

Drag & Drop-Unterstützung

-

Intuitive Bedienung durch Drag-and-Drop für XML-Dateien mit automatischer Hash-Prüfung und Zuordnung.

-
- -
-
- - - -
-

Blake2b-Hash-Validierung

-

Robuste Integritätsprüfung mit automatischer Hash-Berechnung für alle XML-Dateien im Hintergrund.

-
-
-
-
- - -
-
-

Ihr Workflow mit DocuMentor

-
-
-
1
-

Projekt erstellen

-

Legen Sie ein neues Projekt an und konfigurieren Sie Ihre Transformations-Tools (Saxon, Apache FOP).

-
-
→
-
-
2
-

Struktur aufbauen

-

Organisieren Sie Ihre XSL-Stylesheets und XML-Dateien in der hierarchischen Baumstruktur.

-
-
→
-
-
3
-

Transformationen ausführen

-

Führen Sie Batch-Transformationen aus und profitieren Sie von der Worker-Pool-Performance.

-
-
→
-
-
4
-

PDFs vergleichen

-

Nutzen Sie die Drei-Panel-Ansicht für präzise Vergleiche zwischen Referenz und generierten PDFs.

-
-
-
-
- - -
-
-

Moderne Technologie

-
-
-

PySide6

-

Native Qt-basierte Benutzeroberfläche für beste Performance und plattformübergreifende Kompatibilität

-
-
-

Pydantic

-

Typsichere Konfigurationsverwaltung mit automatischer Validierung und Serialisierung

-
-
-

Saxon

-

Industrie-Standard XSLT-Prozessor für höchste Transformations-Qualität

-
-
-

Apache FOP

-

Professionelle PDF-Generierung aus XSL-FO mit umfangreichen Formatierungsoptionen

-
-
-

PostgreSQL

-

Enterprise-Datenbankintegration mit Polars für schnelle Datenverarbeitung

-
-
-

Blake2b

-

Kryptographische Hash-Funktion für sichere Integritätsprüfung und Duplikatserkennung

-
-
-
-
- - -
-
-

Ihre Vorteile

-
-
-
4x
-

Schnellere XSLT-Transformationen durch Worker-Pool-Architektur

-
-
-
100%
-

Automatische Duplikatserkennung verhindert redundante Dateien

-
-
-
∞
-

Unbegrenzte Projektgröße durch effiziente Hash-basierte Verwaltung

-
-
-
-
- - -
-
-

Jetzt Starten

-

DocuMentor ist verfügbar für Windows, macOS und Linux

-
-
-

Linux

-

Ubuntu, Debian, Fedora, Arch

- Download für Linux -
-
-

Windows

-

Windows 10/11

- Download für Windows -
-
-

macOS

-

macOS 10.15+

- Download für macOS -
-
-
-

Installation

-
- -# Installation mit uv Paketmanager
-uv sync
-
-# Anwendung starten
-uv run python src/main.py - -
-
-
-
- - - - - - - diff --git a/html/script.js b/html/script.js deleted file mode 100644 index 4706860..0000000 --- a/html/script.js +++ /dev/null @@ -1,275 +0,0 @@ -// Smooth Scrolling für Navigation -document.querySelectorAll('a[href^="#"]').forEach(anchor => { - anchor.addEventListener('click', function (e) { - e.preventDefault(); - const target = document.querySelector(this.getAttribute('href')); - if (target) { - const navHeight = document.querySelector('.navbar').offsetHeight; - const targetPosition = target.getBoundingClientRect().top + window.pageYOffset - navHeight; - window.scrollTo({ - top: targetPosition, - behavior: 'smooth' - }); - } - }); -}); - -// Intersection Observer für Fade-In Animationen -const observerOptions = { - threshold: 0.1, - rootMargin: '0px 0px -50px 0px' -}; - -const observer = new IntersectionObserver((entries) => { - entries.forEach(entry => { - if (entry.isIntersecting) { - entry.target.classList.add('visible'); - } - }); -}, observerOptions); - -// Füge Fade-In Klassen zu Elementen hinzu -document.addEventListener('DOMContentLoaded', () => { - const animatedElements = document.querySelectorAll( - '.feature-card, .workflow-step, .tech-item, .benefit-item, .download-card' - ); - - animatedElements.forEach((el, index) => { - el.classList.add('fade-in'); - el.style.transitionDelay = `${index * 0.1}s`; - observer.observe(el); - }); -}); - -// Navbar Scroll-Effekt -let lastScroll = 0; -const navbar = document.querySelector('.navbar'); - -window.addEventListener('scroll', () => { - const currentScroll = window.pageYOffset; - - if (currentScroll <= 0) { - navbar.style.boxShadow = 'none'; - } else { - navbar.style.boxShadow = '0 2px 10px rgba(0, 0, 0, 0.3)'; - } - - lastScroll = currentScroll; -}); - -// Feature-Card Parallax-Effekt -document.querySelectorAll('.feature-card').forEach(card => { - card.addEventListener('mousemove', (e) => { - const rect = card.getBoundingClientRect(); - const x = e.clientX - rect.left; - const y = e.clientY - rect.top; - - const centerX = rect.width / 2; - const centerY = rect.height / 2; - - const deltaX = (x - centerX) / centerX; - const deltaY = (y - centerY) / centerY; - - card.style.transform = `perspective(1000px) rotateY(${deltaX * 5}deg) rotateX(${-deltaY * 5}deg) translateY(-5px)`; - }); - - card.addEventListener('mouseleave', () => { - card.style.transform = 'perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(0)'; - }); -}); - -// Download-Button Analytics (Placeholder) -document.querySelectorAll('.btn-download').forEach(button => { - button.addEventListener('click', (e) => { - e.preventDefault(); - const platform = e.target.closest('.download-card').querySelector('h3').textContent; - console.log(`Download initiated for: ${platform}`); - - // Hier könnte eine echte Download-Logik oder Analytics-Tracking erfolgen - alert(`Download für ${platform} würde hier starten.\nBitte konfigurieren Sie die Download-Links in der index.html.`); - }); -}); - -// Mobile Navigation Toggle (für zukünftige Erweiterung) -const createMobileMenu = () => { - const navMenu = document.querySelector('.nav-menu'); - const navbar = document.querySelector('.navbar .container'); - - // Erstelle Hamburger-Button nur auf mobilen Geräten - if (window.innerWidth <= 768) { - const existingToggle = document.querySelector('.nav-toggle'); - if (existingToggle) return; - - const toggle = document.createElement('button'); - toggle.className = 'nav-toggle'; - toggle.innerHTML = '☰'; - toggle.style.cssText = ` - background: none; - border: none; - color: var(--text-primary); - font-size: 1.5rem; - cursor: pointer; - padding: 0.5rem; - `; - - toggle.addEventListener('click', () => { - navMenu.style.display = navMenu.style.display === 'flex' ? 'none' : 'flex'; - if (navMenu.style.display === 'flex') { - navMenu.style.cssText = ` - display: flex; - flex-direction: column; - position: absolute; - top: 100%; - left: 0; - right: 0; - background: var(--surface); - padding: 1rem; - border-top: 1px solid var(--surface-light); - `; - } - }); - - navbar.appendChild(toggle); - } -}; - -// Responsive Handling -window.addEventListener('resize', createMobileMenu); -createMobileMenu(); - -// Particle Background Animation (optional, dezent) -const createParticles = () => { - const hero = document.querySelector('.hero'); - const particlesContainer = document.createElement('div'); - particlesContainer.className = 'particles'; - particlesContainer.style.cssText = ` - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - overflow: hidden; - pointer-events: none; - opacity: 0.3; - `; - - for (let i = 0; i < 20; i++) { - const particle = document.createElement('div'); - particle.style.cssText = ` - position: absolute; - width: 4px; - height: 4px; - background: var(--primary-color); - border-radius: 50%; - left: ${Math.random() * 100}%; - top: ${Math.random() * 100}%; - animation: float-particle ${5 + Math.random() * 10}s infinite ease-in-out; - animation-delay: ${Math.random() * 5}s; - `; - particlesContainer.appendChild(particle); - } - - // Füge Animation hinzu - if (!document.querySelector('#particle-animation')) { - const style = document.createElement('style'); - style.id = 'particle-animation'; - style.textContent = ` - @keyframes float-particle { - 0%, 100% { - transform: translate(0, 0); - } - 25% { - transform: translate(20px, -20px); - } - 50% { - transform: translate(-20px, -40px); - } - 75% { - transform: translate(20px, -60px); - } - } - `; - document.head.appendChild(style); - } - - hero.style.position = 'relative'; - hero.insertBefore(particlesContainer, hero.firstChild); -}; - -// Initialisiere Partikel nur auf Desktop -if (window.innerWidth > 768) { - createParticles(); -} - -// Counter Animation für Benefits -const animateCounters = () => { - const counters = document.querySelectorAll('.benefit-number'); - - counters.forEach(counter => { - const target = counter.textContent; - - // Prüfe ob es eine Zahl ist - if (!isNaN(parseInt(target))) { - const targetNum = parseInt(target); - const duration = 2000; - const increment = targetNum / (duration / 16); - let current = 0; - - const updateCounter = () => { - current += increment; - if (current < targetNum) { - counter.textContent = Math.floor(current) + 'x'; - requestAnimationFrame(updateCounter); - } else { - counter.textContent = target; - } - }; - - // Starte Animation wenn Element sichtbar wird - const counterObserver = new IntersectionObserver((entries) => { - entries.forEach(entry => { - if (entry.isIntersecting) { - updateCounter(); - counterObserver.unobserve(entry.target); - } - }); - }); - - counterObserver.observe(counter); - } - }); -}; - -animateCounters(); - -// Easter Egg: Konami Code -let konamiCode = []; -const konamiSequence = ['ArrowUp', 'ArrowUp', 'ArrowDown', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowLeft', 'ArrowRight', 'b', 'a']; - -document.addEventListener('keydown', (e) => { - konamiCode.push(e.key); - konamiCode = konamiCode.slice(-10); - - if (konamiCode.join(',') === konamiSequence.join(',')) { - document.body.style.animation = 'rainbow 2s infinite'; - - if (!document.querySelector('#rainbow-animation')) { - const style = document.createElement('style'); - style.id = 'rainbow-animation'; - style.textContent = ` - @keyframes rainbow { - 0% { filter: hue-rotate(0deg); } - 100% { filter: hue-rotate(360deg); } - } - `; - document.head.appendChild(style); - } - - setTimeout(() => { - document.body.style.animation = ''; - }, 5000); - } -}); - -console.log('%c🚀 DocuMentor', 'font-size: 24px; font-weight: bold; background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%); -webkit-background-clip: text; color: transparent;'); -console.log('%cProfessionelle XSL-Transformations-Verwaltung', 'font-size: 14px; color: #94a3b8;'); diff --git a/html/styles.css b/html/styles.css deleted file mode 100644 index eaabbc5..0000000 --- a/html/styles.css +++ /dev/null @@ -1,542 +0,0 @@ -/* Reset und Basis-Styles */ -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -:root { - --primary-color: #3b82f6; - --primary-dark: #2563eb; - --secondary-color: #8b5cf6; - --background: #0f172a; - --surface: #1e293b; - --surface-light: #334155; - --text-primary: #f1f5f9; - --text-secondary: #cbd5e1; - --text-muted: #94a3b8; - --accent: #06b6d4; - --success: #22c55e; - --warning: #eab308; - --error: #ef4444; - --gradient: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%); -} - -body { - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; - background-color: var(--background); - color: var(--text-primary); - line-height: 1.6; - overflow-x: hidden; -} - -.container { - max-width: 1200px; - margin: 0 auto; - padding: 0 2rem; -} - -/* Navigation */ -.navbar { - background-color: rgba(15, 23, 42, 0.95); - backdrop-filter: blur(10px); - position: fixed; - top: 0; - left: 0; - right: 0; - z-index: 1000; - border-bottom: 1px solid var(--surface-light); -} - -.navbar .container { - display: flex; - justify-content: space-between; - align-items: center; - padding: 1rem 2rem; -} - -.nav-brand h1 { - font-size: 1.5rem; - background: var(--gradient); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.nav-menu { - display: flex; - list-style: none; - gap: 2rem; -} - -.nav-menu a { - color: var(--text-secondary); - text-decoration: none; - font-weight: 500; - transition: color 0.3s; -} - -.nav-menu a:hover { - color: var(--primary-color); -} - -/* Hero Section */ -.hero { - margin-top: 80px; - padding: 6rem 0; - background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%); -} - -.hero .container { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 4rem; - align-items: center; -} - -.hero-title { - font-size: 3.5rem; - font-weight: 700; - line-height: 1.2; - margin-bottom: 1.5rem; - background: var(--gradient); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.hero-subtitle { - font-size: 1.25rem; - color: var(--text-secondary); - margin-bottom: 2rem; - line-height: 1.8; -} - -.hero-buttons { - display: flex; - gap: 1rem; -} - -.btn { - padding: 0.875rem 2rem; - border-radius: 0.5rem; - text-decoration: none; - font-weight: 600; - transition: all 0.3s; - display: inline-block; - cursor: pointer; -} - -.btn-primary { - background: var(--gradient); - color: white; - border: none; -} - -.btn-primary:hover { - transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(59, 130, 246, 0.3); -} - -.btn-secondary { - background: transparent; - color: var(--text-primary); - border: 2px solid var(--primary-color); -} - -.btn-secondary:hover { - background: var(--primary-color); - transform: translateY(-2px); -} - -.screenshot-placeholder { - width: 100%; - border-radius: 1rem; - box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5); - overflow: hidden; - animation: float 6s ease-in-out infinite; -} - -@keyframes float { - 0%, 100% { transform: translateY(0px); } - 50% { transform: translateY(-20px); } -} - -/* Features Section */ -.features { - padding: 6rem 0; - background-color: var(--background); -} - -.section-title { - font-size: 2.5rem; - text-align: center; - margin-bottom: 1rem; - background: var(--gradient); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.section-subtitle { - text-align: center; - color: var(--text-secondary); - font-size: 1.125rem; - margin-bottom: 4rem; -} - -.features-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 2rem; -} - -.feature-card { - background: var(--surface); - padding: 2rem; - border-radius: 1rem; - border: 1px solid var(--surface-light); - transition: all 0.3s; -} - -.feature-card:hover { - transform: translateY(-5px); - border-color: var(--primary-color); - box-shadow: 0 10px 30px rgba(59, 130, 246, 0.2); -} - -.feature-icon { - width: 3rem; - height: 3rem; - margin-bottom: 1.5rem; - color: var(--primary-color); -} - -.feature-icon svg { - width: 100%; - height: 100%; -} - -.feature-card h3 { - font-size: 1.25rem; - margin-bottom: 1rem; - color: var(--text-primary); -} - -.feature-card p { - color: var(--text-secondary); - line-height: 1.7; -} - -/* Workflow Section */ -.workflow { - padding: 6rem 0; - background: linear-gradient(135deg, rgba(59, 130, 246, 0.05) 0%, rgba(139, 92, 246, 0.05) 100%); -} - -.workflow-steps { - display: flex; - justify-content: space-between; - align-items: center; - gap: 1rem; - margin-top: 3rem; -} - -.workflow-step { - flex: 1; - background: var(--surface); - padding: 2rem; - border-radius: 1rem; - text-align: center; - border: 1px solid var(--surface-light); - transition: all 0.3s; -} - -.workflow-step:hover { - transform: translateY(-5px); - border-color: var(--primary-color); -} - -.step-number { - width: 3rem; - height: 3rem; - background: var(--gradient); - border-radius: 50%; - display: flex; - align-items: center; - justify-content: center; - margin: 0 auto 1.5rem; - font-size: 1.5rem; - font-weight: 700; -} - -.workflow-arrow { - font-size: 2rem; - color: var(--primary-color); - flex-shrink: 0; -} - -.workflow-step h3 { - margin-bottom: 1rem; - font-size: 1.25rem; -} - -.workflow-step p { - color: var(--text-secondary); -} - -/* Technology Section */ -.technology { - padding: 6rem 0; - background-color: var(--background); -} - -.tech-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 2rem; -} - -.tech-item { - background: var(--surface); - padding: 2rem; - border-radius: 1rem; - border-left: 4px solid var(--primary-color); - transition: all 0.3s; -} - -.tech-item:hover { - border-left-color: var(--secondary-color); - transform: translateX(5px); -} - -.tech-item h3 { - color: var(--primary-color); - margin-bottom: 0.75rem; - font-size: 1.25rem; -} - -.tech-item p { - color: var(--text-secondary); -} - -/* Benefits Section */ -.benefits { - padding: 6rem 0; - background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%); -} - -.benefits-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 2rem; - margin-top: 3rem; -} - -.benefit-item { - text-align: center; - padding: 2rem; -} - -.benefit-number { - font-size: 4rem; - font-weight: 700; - background: var(--gradient); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; - margin-bottom: 1rem; -} - -.benefit-item p { - font-size: 1.125rem; - color: var(--text-secondary); -} - -/* Download Section */ -.download { - padding: 6rem 0; - background-color: var(--background); -} - -.download-buttons { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 2rem; - margin: 3rem 0; -} - -.download-card { - background: var(--surface); - padding: 2rem; - border-radius: 1rem; - text-align: center; - border: 1px solid var(--surface-light); - transition: all 0.3s; -} - -.download-card:hover { - border-color: var(--primary-color); - transform: translateY(-5px); -} - -.download-card h3 { - font-size: 1.5rem; - margin-bottom: 0.5rem; -} - -.download-card p { - color: var(--text-muted); - margin-bottom: 1.5rem; -} - -.btn-download { - background: var(--gradient); - color: white; - border: none; - width: 100%; -} - -.btn-download:hover { - transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(59, 130, 246, 0.3); -} - -.installation-note { - background: var(--surface); - padding: 2rem; - border-radius: 1rem; - margin-top: 3rem; - border: 1px solid var(--surface-light); -} - -.installation-note h3 { - margin-bottom: 1.5rem; - color: var(--primary-color); -} - -.code-block { - background: var(--background); - padding: 1.5rem; - border-radius: 0.5rem; - border: 1px solid var(--surface-light); - overflow-x: auto; -} - -.code-block code { - color: var(--accent); - font-family: 'Courier New', monospace; - font-size: 0.875rem; - line-height: 1.8; -} - -/* Footer */ -.footer { - background-color: var(--surface); - padding: 4rem 0 2rem; - border-top: 1px solid var(--surface-light); -} - -.footer-content { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 3rem; - margin-bottom: 3rem; -} - -.footer-section h3 { - margin-bottom: 1rem; - background: var(--gradient); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.footer-section h4 { - margin-bottom: 1rem; - color: var(--text-primary); -} - -.footer-section p { - color: var(--text-secondary); -} - -.footer-section ul { - list-style: none; -} - -.footer-section ul li { - margin-bottom: 0.5rem; -} - -.footer-section ul li a { - color: var(--text-secondary); - text-decoration: none; - transition: color 0.3s; -} - -.footer-section ul li a:hover { - color: var(--primary-color); -} - -.footer-bottom { - text-align: center; - padding-top: 2rem; - border-top: 1px solid var(--surface-light); - color: var(--text-muted); -} - -/* Responsive Design */ -@media (max-width: 768px) { - .hero .container { - grid-template-columns: 1fr; - gap: 2rem; - } - - .hero-title { - font-size: 2.5rem; - } - - .workflow-steps { - flex-direction: column; - } - - .workflow-arrow { - transform: rotate(90deg); - } - - .nav-menu { - display: none; - } - - .features-grid { - grid-template-columns: 1fr; - } - - .download-buttons { - grid-template-columns: 1fr; - } -} - -/* Scroll Animations */ -.fade-in { - opacity: 0; - transform: translateY(20px); - transition: opacity 0.6s, transform 0.6s; -} - -.fade-in.visible { - opacity: 1; - transform: translateY(0); -} - -/* Smooth Scrolling */ -html { - scroll-behavior: smooth; -} - -/* Selection */ -::selection { - background-color: var(--primary-color); - color: white; -}