Compare commits
3 Commits
ea7fbaf8b8
...
47e98b88ef
| Author | SHA1 | Date | |
|---|---|---|---|
 info
|
47e98b88ef | ||
|
info
|
799d3dc2ba | ||
|
info
|
938fc9bfeb |
@@ -1,290 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Datenschutzerklärung - DocuMentor</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<style>
|
||||
.legal-page {
|
||||
padding: 8rem 0 4rem;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.legal-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
background: var(--surface);
|
||||
padding: 3rem;
|
||||
border-radius: 1rem;
|
||||
border: 1px solid var(--surface-light);
|
||||
}
|
||||
|
||||
.legal-content h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
background: var(--gradient);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
.legal-content h2 {
|
||||
font-size: 1.75rem;
|
||||
margin-top: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.legal-content h3 {
|
||||
font-size: 1.25rem;
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.legal-content p {
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.8;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.legal-content ul {
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.8;
|
||||
margin-left: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.legal-content ul li {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.legal-content a {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid transparent;
|
||||
transition: border-color 0.3s;
|
||||
}
|
||||
|
||||
.legal-content a:hover {
|
||||
border-bottom-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.back-link {
|
||||
display: inline-block;
|
||||
margin-bottom: 2rem;
|
||||
color: var(--text-secondary);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.back-link:hover {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.last-updated {
|
||||
color: var(--text-muted);
|
||||
font-size: 0.875rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar">
|
||||
<div class="container">
|
||||
<div class="nav-brand">
|
||||
<h1><a href="index.html" style="text-decoration: none; color: inherit;">DocuMentor</a></h1>
|
||||
</div>
|
||||
<ul class="nav-menu">
|
||||
<li><a href="index.html#features">Features</a></li>
|
||||
<li><a href="index.html#workflow">Workflow</a></li>
|
||||
<li><a href="index.html#technologie">Technologie</a></li>
|
||||
<li><a href="index.html#download">Download</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Datenschutz Content -->
|
||||
<section class="legal-page">
|
||||
<div class="container">
|
||||
<div class="legal-content">
|
||||
<a href="index.html" class="back-link">← Zurück zur Startseite</a>
|
||||
|
||||
<h1>Datenschutzerklärung</h1>
|
||||
<p class="last-updated">Stand: Januar 2025</p>
|
||||
|
||||
<h2>1. Datenschutz auf einen Blick</h2>
|
||||
|
||||
<h3>Allgemeine Hinweise</h3>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h3>DocuMentor als Desktop-Anwendung</h3>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>2. Datenerfassung durch die Anwendung</h2>
|
||||
|
||||
<h3>Welche Daten werden erfasst?</h3>
|
||||
<p>
|
||||
DocuMentor speichert ausschließlich lokal auf Ihrem Computer:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Anwendungskonfigurationen (Tool-Pfade, Einstellungen)</li>
|
||||
<li>Projektdaten (XSL-Transformations-Workflows, XML-Dateien)</li>
|
||||
<li>Datei-Hashwerte (Blake2b) zur Duplikatserkennung</li>
|
||||
<li>Datenbankverbindungsinformationen (falls konfiguriert)</li>
|
||||
</ul>
|
||||
|
||||
<h3>Wo werden diese Daten gespeichert?</h3>
|
||||
<p>
|
||||
Alle Daten werden lokal in folgenden Verzeichnissen gespeichert:
|
||||
</p>
|
||||
<ul>
|
||||
<li><strong>Linux:</strong> ~/.config/DocuMentor/</li>
|
||||
<li><strong>Windows:</strong> %APPDATA%\DocuMentor\</li>
|
||||
<li><strong>macOS:</strong> ~/Library/Application Support/DocuMentor/</li>
|
||||
</ul>
|
||||
<p>
|
||||
Zusätzlich werden projektspezifische Daten in dem von Ihnen gewählten Projektverzeichnis
|
||||
als <code>project.yaml</code> gespeichert.
|
||||
</p>
|
||||
|
||||
<h3>Keine Datenübertragung</h3>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>3. Datenerfassung auf dieser Webseite</h2>
|
||||
|
||||
<h3>Server-Log-Dateien</h3>
|
||||
<p>
|
||||
Der Provider dieser Webseite erhebt und speichert automatisch Informationen in sogenannten
|
||||
Server-Log-Dateien, die Ihr Browser automatisch an uns übermittelt. Dies sind:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Browsertyp und Browserversion</li>
|
||||
<li>Verwendetes Betriebssystem</li>
|
||||
<li>Referrer URL</li>
|
||||
<li>Hostname des zugreifenden Rechners</li>
|
||||
<li>Uhrzeit der Serveranfrage</li>
|
||||
<li>IP-Adresse</li>
|
||||
</ul>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h3>Keine Cookies</h3>
|
||||
<p>
|
||||
Diese Webseite verwendet keine Cookies. Es werden keine Tracking- oder Analytics-Dienste
|
||||
eingesetzt.
|
||||
</p>
|
||||
|
||||
<h2>4. Datenbankverbindungen</h2>
|
||||
|
||||
<h3>PostgreSQL-Integration</h3>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>5. Ihre Rechte</h2>
|
||||
|
||||
<h3>Recht auf Auskunft, Löschung und Berichtigung</h3>
|
||||
<p>
|
||||
Da alle Daten ausschließlich lokal auf Ihrem Computer gespeichert werden, haben Sie
|
||||
jederzeit volle Kontrolle über diese Daten:
|
||||
</p>
|
||||
<ul>
|
||||
<li><strong>Auskunft:</strong> Sie können jederzeit in die Konfigurationsdateien einsehen</li>
|
||||
<li><strong>Löschung:</strong> Sie können die Anwendung und alle Konfigurationsdateien jederzeit löschen</li>
|
||||
<li><strong>Berichtigung:</strong> Sie können alle gespeicherten Einstellungen jederzeit ändern</li>
|
||||
</ul>
|
||||
|
||||
<h3>Widerruf Ihrer Einwilligung zur Datenverarbeitung</h3>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>6. Open Source</h2>
|
||||
<p>
|
||||
DocuMentor ist eine Open-Source-Software. Der Quellcode ist öffentlich einsehbar, sodass
|
||||
Sie jederzeit überprüfen können, wie Ihre Daten verarbeitet werden.
|
||||
</p>
|
||||
|
||||
<h2>7. Kontakt</h2>
|
||||
<p>
|
||||
Bei Fragen zum Datenschutz oder zur Datenverarbeitung in DocuMentor können Sie sich
|
||||
jederzeit an uns wenden. Die Kontaktdaten finden Sie im <a href="impressum.html">Impressum</a>.
|
||||
</p>
|
||||
|
||||
<h2>8. Änderungen dieser Datenschutzerklärung</h2>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<div style="margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--surface-light);">
|
||||
<p style="color: var(--text-muted); font-size: 0.875rem;">
|
||||
Diese Datenschutzerklärung wurde erstellt für die Desktop-Anwendung DocuMentor
|
||||
und die zugehörige Webseite.
|
||||
</p>
|
||||
</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>Rechtliches</h4>
|
||||
<ul>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-section">
|
||||
<h4>Ressourcen</h4>
|
||||
<ul>
|
||||
<li><a href="index.html#features">Features</a></li>
|
||||
<li><a href="index.html#download">Download</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>
|
||||
@@ -1,299 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Impressum - DocuMentor</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<style>
|
||||
.legal-page {
|
||||
padding: 8rem 0 4rem;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.legal-content {
|
||||
max-width: 900px;
|
||||
margin: 0 auto;
|
||||
background: var(--surface);
|
||||
padding: 3rem;
|
||||
border-radius: 1rem;
|
||||
border: 1px solid var(--surface-light);
|
||||
}
|
||||
|
||||
.legal-content h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
background: var(--gradient);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
.legal-content h2 {
|
||||
font-size: 1.75rem;
|
||||
margin-top: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.legal-content h3 {
|
||||
font-size: 1.25rem;
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 0.75rem;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.legal-content p {
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.8;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.legal-content ul {
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.8;
|
||||
margin-left: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.legal-content ul li {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.legal-content a {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid transparent;
|
||||
transition: border-color 0.3s;
|
||||
}
|
||||
|
||||
.legal-content a:hover {
|
||||
border-bottom-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.back-link {
|
||||
display: inline-block;
|
||||
margin-bottom: 2rem;
|
||||
color: var(--text-secondary);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.back-link:hover {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
||||
.contact-box {
|
||||
background: var(--background);
|
||||
padding: 1.5rem;
|
||||
border-radius: 0.5rem;
|
||||
border-left: 4px solid var(--primary-color);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
.contact-box p {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.placeholder-notice {
|
||||
background: rgba(234, 179, 8, 0.1);
|
||||
border: 1px solid var(--warning);
|
||||
padding: 1rem;
|
||||
border-radius: 0.5rem;
|
||||
color: var(--warning);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar">
|
||||
<div class="container">
|
||||
<div class="nav-brand">
|
||||
<h1><a href="index.html" style="text-decoration: none; color: inherit;">DocuMentor</a></h1>
|
||||
</div>
|
||||
<ul class="nav-menu">
|
||||
<li><a href="index.html#features">Features</a></li>
|
||||
<li><a href="index.html#workflow">Workflow</a></li>
|
||||
<li><a href="index.html#technologie">Technologie</a></li>
|
||||
<li><a href="index.html#download">Download</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Impressum Content -->
|
||||
<section class="legal-page">
|
||||
<div class="container">
|
||||
<div class="legal-content">
|
||||
<a href="index.html" class="back-link">← Zurück zur Startseite</a>
|
||||
|
||||
<h1>Impressum</h1>
|
||||
|
||||
<div class="placeholder-notice">
|
||||
<strong>Hinweis:</strong> Dies ist ein Platzhalter-Impressum. Bitte ersetzen Sie die folgenden
|
||||
Informationen mit Ihren tatsächlichen Angaben gemäß den gesetzlichen Anforderungen.
|
||||
</div>
|
||||
|
||||
<h2>Angaben gemäß § 5 TMG</h2>
|
||||
|
||||
<div class="contact-box">
|
||||
<p><strong>[Ihr Name / Firmenname]</strong></p>
|
||||
<p>[Straße und Hausnummer]</p>
|
||||
<p>[PLZ] [Ort]</p>
|
||||
<p>[Land]</p>
|
||||
</div>
|
||||
|
||||
<h2>Kontakt</h2>
|
||||
|
||||
<div class="contact-box">
|
||||
<p><strong>Telefon:</strong> [Ihre Telefonnummer]</p>
|
||||
<p><strong>E-Mail:</strong> <a href="mailto:[ihre-email]">[Ihre E-Mail-Adresse]</a></p>
|
||||
<p><strong>Webseite:</strong> <a href="[ihre-webseite]">[Ihre Webseite]</a></p>
|
||||
</div>
|
||||
|
||||
<h2>Umsatzsteuer-ID</h2>
|
||||
<p>
|
||||
Umsatzsteuer-Identifikationsnummer gemäß § 27 a Umsatzsteuergesetz:<br>
|
||||
<strong>[Ihre USt-IdNr.]</strong> (falls zutreffend)
|
||||
</p>
|
||||
|
||||
<h2>Wirtschafts-ID</h2>
|
||||
<p>
|
||||
<strong>[Ihre Wirtschafts-ID]</strong> (falls zutreffend)
|
||||
</p>
|
||||
|
||||
<h2>Verantwortlich für den Inhalt</h2>
|
||||
<p>
|
||||
Verantwortlich für den Inhalt nach § 55 Abs. 2 RStV:
|
||||
</p>
|
||||
<div class="contact-box">
|
||||
<p><strong>[Name des Verantwortlichen]</strong></p>
|
||||
<p>[Adresse]</p>
|
||||
</div>
|
||||
|
||||
<h2>EU-Streitschlichtung</h2>
|
||||
<p>
|
||||
Die Europäische Kommission stellt eine Plattform zur Online-Streitbeilegung (OS) bereit:
|
||||
<a href="https://ec.europa.eu/consumers/odr/" target="_blank" rel="noopener">
|
||||
https://ec.europa.eu/consumers/odr/
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
Unsere E-Mail-Adresse finden Sie oben im Impressum.
|
||||
</p>
|
||||
|
||||
<h2>Verbraucherstreitbeilegung / Universalschlichtungsstelle</h2>
|
||||
<p>
|
||||
Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer
|
||||
Verbraucherschlichtungsstelle teilzunehmen.
|
||||
</p>
|
||||
|
||||
<h2>Haftung für Inhalte</h2>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>Haftung für Links</h2>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>Urheberrecht</h2>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>Open Source Software</h2>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<h2>Verwendete Technologien</h2>
|
||||
<p>
|
||||
DocuMentor verwendet folgende Technologien und Bibliotheken:
|
||||
</p>
|
||||
<ul>
|
||||
<li>PySide6 (Qt für Python)</li>
|
||||
<li>Pydantic (Datenvalidierung)</li>
|
||||
<li>Saxon (XSLT-Prozessor)</li>
|
||||
<li>Apache FOP (PDF-Generierung)</li>
|
||||
<li>PostgreSQL (Datenbank, optional)</li>
|
||||
<li>Polars (Datenverarbeitung)</li>
|
||||
</ul>
|
||||
<p>
|
||||
Für diese Technologien gelten die jeweiligen Lizenzbedingungen der Urheber.
|
||||
</p>
|
||||
|
||||
<div style="margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--surface-light);">
|
||||
<p style="color: var(--text-muted); font-size: 0.875rem;">
|
||||
Quelle: Erstellt für DocuMentor<br>
|
||||
Stand: Januar 2025
|
||||
</p>
|
||||
</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>Rechtliches</h4>
|
||||
<ul>
|
||||
<li><a href="impressum.html">Impressum</a></li>
|
||||
<li><a href="datenschutz.html">Datenschutz</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-section">
|
||||
<h4>Ressourcen</h4>
|
||||
<ul>
|
||||
<li><a href="index.html#features">Features</a></li>
|
||||
<li><a href="index.html#download">Download</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>
|
||||
-310
@@ -1,310 +0,0 @@
|
||||
<!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>
|
||||
-275
@@ -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;');
|
||||
-542
@@ -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;
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 38 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 153 KiB |
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 605 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
+2
-2
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>DocuMentor — Industrielle XSL-Transformationskontrolle</title>
|
||||
<title>DocuMentor — XSL-Transformationen sicher im Griff</title>
|
||||
<link rel="stylesheet" href="fonts/fonts.css">
|
||||
<style>
|
||||
/* ============================================================
|
||||
@@ -1573,7 +1573,7 @@
|
||||
SYSTEM AKTIV — XSL TRANSFORMATIONS-KONTROLLE v2.0
|
||||
</div>
|
||||
<h1 class="hero-title">Docu<span>Mentor</span></h1>
|
||||
<p class="hero-tagline">Industrielle XSL-Transformationskontrolle</p>
|
||||
<p class="hero-tagline">XSL-Transformationen sicher im Griff</p>
|
||||
<p class="hero-desc">
|
||||
Desktop-Anwendung zur Verwaltung und Validierung von XSL-Transformationen.
|
||||
Erkennen Sie jede Auswirkung Ihrer XSL-Änderungen — bevor es zu spät ist.
|
||||
|
||||
Reference in New Issue
Block a user