Add Impressum with attribution + expand language dropdown to 26 languages
Impressum page (/impressum) with rechtskonform attribution for: - Wiktionary/Kaikki.org (CC BY-SA 3.0 + GFDL) — dictionary data - ipa-dict (MIT) — IPA phonetic transcriptions - Wikimedia Commons (CC BY-SA) — vocabulary images - Piper TTS (MIT) — speech synthesis - pyspellchecker (MIT) — spell checking Language dropdown expanded from 7 to 26 European languages: DE, EN, TR, AR, UK, RU, PL, FR, ES, IT, PT, NL, RO, EL, BG, HR, CS, HU, SV, DA, FI, SK, SL, LT, LV, ET. Dropdown now shows full name: "TR — Turkce", "AR — العربية", etc. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
@@ -1,109 +1,126 @@
|
|||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import Link from 'next/link'
|
import React from 'react'
|
||||||
import { useLanguage } from '@/lib/LanguageContext'
|
|
||||||
import { useTheme } from '@/lib/ThemeContext'
|
import { useTheme } from '@/lib/ThemeContext'
|
||||||
import { Footer } from '@/components/Footer'
|
import { Sidebar } from '@/components/Sidebar'
|
||||||
|
|
||||||
export default function ImpressumPage() {
|
export default function ImpressumPage() {
|
||||||
const { t } = useLanguage()
|
|
||||||
const { isDark } = useTheme()
|
const { isDark } = useTheme()
|
||||||
|
|
||||||
|
const gc = isDark
|
||||||
|
? 'bg-white/10 backdrop-blur-xl border border-white/10'
|
||||||
|
: 'bg-white/80 backdrop-blur-xl border border-black/5'
|
||||||
|
const h2c = isDark ? 'text-white' : 'text-slate-900'
|
||||||
|
const tc = isDark ? 'text-white/70' : 'text-slate-600'
|
||||||
|
const sc = isDark ? 'text-white/90' : 'text-slate-800'
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={`min-h-screen flex flex-col ${
|
<div className={`min-h-screen flex ${isDark ? 'bg-gradient-to-br from-indigo-900 via-purple-900 to-pink-800' : 'bg-gradient-to-br from-slate-100 via-blue-50 to-cyan-100'}`}>
|
||||||
isDark
|
<div className="relative z-10 p-4 flex-shrink-0"><Sidebar /></div>
|
||||||
? 'bg-gradient-to-br from-indigo-900 via-purple-900 to-pink-800'
|
<div className="flex-1 overflow-y-auto scrollbar-hide" style={{ scrollbarWidth: 'none' }}>
|
||||||
: 'bg-gradient-to-br from-slate-100 via-blue-50 to-indigo-100'
|
<div className="max-w-3xl mx-auto px-6 py-8 space-y-6">
|
||||||
}`}>
|
|
||||||
<div className="flex-1 p-8">
|
|
||||||
<div className="max-w-4xl mx-auto">
|
|
||||||
{/* Back Link */}
|
|
||||||
<Link
|
|
||||||
href="/"
|
|
||||||
className={`inline-flex items-center gap-2 mb-8 transition-colors ${
|
|
||||||
isDark ? 'text-white/60 hover:text-white' : 'text-slate-600 hover:text-slate-900'
|
|
||||||
}`}
|
|
||||||
>
|
|
||||||
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
||||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
|
|
||||||
</svg>
|
|
||||||
{t('back_to_selection')}
|
|
||||||
</Link>
|
|
||||||
|
|
||||||
{/* Content Card */}
|
<h1 className={`text-2xl font-bold ${h2c}`}>Impressum</h1>
|
||||||
<div className={`backdrop-blur-xl border rounded-3xl p-8 ${
|
|
||||||
isDark
|
|
||||||
? 'bg-white/10 border-white/20'
|
|
||||||
: 'bg-white/70 border-black/10 shadow-lg'
|
|
||||||
}`}>
|
|
||||||
<h1 className={`text-3xl font-bold mb-8 ${isDark ? 'text-white' : 'text-slate-900'}`}>
|
|
||||||
{t('imprint')}
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<div className={`space-y-6 ${isDark ? 'text-white/80' : 'text-slate-700'}`}>
|
<section className={`${gc} rounded-2xl p-6`}>
|
||||||
<section>
|
<h2 className={`text-lg font-semibold mb-3 ${h2c}`}>Angaben gemaess § 5 TMG</h2>
|
||||||
<h2 className={`text-xl font-semibold mb-3 ${isDark ? 'text-white' : 'text-slate-900'}`}>
|
<div className={`space-y-1 ${tc}`}>
|
||||||
Angaben gemäß § 5 TMG
|
<p>[Firmenname GmbH]</p>
|
||||||
</h2>
|
<p>[Strasse und Hausnummer]</p>
|
||||||
<p>
|
<p>[PLZ Ort]</p>
|
||||||
BreakPilot GmbH<br />
|
<p className="mt-3"><strong>Vertreten durch:</strong> [Geschaeftsfuehrer]</p>
|
||||||
Musterstraße 123<br />
|
<p><strong>Registergericht:</strong> [Amtsgericht], HRB [Nummer]</p>
|
||||||
12345 Musterstadt<br />
|
<p><strong>USt-IdNr.:</strong> DE [Nummer]</p>
|
||||||
Deutschland
|
</div>
|
||||||
</p>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section className={`${gc} rounded-2xl p-6`}>
|
||||||
<h2 className={`text-xl font-semibold mb-3 ${isDark ? 'text-white' : 'text-slate-900'}`}>
|
<h2 className={`text-lg font-semibold mb-3 ${h2c}`}>Kontakt</h2>
|
||||||
Kontakt
|
<div className={`space-y-1 ${tc}`}>
|
||||||
</h2>
|
<p>E-Mail: [E-Mail-Adresse]</p>
|
||||||
<p>
|
<p>Telefon: [Telefonnummer]</p>
|
||||||
Telefon: +49 (0) 123 456789<br />
|
</div>
|
||||||
E-Mail: info@breakpilot.de
|
|
||||||
</p>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section className={`${gc} rounded-2xl p-6`}>
|
||||||
<h2 className={`text-xl font-semibold mb-3 ${isDark ? 'text-white' : 'text-slate-900'}`}>
|
<h2 className={`text-lg font-semibold mb-3 ${h2c}`}>Quellen, Lizenzen und Namensnennung</h2>
|
||||||
Vertretungsberechtigte Geschäftsführer
|
<div className={`space-y-4 ${tc}`}>
|
||||||
</h2>
|
|
||||||
<p>Max Mustermann</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section>
|
<div>
|
||||||
<h2 className={`text-xl font-semibold mb-3 ${isDark ? 'text-white' : 'text-slate-900'}`}>
|
<h3 className={`font-medium mb-1 ${sc}`}>Woerterbuch- und Uebersetzungsdaten</h3>
|
||||||
Registereintrag
|
<p className="text-sm">
|
||||||
</h2>
|
Basierend auf Daten aus{' '}
|
||||||
<p>
|
<a href="https://en.wiktionary.org" className="text-blue-400 hover:underline" target="_blank" rel="noopener noreferrer">Wiktionary</a>,
|
||||||
Eintragung im Handelsregister<br />
|
extrahiert ueber{' '}
|
||||||
Registergericht: Amtsgericht Musterstadt<br />
|
<a href="https://kaikki.org" className="text-blue-400 hover:underline" target="_blank" rel="noopener noreferrer">Kaikki.org</a>.
|
||||||
Registernummer: HRB 12345
|
|
||||||
</p>
|
</p>
|
||||||
</section>
|
<p className="text-xs mt-1 opacity-70">
|
||||||
|
Referenz: Tatu Ylonen: "Wiktextract: Wiktionary as Machine-Readable Structured Data", LREC 2022, pp. 1317-1325.
|
||||||
<section>
|
|
||||||
<h2 className={`text-xl font-semibold mb-3 ${isDark ? 'text-white' : 'text-slate-900'}`}>
|
|
||||||
Umsatzsteuer-ID
|
|
||||||
</h2>
|
|
||||||
<p>
|
|
||||||
Umsatzsteuer-Identifikationsnummer gemäß § 27 a Umsatzsteuergesetz:<br />
|
|
||||||
DE 123456789
|
|
||||||
</p>
|
</p>
|
||||||
</section>
|
<p className="text-xs mt-1 opacity-70">
|
||||||
|
Lizenz: CC BY-SA 3.0 und GFDL. Aenderungen: Strukturierte Extraktion, Filterung und Aufbereitung fuer Lernzwecke.
|
||||||
<div className={`mt-8 p-4 rounded-2xl ${
|
|
||||||
isDark ? 'bg-yellow-500/20 border border-yellow-500/30' : 'bg-yellow-50 border border-yellow-200'
|
|
||||||
}`}>
|
|
||||||
<p className={`text-sm ${isDark ? 'text-yellow-200' : 'text-yellow-800'}`}>
|
|
||||||
Hinweis: Dies ist ein Platzhalter. Bitte ersetzen Sie diese Angaben durch Ihre tatsächlichen Unternehmensdaten.
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
<div>
|
||||||
</div>
|
<h3 className={`font-medium mb-1 ${sc}`}>IPA-Lautschrift</h3>
|
||||||
|
<p className="text-sm">
|
||||||
|
<a href="https://github.com/open-dict-data/ipa-dict" className="text-blue-400 hover:underline" target="_blank" rel="noopener noreferrer">ipa-dict</a> — Phonemische Transkriptionen fuer 31 Sprachen.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs mt-1 opacity-70">Lizenz: MIT License.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Footer />
|
<div>
|
||||||
|
<h3 className={`font-medium mb-1 ${sc}`}>Vokabel-Bilder</h3>
|
||||||
|
<p className="text-sm">
|
||||||
|
<a href="https://commons.wikimedia.org" className="text-blue-400 hover:underline" target="_blank" rel="noopener noreferrer">Wikimedia Commons</a> — Freie Medien.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs mt-1 opacity-70">Lizenz: CC BY-SA. Einzelbildnachweise auf Anfrage.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h3 className={`font-medium mb-1 ${sc}`}>Sprachsynthese (Text-to-Speech)</h3>
|
||||||
|
<p className="text-sm">
|
||||||
|
<a href="https://github.com/rhasspy/piper" className="text-blue-400 hover:underline" target="_blank" rel="noopener noreferrer">Piper TTS</a> (Rhasspy Project) — Deutsch: Thorsten, Englisch: Lessac.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs mt-1 opacity-70">Lizenz: MIT License.</p>
|
||||||
|
<p className="text-sm mt-1">Weitere Sprachen (TR, AR, UK, RU, PL, FR, ES): Microsoft Edge TTS.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h3 className={`font-medium mb-1 ${sc}`}>Rechtschreibpruefung</h3>
|
||||||
|
<p className="text-sm">
|
||||||
|
<a href="https://github.com/barrust/pyspellchecker" className="text-blue-400 hover:underline" target="_blank" rel="noopener noreferrer">pyspellchecker</a> — Verfuegbar fuer: EN, DE, FR, ES, PT, IT, NL, RU, AR.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs mt-1 opacity-70">Lizenz: MIT License.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className={`${gc} rounded-2xl p-6`}>
|
||||||
|
<h2 className={`text-lg font-semibold mb-3 ${h2c}`}>Haftungsausschluss</h2>
|
||||||
|
<div className={`space-y-2 text-sm ${tc}`}>
|
||||||
|
<p><strong>Haftung fuer Inhalte:</strong> [Standardtext einfuegen]</p>
|
||||||
|
<p><strong>Haftung fuer Links:</strong> [Standardtext einfuegen]</p>
|
||||||
|
<p><strong>Urheberrecht:</strong> [Standardtext einfuegen]</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className={`${gc} rounded-2xl p-6`}>
|
||||||
|
<h2 className={`text-lg font-semibold mb-3 ${h2c}`}>Streitschlichtung</h2>
|
||||||
|
<p className={`text-sm ${tc}`}>[Hinweis zur OS-Plattform und Verbraucherstreitbeilegung]</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className={`${gc} rounded-2xl p-6`}>
|
||||||
|
<h2 className={`text-lg font-semibold mb-3 ${h2c}`}>Datenschutzbeauftragter</h2>
|
||||||
|
<div className={`space-y-1 ${tc}`}>
|
||||||
|
<p>[Name, Adresse, E-Mail]</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,13 +10,35 @@ interface LanguageSwitcherProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const LANGS = [
|
const LANGS = [
|
||||||
{ code: 'de', label: 'DE' },
|
// Main languages
|
||||||
{ code: 'en', label: 'EN' },
|
{ code: 'de', label: 'DE', name: 'Deutsch' },
|
||||||
{ code: 'tr', label: 'TR' },
|
{ code: 'en', label: 'EN', name: 'English' },
|
||||||
{ code: 'ar', label: 'AR' },
|
// Migration languages
|
||||||
{ code: 'uk', label: 'UK' },
|
{ code: 'tr', label: 'TR', name: 'Turkce' },
|
||||||
{ code: 'ru', label: 'RU' },
|
{ code: 'ar', label: 'AR', name: 'العربية' },
|
||||||
{ code: 'pl', label: 'PL' },
|
{ code: 'uk', label: 'UK', name: 'Українська' },
|
||||||
|
{ code: 'ru', label: 'RU', name: 'Русский' },
|
||||||
|
{ code: 'pl', label: 'PL', name: 'Polski' },
|
||||||
|
// European languages
|
||||||
|
{ code: 'fr', label: 'FR', name: 'Francais' },
|
||||||
|
{ code: 'es', label: 'ES', name: 'Espanol' },
|
||||||
|
{ code: 'it', label: 'IT', name: 'Italiano' },
|
||||||
|
{ code: 'pt', label: 'PT', name: 'Portugues' },
|
||||||
|
{ code: 'nl', label: 'NL', name: 'Nederlands' },
|
||||||
|
{ code: 'ro', label: 'RO', name: 'Romana' },
|
||||||
|
{ code: 'el', label: 'EL', name: 'Ελληνικά' },
|
||||||
|
{ code: 'bg', label: 'BG', name: 'Български' },
|
||||||
|
{ code: 'hr', label: 'HR', name: 'Hrvatski' },
|
||||||
|
{ code: 'cs', label: 'CS', name: 'Cestina' },
|
||||||
|
{ code: 'hu', label: 'HU', name: 'Magyar' },
|
||||||
|
{ code: 'sv', label: 'SV', name: 'Svenska' },
|
||||||
|
{ code: 'da', label: 'DA', name: 'Dansk' },
|
||||||
|
{ code: 'fi', label: 'FI', name: 'Suomi' },
|
||||||
|
{ code: 'sk', label: 'SK', name: 'Slovencina' },
|
||||||
|
{ code: 'sl', label: 'SL', name: 'Slovenscina' },
|
||||||
|
{ code: 'lt', label: 'LT', name: 'Lietuviu' },
|
||||||
|
{ code: 'lv', label: 'LV', name: 'Latviesu' },
|
||||||
|
{ code: 'et', label: 'ET', name: 'Eesti' },
|
||||||
]
|
]
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -33,7 +55,7 @@ export function LanguageSwitcher({ currentLang, onLangChange, isDark, compact =
|
|||||||
isDark ? 'bg-white/10 text-white/70' : 'bg-slate-100 text-slate-600'
|
isDark ? 'bg-white/10 text-white/70' : 'bg-slate-100 text-slate-600'
|
||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
{LANGS.map(l => <option key={l.code} value={l.code}>{l.label}</option>)}
|
{LANGS.map(l => <option key={l.code} value={l.code}>{l.label} — {l.name}</option>)}
|
||||||
</select>
|
</select>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user