77 lines
3.5 KiB
HTML
77 lines
3.5 KiB
HTML
{% extends "sidebar.html" %}
|
|
|
|
{% block title %}AstraOS — Desktop App{% endblock %}
|
|
|
|
{% block head %}
|
|
<style>
|
|
.glow-card {
|
|
transition: 0.2s ease;
|
|
}
|
|
.glow-card:hover {
|
|
box-shadow: 0 0 20px rgba(192,132,252,0.3);
|
|
transform: translateY(-4px);
|
|
}
|
|
.btn-primary {
|
|
background: linear-gradient(135deg, #a855f7 0%, #9333ea 100%);
|
|
color: white;
|
|
box-shadow: 0 4px 15px rgba(168, 85, 247, 0.4);
|
|
transition: all 0.2s ease;
|
|
}
|
|
.btn-primary:hover {
|
|
box-shadow: 0 6px 20px rgba(168, 85, 247, 0.6);
|
|
transform: translateY(-2px);
|
|
}
|
|
.platform-icon {
|
|
width: 24px;
|
|
height: 24px;
|
|
fill: currentColor;
|
|
}
|
|
</style>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<header class="flex justify-between items-center mb-6 opacity-0" id="header-anim">
|
|
<div>
|
|
<h2 class="text-4xl font-bold tracking-wide text-purple-300">Desktop App</h2>
|
|
<p class="text-slate-400 mt-2">Lade den offiziellen AstraOS Client für dein Betriebssystem herunter.</p>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="max-w-2xl" id="cards-anim">
|
|
<!-- Windows Download (Prominent) -->
|
|
<div class="glow-card opacity-0 translate-y-8 bg-black/40 border border-purple-500/20 p-10 rounded-2xl backdrop-blur flex flex-col md:flex-row items-center text-center md:text-left gap-8">
|
|
<div class="w-20 h-20 bg-blue-500/10 text-blue-400 rounded-3xl flex items-center justify-center flex-shrink-0 border border-blue-500/20 shadow-[0_0_30px_rgba(59,130,246,0.15)]">
|
|
<svg class="w-10 h-10" viewBox="0 0 24 24" fill="currentColor">
|
|
<path d="M0 3.449L9.75 2.1v9.451H0m10.949-9.602L24 0v11.4H10.949M0 12.6h9.75v9.451L0 20.699M10.949 12.6H24V24l-12.9-1.801"/>
|
|
</svg>
|
|
</div>
|
|
<div class="flex-1">
|
|
<h3 class="text-3xl font-bold text-slate-100 mb-2">Windows (64-bit)</h3>
|
|
<p class="text-slate-400 text-sm mb-6">Optimiert für Windows 10 & 11. Bietet natives Fenstermanagement, reibungslose Performance und nahtlose Integration.</p>
|
|
<a href="/static/downloads/AstraOS_Setup_1.54.exe" class="btn-primary w-full md:w-auto px-8 py-3 rounded-lg font-semibold inline-flex items-center justify-center gap-3">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path></svg>
|
|
Jetzt herunterladen
|
|
</a>
|
|
<p class="text-xs text-slate-500 mt-4">Version 1.54</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Other OS (Subtle) -->
|
|
<div class="opacity-0 translate-y-4 mt-8 pt-6 border-t border-slate-800/60" id="other-os-anim">
|
|
<p class="text-sm text-slate-500 flex items-center gap-2">
|
|
<svg class="w-4 h-4 text-slate-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
|
macOS & Linux Clients befinden sich derzeit in Entwicklung.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
gsap.to("#header-anim", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out" });
|
|
gsap.to(".glow-card", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out", delay: 0.1 });
|
|
gsap.to("#other-os-anim", { opacity: 1, y: 0, duration: 0.6, ease: "power3.out", delay: 0.2 });
|
|
});
|
|
</script>
|
|
{% endblock %}
|