204 lines
8.7 KiB
JavaScript
204 lines
8.7 KiB
JavaScript
import { getCurrentLanguage, i18n } from '../../i18n.js'
|
||
|
||
class PageAbout extends HTMLElement {
|
||
connectedCallback() {
|
||
this._unsubs = []
|
||
this.render()
|
||
this._unsubs.push(i18n.subscribe(() => this.render()))
|
||
}
|
||
|
||
disconnectedCallback() {
|
||
this._unsubs.forEach(fn => fn())
|
||
this._unsubs = []
|
||
}
|
||
|
||
getContent(lang) {
|
||
const content = {
|
||
de: /* html */`
|
||
<h1>Über kashilo.com</h1>
|
||
<p>kashilo.com ist eine Privacy-First Kleinanzeigen-Plattform. Nutzer können Anzeigen erstellen und über Ende-zu-Ende verschlüsselte Nachrichten kommunizieren — ohne persönliche Daten preiszugeben.</p>
|
||
<p>Die Bezahlung erfolgt ausschliesslich über Monero (XMR). Kein KYC, keine E-Mail, kein Tracking.</p>
|
||
|
||
<h2>Prinzipien</h2>
|
||
<ul>
|
||
<li>Keine persönlichen Daten erforderlich</li>
|
||
<li>Ende-zu-Ende verschlüsselte Kommunikation</li>
|
||
<li>Monero (XMR) als einziges Zahlungsmittel</li>
|
||
<li>Open Source & selbst gehostet</li>
|
||
<li>Betrieben aus der Schweiz</li>
|
||
</ul>
|
||
`,
|
||
en: /* html */`
|
||
<h1>About kashilo.com</h1>
|
||
<p>kashilo.com is a privacy-first classifieds platform. Users can create listings and communicate via end-to-end encrypted messages — without revealing any personal data.</p>
|
||
<p>Payments are made exclusively in Monero (XMR). No KYC, no email, no tracking.</p>
|
||
|
||
<h2>Principles</h2>
|
||
<ul>
|
||
<li>No personal data required</li>
|
||
<li>End-to-end encrypted communication</li>
|
||
<li>Monero (XMR) as sole payment method</li>
|
||
<li>Open source & self-hosted</li>
|
||
<li>Operated from Switzerland</li>
|
||
</ul>
|
||
`,
|
||
fr: /* html */`
|
||
<h1>À propos de kashilo.com</h1>
|
||
<p>kashilo.com est une plateforme de petites annonces axée sur la confidentialité. Les utilisateurs peuvent créer des annonces et communiquer via des messages chiffrés de bout en bout — sans révéler de données personnelles.</p>
|
||
<p>Les paiements s'effectuent exclusivement en Monero (XMR). Pas de KYC, pas d'e-mail, pas de tracking.</p>
|
||
|
||
<h2>Principes</h2>
|
||
<ul>
|
||
<li>Aucune donnée personnelle requise</li>
|
||
<li>Communication chiffrée de bout en bout</li>
|
||
<li>Monero (XMR) comme seul moyen de paiement</li>
|
||
<li>Open source & auto-hébergé</li>
|
||
<li>Exploité depuis la Suisse</li>
|
||
</ul>
|
||
`,
|
||
it: /* html */`
|
||
<h1>Informazioni su kashilo.com</h1>
|
||
<p>kashilo.com è una piattaforma di annunci incentrata sulla privacy. Gli utenti possono creare annunci e comunicare tramite messaggi crittografati end-to-end — senza rivelare dati personali.</p>
|
||
<p>I pagamenti avvengono esclusivamente in Monero (XMR). Nessun KYC, nessuna email, nessun tracking.</p>
|
||
|
||
<h2>Principi</h2>
|
||
<ul>
|
||
<li>Nessun dato personale richiesto</li>
|
||
<li>Comunicazione crittografata end-to-end</li>
|
||
<li>Monero (XMR) come unico metodo di pagamento</li>
|
||
<li>Open source e self-hosted</li>
|
||
<li>Gestito dalla Svizzera</li>
|
||
</ul>
|
||
`,
|
||
es: /* html */`
|
||
<h1>Acerca de kashilo.com</h1>
|
||
<p>kashilo.com es una plataforma de clasificados centrada en la privacidad. Los usuarios pueden crear anuncios y comunicarse mediante mensajes cifrados de extremo a extremo — sin revelar datos personales.</p>
|
||
<p>Los pagos se realizan exclusivamente en Monero (XMR). Sin KYC, sin email, sin rastreo.</p>
|
||
|
||
<h2>Principios</h2>
|
||
<ul>
|
||
<li>No se requieren datos personales</li>
|
||
<li>Comunicación cifrada de extremo a extremo</li>
|
||
<li>Monero (XMR) como único método de pago</li>
|
||
<li>Código abierto y autoalojado</li>
|
||
<li>Operado desde Suiza</li>
|
||
</ul>
|
||
`,
|
||
pt: /* html */`
|
||
<h1>Sobre o kashilo.com</h1>
|
||
<p>kashilo.com é uma plataforma de classificados focada em privacidade. Os usuários podem criar anúncios e se comunicar por mensagens criptografadas de ponta a ponta — sem revelar dados pessoais.</p>
|
||
<p>Os pagamentos são feitos exclusivamente em Monero (XMR). Sem KYC, sem email, sem rastreamento.</p>
|
||
|
||
<h2>Princípios</h2>
|
||
<ul>
|
||
<li>Nenhum dado pessoal necessário</li>
|
||
<li>Comunicação criptografada de ponta a ponta</li>
|
||
<li>Monero (XMR) como único método de pagamento</li>
|
||
<li>Código aberto e auto-hospedado</li>
|
||
<li>Operado a partir da Suíça</li>
|
||
</ul>
|
||
`,
|
||
ru: /* html */`
|
||
<h1>О kashilo.com</h1>
|
||
<p>kashilo.com — это платформа объявлений с приоритетом конфиденциальности. Пользователи могут создавать объявления и общаться через сквозное шифрование — без раскрытия личных данных.</p>
|
||
<p>Оплата осуществляется исключительно в Monero (XMR). Без KYC, без email, без отслеживания.</p>
|
||
|
||
<h2>Принципы</h2>
|
||
<ul>
|
||
<li>Не требуются личные данные</li>
|
||
<li>Сквозное шифрование коммуникаций</li>
|
||
<li>Monero (XMR) как единственный способ оплаты</li>
|
||
<li>Открытый исходный код, собственный хостинг</li>
|
||
<li>Управляется из Швейцарии</li>
|
||
</ul>
|
||
`
|
||
}
|
||
return content[lang] || content.de
|
||
}
|
||
|
||
render() {
|
||
const lang = getCurrentLanguage()
|
||
const backLabel = { de: 'Zurück zur Startseite', en: 'Back to Home', fr: 'Retour à l\'accueil', it: 'Torna alla home', es: 'Volver al inicio', pt: 'Voltar ao Início', ru: 'На главную' }
|
||
this.innerHTML = /* html */`
|
||
<div class="legal-page">
|
||
<a href="#/" class="back-link">← ${backLabel[lang] || backLabel.en}</a>
|
||
<div class="legal-content">
|
||
${this.getContent(lang)}
|
||
</div>
|
||
</div>
|
||
`
|
||
}
|
||
}
|
||
|
||
customElements.define('page-about', PageAbout)
|
||
|
||
const style = document.createElement('style')
|
||
style.textContent = /* css */`
|
||
page-about .legal-page {
|
||
padding: var(--space-lg) 0;
|
||
max-width: 800px;
|
||
margin: 0 auto;
|
||
}
|
||
|
||
page-about .back-link {
|
||
display: inline-block;
|
||
color: var(--color-text-muted);
|
||
text-decoration: none;
|
||
font-size: var(--font-size-sm);
|
||
margin-bottom: var(--space-lg);
|
||
transition: color 0.2s;
|
||
}
|
||
|
||
page-about .back-link:hover {
|
||
color: var(--color-text);
|
||
}
|
||
|
||
page-about .legal-content h1 {
|
||
font-size: var(--font-size-2xl);
|
||
margin: 0 0 var(--space-xs);
|
||
}
|
||
|
||
page-about .legal-content h2 {
|
||
font-size: var(--font-size-lg);
|
||
margin: var(--space-xl) 0 var(--space-sm);
|
||
padding-top: var(--space-md);
|
||
border-top: 1px solid var(--color-border);
|
||
}
|
||
|
||
page-about .legal-content h2:first-of-type {
|
||
border-top: none;
|
||
}
|
||
|
||
page-about .legal-content p {
|
||
line-height: 1.7;
|
||
margin: 0 0 var(--space-sm);
|
||
color: var(--color-text-secondary);
|
||
}
|
||
|
||
page-about .legal-content ul {
|
||
margin: 0 0 var(--space-sm);
|
||
padding-left: var(--space-lg);
|
||
color: var(--color-text-secondary);
|
||
}
|
||
|
||
page-about .legal-content ul li {
|
||
line-height: 1.7;
|
||
margin-bottom: var(--space-xs);
|
||
}
|
||
|
||
@media (max-width: 768px) {
|
||
page-about .legal-page {
|
||
padding: var(--space-md) 0;
|
||
}
|
||
|
||
page-about .legal-content h1 {
|
||
font-size: var(--font-size-xl);
|
||
}
|
||
|
||
page-about .legal-content h2 {
|
||
font-size: var(--font-size-base);
|
||
}
|
||
}
|
||
`
|
||
document.head.appendChild(style)
|