181 lines
No EOL
12 KiB
HTML
181 lines
No EOL
12 KiB
HTML
|
|
<!DOCTYPE html>
|
|
<html lang="de"></html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>FluffyChat Official Website | Home</title>
|
|
<meta name="identifier-url" content="https://fluffychat.im"/>
|
|
<meta name="title" content="FluffyChat Official Website"/>
|
|
<meta name="description" content="The cutest messenger in the Matrix network"/>
|
|
<meta name="abstract" content="FluffyChat is the cutest messenger in the Matrix network"/>
|
|
<meta name="keywords" content="FluffyChat, Matrix, Flutter, App"/>
|
|
<meta name="author" content="Krille Fear"/>
|
|
<meta name="revisit-after" content="15"/>
|
|
<meta name="language" content="EN"/>
|
|
<meta name="robots" content="All"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="icon" type="image/x-icon" href="/assets/favicon.png">
|
|
<link rel="preload" href="/assets/tailwind.css" as="style" onload="this.rel='stylesheet'">
|
|
<noscript><link rel="stylesheet" href="/assets/tailwind.css"></noscript>
|
|
</head>
|
|
<body
|
|
class="flex flex-col items-center min-h-screen w-full bg-white dark:bg-slate-800"
|
|
style="font-family: 'Zen Kurenaido', sans-serif;">
|
|
<!--Header-->
|
|
<div class="w-full lg:h-12 min-h-12 py-4 lg:py-0 mb-8 border-b border-gray-200 dark:border-gray-700">
|
|
<nav class="flex flex-wrap h-full justify-center items-center space-x-6 w-full max-w-4xl m-auto">
|
|
<a href="/de/" class="underline text-lg">Start</a>
|
|
<a href="/de/faq" class=" text-lg">FAQ</a>
|
|
<a href="/de/changelog" class=" text-lg">
|
|
Changelog</a>
|
|
<a href="https://ko-fi.com/krille/posts" target="_blank" class="text-lg">Blog
|
|
</a>
|
|
<div class="lg:flex-grow"></div>
|
|
<a href='https://ko-fi.com/C1C86VN53' class="hover:scale-110 transition-transform" target='_blank'>
|
|
<div class="rounded-xl bg-slate-900 dark:bg-slate-50 p-2 flex flex-row spacing-4"><img src="/assets/ko-fi.png" class="h-5 mr-2"/>
|
|
<span class="text-white dark:text-black text-xs flex items-center mr-2">Unterstütze mich auf Ko-Fi</span>
|
|
</div>
|
|
</a>
|
|
<a href="https://troet.cafe/@krille" rel="me" class="m-2 hover:scale-110 transition-transform "><img src="/assets/mastodon.svg" class="h-7"/>
|
|
</a>
|
|
</nav>
|
|
</div>
|
|
|
|
<img src="/assets/info-logo.png" alt="FluffyChat Logo" class="h-56"/>
|
|
<p class="text-xl dark:text-gray-200 text-gray-700 mb-8">Der knuffigste Messenger in [<a href="https://matrix.org" target="_blank" class="text-xl underline hover:text-purple-800 dark:hover:text-purple-400">matrix</a>]</p>
|
|
<div class="flex flex-wrap justify-center mb-16 w-full px-8 gap-4">
|
|
<img
|
|
src="/assets/screenshots/mobile.png"
|
|
alt="Mobile screenshot"
|
|
class="h-96 w-auto object-contain rounded-xl border border-gray-300 shadow-xl"/>
|
|
<img
|
|
src="/assets/screenshots/desktop.png"
|
|
alt="Desktop screenshot"
|
|
class="h-96 w-auto hidden md:inline-block object-contain rounded-xl border border-gray-300 shadow-xl"/>
|
|
</div>
|
|
<div class="max-w-lg mb-16 flex justify-center flex-wrap">
|
|
<a href="https://apps.apple.com/app/fluffychat/id1551469600"><img src="/assets/appstore-badge.png" class="w-36 pr-2 mb-2 inline hover:scale-105 transition-transform">
|
|
</a>
|
|
<a href="https://play.google.com/store/apps/details?id=chat.fluffy.fluffychat"><img src="/assets/google-play-badge.png" class="w-36 pr-2 mb-2 hover:scale-105 transition-transform inline">
|
|
</a>
|
|
<a href="https://f-droid.org/packages/chat.fluffy.fluffychat/"><img src="/assets/fdroid_button.png" class="w-36 pr-2 mb-2 hover:scale-105 transition-transform inline">
|
|
</a>
|
|
<a href="https://fluffychat.im/web">
|
|
<img src="/assets/browser-badge.png" class="w-36 pr-2 mb-2 hover:scale-105 transition-transform inline">
|
|
</a>
|
|
<a href="https://snapcraft.io/fluffychat"><img src="/assets/snap-store-badge.svg" class="w-36 pr-2 mb-2 hover:scale-105 transition-transform inline">
|
|
</a>
|
|
<a href="https://flathub.org/apps/details/im.fluffychat.Fluffychat"><img src="/assets/flathub-badge-en.png" class="w-36 pr-2 mb-2 hover:scale-105 transition-transform inline">
|
|
</a>
|
|
</div>
|
|
<div class="grid md:grid-cols-3 md:grid-rows-3 max-w-4xl justify-center w-full mb-16 features">
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated dancing woman" loading="lazy" src="/assets/feature1.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Einfach zu bedienen</h1>
|
|
<p class="text-center dark:text-white">FluffyChat ist so gestaltet, dass es so einfach wie möglich zu bedienen ist. Damit niemand ausgeschlossen wird.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated pencil" loading="lazy" src="/assets/feature2.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Material Design</h1>
|
|
<p class="text-center dark:text-white">Das gut ausgearbeitete Design basiert auf Material You und funktioniert auf allen Plattformen hervorragend.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated mechanical arm" loading="lazy" src="/assets/feature3.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Sicher</h1>
|
|
<p class="text-center dark:text-white">Mit Ende-zu-Ende-Verschlüsselung, Cross-Signing und verschlüsselten Backups ist FluffyChat einer der sichersten Messenger.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated planet earth" loading="lazy" src="/assets/feature4.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Dezentral</h1>
|
|
<p class="text-center dark:text-white">Du kannst den <a href="https://joinmatrix.org">Server</a> wählen, den du verwenden möchtest, oder sogar <a href="https://matrix.org/ecosystem/servers/">selbst hosten</a>!</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated bell" loading="lazy" src="/assets/feature5.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Benachrichtigungen</h1>
|
|
<p class="text-center dark:text-white">Du kannst zwischen Firebase Cloud Messaging oder dem datenschutzfreundlicheren <a href="https://unifiedpush.org">Unified Push</a> wählen.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated rocket" loading="lazy" src="/assets/feature6.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Spaces</h1>
|
|
<p class="text-center dark:text-white">Mit Spaces kannst du einer Community beitreten oder eine erstellen, die Chats und Nutzer organisiert. Mit Sub-Spaces kannst du Communities verschachteln.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated glass sphere" loading="lazy" src="/assets/feature7.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Videoanrufe</h1>
|
|
<p class="text-center dark:text-white">Noch experimentell, aber du kannst bereits Video- und Audioanrufe ausprobieren, kompatibel mit anderen [matrix] Clients.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated chick" loading="lazy" src="/assets/feature8.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Sticker</h1>
|
|
<p class="text-center dark:text-white">Erstelle deine eigenen Sticker-Sets und teile sie mit Freunden. Du kannst sie sogar als Inline-Emojis verwenden.</p>
|
|
</div>
|
|
<div class="flex flex-col justify-center items-center p-8">
|
|
<img alt="Animated whoa emoji" loading="lazy" src="/assets/feature9.gif" class="h-32"/>
|
|
<h1 class="text-purple-500 dark:text-purple-300 text-2xl">Kompatibel</h1>
|
|
<p class="text-center dark:text-white">FluffyChat ist kompatibel mit jedem anderen [matrix] Client wie <a href="https://element.io">Element</a>, <a href="https://nheko-reborn.github.io/">Nheko</a>, <a href="https://cinny.in">Cinny</a> oder <a href="https://apps.kde.org/de/neochat/">NeoChat</a>.</p>
|
|
</div>
|
|
</div>
|
|
<!--Footer-->
|
|
<div class="w-full flex justify-center border-t border-gray-200 dark:border-gray-700">
|
|
<footer class="w-full text-center max-w-4xl p-4 text-slate-700 dark:text-slate-200">
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/de/impressum">
|
|
Impressum</a>
|
|
-
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/de/privacy">
|
|
Datenschutzerklärung</a>
|
|
-
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/de/tos">
|
|
Terms of service</a>
|
|
-
|
|
<a
|
|
class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm"
|
|
href="https://github.com/krille-chan/fluffychat">Quellcode</a>
|
|
-
|
|
<a
|
|
class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm"
|
|
href="https://liberapay.com/KrilleChritzelius">Liberapay</a>
|
|
-
|
|
<a
|
|
class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm"
|
|
href="https://hosted.weblate.org/projects/fluffychat/">Übersetzungen</a>
|
|
-
|
|
<a
|
|
class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm"
|
|
href="https://googlefonts.github.io/noto-emoji-animation/">Noto Animierte Emojis</a>
|
|
-
|
|
<a
|
|
class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm"
|
|
href="https://krille-chan.github.io">Erstellt von Krille-chan</a>
|
|
<br/>
|
|
<span class="text-slate-700 dark:text-slate-200 text-sm">Sprache:
|
|
</span>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/be/">Беларуская</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/de/">Deutsch</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/en/">English</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/et/">eesti keel</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/fi/"></a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/fy/">Frysk</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/gl/">Galego</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/lv/">Latviešu</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/nb_NO/">Norsk</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/nl/">Nederlands</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/ta/">ஆங்கிலம்</a>
|
|
|
|
<a class="text-slate-700 dark:text-slate-200 underline hover:text-purple-800 text-sm" href="/uz/">O'zbekcha</a>
|
|
|
|
</footer>
|
|
</div>
|
|
</body>
|
|
</html> |