AstraOS-Panel/AstraOS/Frontend/HTML/status_page.html
2025-12-09 00:29:22 +01:00

80 lines
3 KiB
HTML

{% extends "sidebar.html" %}
{% block title %}AstraOS — Status Page{% endblock %}
{% block head %}
<style>
.status-indicator {
width: 12px;
height: 12px;
border-radius: 50%;
animation: pulse 2s infinite;
}
.status-online {
background-color: #2ecc71;
box-shadow: 0 0 8px #2ecc71;
}
.status-offline {
background-color: #e74c3c;
box-shadow: 0 0 8px #e74c3c;
}
.status-wartung {
background-color: #f39c12;
box-shadow: 0 0 8px #f39c12;
}
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
</style>
{% endblock %}
{% block content %}
<!-- HEADER -->
<header class="flex justify-between items-center mb-10">
<h2 class="text-4xl font-bold tracking-wide {% if maintenance_active %}text-yellow-300{% else %}text-purple-300{% endif %}">System Status</h2>
</header>
<!-- STATUS LIST -->
<div class="space-y-4">
<!-- Chainsaw Hood SCP:SL server -->
<div class="bg-black/40 rounded-xl p-6 backdrop-blur-lg flex justify-between items-center
{% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
<span class="text-xl font-semibold text-gray-200">Chainsaw Hood SCP:SL Server</span>
<div class="flex items-center gap-3">
<span class="text-green-400 font-semibold">Online</span>
<div class="status-indicator status-online"></div>
</div>
</div>
<!-- Kettensägen Gamepanel -->
<div class="bg-black/40 rounded-xl p-6 backdrop-blur-lg flex justify-between items-center
{% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
<span class="text-xl font-semibold text-gray-200">Kettensägen Gamepanel</span>
<div class="flex items-center gap-3">
<span class="text-green-400 font-semibold">Online</span>
<div class="status-indicator status-online"></div>
</div>
</div>
<!-- Discord Bots -->
<div class="bg-black/40 rounded-xl p-6 backdrop-blur-lg flex justify-between items-center
{% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
<span class="text-xl font-semibold text-gray-200">Discord Bots</span>
<div class="flex items-center gap-3">
<span class="text-yellow-400 font-semibold">Wartungsarbeiten</span>
<div class="status-indicator status-wartung"></div>
</div>
</div>
<!-- Datenbank -->
<div class="bg-black/40 rounded-xl p-6 backdrop-blur-lg flex justify-between items-center
{% if maintenance_active %}border border-yellow-500/30{% else %}border border-purple-500/20{% endif %}">
<span class="text-xl font-semibold text-gray-200">Datenbank</span>
<div class="flex items-center gap-3">
<span class="text-red-400 font-semibold">Offline</span>
<div class="status-indicator status-offline"></div>
</div>
</div>
</div>
{% endblock %}