Fix: Clock overlay in header - changed sm:flex to lg:flex, added z-0
This commit is contained in:
Sam
parent
79fb274b3b
commit
320f273c3e
1 changed files with 163 additions and 152 deletions
|
|
@ -103,10 +103,10 @@
|
|||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center space-x-4">
|
||||
<div class="w-10 h-10 bg-gradient-to-br from-blue-500 to-purple-600 rounded-xl flex items-center justify-center text-xl">
|
||||
🦞
|
||||
Briefing
|
||||
</div>
|
||||
<div>
|
||||
<h1 class="text-xl font-bold text-white">Daily Briefing</h1>
|
||||
<h1 class="text-xl font-bold text-white">Sam's Dashboard</h1>
|
||||
<div class="flex items-center space-x-3 text-xs">
|
||||
<span class="live-indicator">LIVE</span>
|
||||
<span id="connection-status" class="text-green-400">●</span>
|
||||
|
|
@ -115,11 +115,17 @@
|
|||
</div>
|
||||
|
||||
<!-- Center Clock & Date -->
|
||||
<div class="absolute left-1/2 transform -translate-x-1/2 hidden sm:flex flex-col items-center">
|
||||
<div class="absolute left-1/2 transform -translate-x-1/2 hidden lg:flex flex-col items-center z-0">
|
||||
<div class="text-xl font-bold text-white font-mono tracking-wider leading-none" id="live-clock">--:--:--</div>
|
||||
<div class="text-[10px] text-gray-400 font-medium uppercase tracking-widest mt-1" id="live-date">--. --. ----</div>
|
||||
</div>
|
||||
|
||||
<nav class="hidden md:flex items-center space-x-8 mr-12">
|
||||
<a href="#weather-section" class="text-sm font-medium text-gray-400 hover:text-white transition-colors">Wetter</a>
|
||||
<a href="#news-section" class="text-sm font-medium text-gray-400 hover:text-white transition-colors">News</a>
|
||||
<a href="#tasks-section" class="text-sm font-medium text-gray-400 hover:text-white transition-colors">Tasks</a>
|
||||
</nav>
|
||||
|
||||
<div class="flex items-center space-x-3">
|
||||
<button onclick="manualRefresh()" id="refresh-btn" class="px-3 py-1.5 bg-gray-800 hover:bg-gray-700 rounded-lg text-sm transition-colors flex items-center space-x-2">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
|
|
@ -135,97 +141,127 @@
|
|||
<!-- Main Content -->
|
||||
<main class="max-w-7xl mx-auto px-4 py-6 sm:px-6 lg:px-8 space-y-6">
|
||||
|
||||
<!-- Row 1: Weather Cards -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
|
||||
<!-- Weather Leverkusen -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="weather-card">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h2 class="text-base font-semibold text-gray-200 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z"></path>
|
||||
</svg>
|
||||
Wetter Leverkusen
|
||||
</h2>
|
||||
{% if weather.cached %}<span class="cached-badge">cached</span>{% endif %}
|
||||
</div>
|
||||
{% if weather.error %}
|
||||
<div class="text-red-400 text-sm">{{ weather.error }}</div>
|
||||
{% else %}
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<div>
|
||||
<div class="text-4xl font-bold text-white" id="weather-temp">{{ weather.temp }}°</div>
|
||||
<div class="text-gray-400 text-sm mt-1">Gefühlt {{ weather.feels_like }}°</div>
|
||||
<!-- Row 1: Weather Cards & Hourly -->
|
||||
<div id="weather-section" class="space-y-6">
|
||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-5">
|
||||
<!-- Weather Leverkusen -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="weather-card">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h2 class="text-base font-semibold text-gray-200 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z"></path>
|
||||
</svg>
|
||||
Leverkusen
|
||||
</h2>
|
||||
{% if weather.cached %}<span class="cached-badge">cached</span>{% endif %}
|
||||
</div>
|
||||
<div class="text-5xl" id="weather-icon">{{ weather.icon }}</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm mb-4">
|
||||
<span class="text-gray-400" id="weather-desc">{{ weather.description }}</span>
|
||||
<span class="text-gray-500">💧 {{ weather.humidity }}%</span>
|
||||
</div>
|
||||
<!-- Forecast -->
|
||||
{% if weather.forecast %}
|
||||
<div class="border-t border-gray-700 pt-3">
|
||||
<div class="grid grid-cols-3 gap-2">
|
||||
{% for day in weather.forecast %}
|
||||
<div class="text-center p-2 bg-gray-800/50 rounded-lg">
|
||||
<div class="text-xs text-gray-500 mb-1">{{ day.day }}</div>
|
||||
<div class="text-xl mb-1">{{ day.icon }}</div>
|
||||
<div class="text-sm font-semibold">{{ day.temp_max }}°</div>
|
||||
<div class="text-xs text-gray-500">{{ day.temp_min }}°</div>
|
||||
{% if weather.error %}
|
||||
<div class="text-red-400 text-sm">{{ weather.error }}</div>
|
||||
{% else %}
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<div>
|
||||
<div class="text-4xl font-bold text-white" id="weather-temp">{{ weather.temp }}°</div>
|
||||
<div class="text-gray-400 text-sm mt-1">Gefühlt {{ weather.feels_like }}°</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div class="text-5xl" id="weather-icon">{{ weather.icon }}</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm mb-4">
|
||||
<span class="text-gray-400" id="weather-desc">{{ weather.description }}</span>
|
||||
<span class="text-gray-500">💧 {{ weather.humidity }}%</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<!-- Weather Rab/Banjol -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="weather-secondary-card">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h2 class="text-base font-semibold text-gray-200 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-cyan-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||
</svg>
|
||||
Wetter Rab/Banjol 🇭🇷
|
||||
</h2>
|
||||
{% if weather_secondary.cached %}<span class="cached-badge">cached</span>{% endif %}
|
||||
</div>
|
||||
{% if weather_secondary.error %}
|
||||
<div class="text-red-400 text-sm">{{ weather_secondary.error }}</div>
|
||||
{% else %}
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<div>
|
||||
<div class="text-4xl font-bold text-white" id="weather-secondary-temp">{{ weather_secondary.temp }}°</div>
|
||||
<div class="text-gray-400 text-sm mt-1">Gefühlt {{ weather_secondary.feels_like }}°</div>
|
||||
<!-- Weather Rab/Banjol -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="weather-secondary-card">
|
||||
<div class="flex items-center justify-between mb-3">
|
||||
<h2 class="text-base font-semibold text-gray-200 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-cyan-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.055 11H5a2 2 0 012 2v1a2 2 0 002 2 2 2 0 012 2v2.945M8 3.935V5.5A2.5 2.5 0 0010.5 8h.5a2 2 0 012 2 2 2 0 104 0 2 2 0 012-2h1.064M15 20.488V18a2 2 0 012-2h3.064M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||
</svg>
|
||||
Rab/Banjol 🇭🇷
|
||||
</h2>
|
||||
{% if weather_secondary.cached %}<span class="cached-badge">cached</span>{% endif %}
|
||||
</div>
|
||||
<div class="text-5xl" id="weather-secondary-icon">{{ weather_secondary.icon }}</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm mb-4">
|
||||
<span class="text-gray-400" id="weather-secondary-desc">{{ weather_secondary.description }}</span>
|
||||
<span class="text-gray-500">💧 {{ weather_secondary.humidity }}%</span>
|
||||
</div>
|
||||
<!-- Forecast -->
|
||||
{% if weather_secondary.forecast %}
|
||||
<div class="border-t border-gray-700 pt-3">
|
||||
<div class="grid grid-cols-3 gap-2">
|
||||
{% for day in weather_secondary.forecast %}
|
||||
<div class="text-center p-2 bg-gray-800/50 rounded-lg">
|
||||
<div class="text-xs text-gray-500 mb-1">{{ day.day }}</div>
|
||||
<div class="text-xl mb-1">{{ day.icon }}</div>
|
||||
<div class="text-sm font-semibold">{{ day.temp_max }}°</div>
|
||||
<div class="text-xs text-gray-500">{{ day.temp_min }}°</div>
|
||||
{% if weather_secondary.error %}
|
||||
<div class="text-red-400 text-sm">{{ weather_secondary.error }}</div>
|
||||
{% else %}
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<div>
|
||||
<div class="text-4xl font-bold text-white" id="weather-secondary-temp">{{ weather_secondary.temp }}°</div>
|
||||
<div class="text-gray-400 text-sm mt-1">Gefühlt {{ weather_secondary.feels_like }}°</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div class="text-5xl" id="weather-secondary-icon">{{ weather_secondary.icon }}</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-between text-sm mb-4">
|
||||
<span class="text-gray-400" id="weather-secondary-desc">{{ weather_secondary.description }}</span>
|
||||
<span class="text-gray-500">💧 {{ weather_secondary.humidity }}%</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<!-- Hourly Forecast (Leverkusen) -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in lg:col-span-1" id="hourly-weather-card">
|
||||
<h2 class="text-base font-semibold text-gray-200 mb-4 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-yellow-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
||||
</svg>
|
||||
Nächste Stunden
|
||||
</h2>
|
||||
<div class="flex space-x-4 overflow-x-auto pb-2 scrollbar-hide" id="hourly-container">
|
||||
{% if hourly_weather and hourly_weather.Leverkusen %}
|
||||
{% for hour in hourly_weather.Leverkusen[:8] %}
|
||||
<div class="flex-shrink-0 text-center p-2 bg-gray-800/40 rounded-lg min-w-[70px]">
|
||||
<div class="text-[10px] text-gray-500 mb-1">{{ hour.time }}</div>
|
||||
<div class="text-xl mb-1">{{ hour.icon }}</div>
|
||||
<div class="text-sm font-bold">{{ hour.temp }}°</div>
|
||||
<div class="text-[9px] text-gray-400">{{ hour.precip }}%</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="text-gray-500 text-xs py-4">Keine Stundendaten verfügbar.</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Row 2: News Headlines -->
|
||||
<div id="news-section" class="space-y-4">
|
||||
<h2 class="text-lg font-bold text-white flex items-center">
|
||||
<svg class="w-6 h-6 mr-2 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z"></path>
|
||||
</svg>
|
||||
Aktuelle Schlagzeilen
|
||||
</h2>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4" id="news-container">
|
||||
{% if news %}
|
||||
{% for item in news[:12] %}
|
||||
<div class="glass-card rounded-xl p-4 flex flex-col h-full hover:scale-[1.02] transition-transform">
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<span class="text-[10px] font-bold uppercase tracking-wider text-gray-500">{{ item.source }}</span>
|
||||
<span class="text-[9px] text-gray-600">{{ item.time }}</span>
|
||||
</div>
|
||||
<h3 class="text-sm font-medium text-gray-200 line-clamp-3 mb-3 flex-grow">
|
||||
{{ item.title }}
|
||||
</h3>
|
||||
<a href="{{ item.url }}" target="_blank" class="text-blue-400 text-xs font-semibold flex items-center hover:text-blue-300">
|
||||
Mehr lesen
|
||||
<svg class="w-3 h-3 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="col-span-full glass-card rounded-xl p-8 text-center text-gray-500">
|
||||
Keine aktuellen Nachrichten geladen.
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Row 2: System Status & Home Assistant -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
|
||||
<div id="tasks-section" class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||
<!-- System Status with CPU/RAM -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="system-card">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
|
|
@ -469,79 +505,11 @@
|
|||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Chat with Sam -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="chat-card">
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<h2 class="text-base font-semibold text-gray-200 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"></path>
|
||||
</svg>
|
||||
Chat mit Sam 🤖
|
||||
</h2>
|
||||
<div class="flex items-center space-x-2">
|
||||
<span id="chat-typing" class="text-xs text-gray-500 hidden">Sam schreibt...</span>
|
||||
<span id="chat-status" class="status-dot status-online"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Chat Messages -->
|
||||
<div id="chat-messages" class="space-y-3 max-h-64 overflow-y-auto mb-4 bg-gray-900/50 rounded-lg p-3">
|
||||
<div class="flex items-start space-x-2">
|
||||
<div class="w-8 h-8 bg-gradient-to-br from-blue-500 to-purple-600 rounded-full flex items-center justify-center text-sm flex-shrink-0">🤖</div>
|
||||
<div class="bg-gray-800 rounded-lg px-3 py-2 text-sm text-gray-200 max-w-[80%]">
|
||||
Hey! Ich bin Sam. Schreib mir hier direkt – ich antworte so schnell ich kann.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Chat Input -->
|
||||
<div class="flex items-center space-x-2">
|
||||
<input
|
||||
type="text"
|
||||
id="chat-input"
|
||||
placeholder="Nachricht an Sam..."
|
||||
class="flex-1 bg-gray-800 border border-gray-700 rounded-lg px-4 py-2 text-sm text-gray-200 placeholder-gray-500 focus:outline-none focus:border-blue-500"
|
||||
onkeypress="if(event.key==='Enter') sendChatMessage()"
|
||||
>
|
||||
<button onclick="sendChatMessage()" id="chat-send-btn" class="px-4 py-2 bg-blue-600 hover:bg-blue-500 rounded-lg text-sm text-white transition-colors flex items-center space-x-1">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"></path>
|
||||
</svg>
|
||||
<span>Senden</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Quick Actions -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in">
|
||||
<h2 class="text-base font-semibold text-gray-200 mb-4 flex items-center">
|
||||
<svg class="w-5 h-5 mr-2 text-pink-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
|
||||
</svg>
|
||||
Quick Actions
|
||||
</h2>
|
||||
<div class="grid grid-cols-2 sm:grid-cols-4 gap-3">
|
||||
<a href="https://homeassistant.daddelolymp.de" target="_blank" class="p-3 bg-gray-800 hover:bg-gray-700 rounded-lg text-center transition-colors">
|
||||
<div class="text-2xl mb-1">🏠</div>
|
||||
<div class="text-xs text-gray-300">Home Assistant</div>
|
||||
</a>
|
||||
<a href="http://10.10.10.10:3456" target="_blank" class="p-3 bg-gray-800 hover:bg-gray-700 rounded-lg text-center transition-colors">
|
||||
<div class="text-2xl mb-1">📋</div>
|
||||
<div class="text-xs text-gray-300">Vikunja</div>
|
||||
</a>
|
||||
<a href="https://clawhub.ai" target="_blank" class="p-3 bg-gray-800 hover:bg-gray-700 rounded-lg text-center transition-colors">
|
||||
<div class="text-2xl mb-1">🦞</div>
|
||||
<div class="text-xs text-gray-300">ClawHub</div>
|
||||
</a>
|
||||
<button onclick="manualRefresh()" class="p-3 bg-gray-800 hover:bg-gray-700 rounded-lg text-center transition-colors">
|
||||
<div class="text-2xl mb-1">🔄</div>
|
||||
<div class="text-xs text-gray-300">Refresh</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||
<!-- System Status with CPU/RAM -->
|
||||
<div class="glass-card rounded-xl p-5 fade-in" id="system-card">
|
||||
|
||||
<script>
|
||||
let ws = null;
|
||||
|
|
@ -588,6 +556,49 @@
|
|||
document.getElementById('weather-secondary-desc').textContent = data.weather_secondary.description;
|
||||
}
|
||||
|
||||
// Update Hourly Weather
|
||||
if (data.hourly_weather && data.hourly_weather.Leverkusen) {
|
||||
const container = document.getElementById('hourly-container');
|
||||
container.innerHTML = '';
|
||||
data.hourly_weather.Leverkusen.slice(0, 8).forEach(hour => {
|
||||
const div = document.createElement('div');
|
||||
div.className = 'flex-shrink-0 text-center p-2 bg-gray-800/40 rounded-lg min-w-[70px]';
|
||||
div.innerHTML = `
|
||||
<div class="text-[10px] text-gray-500 mb-1">${hour.time}</div>
|
||||
<div class="text-xl mb-1">${hour.icon}</div>
|
||||
<div class="text-sm font-bold">${hour.temp}°</div>
|
||||
<div class="text-[9px] text-gray-400">${hour.precip}%</div>
|
||||
`;
|
||||
container.appendChild(div);
|
||||
});
|
||||
}
|
||||
|
||||
// Update News
|
||||
if (data.news && data.news.length > 0) {
|
||||
const container = document.getElementById('news-container');
|
||||
container.innerHTML = '';
|
||||
data.news.slice(0, 12).forEach(item => {
|
||||
const div = document.createElement('div');
|
||||
div.className = 'glass-card rounded-xl p-4 flex flex-col h-full hover:scale-[1.02] transition-transform';
|
||||
div.innerHTML = `
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<span class="text-[10px] font-bold uppercase tracking-wider text-gray-500">${item.source}</span>
|
||||
<span class="text-[9px] text-gray-600">${item.time}</span>
|
||||
</div>
|
||||
<h3 class="text-sm font-medium text-gray-200 line-clamp-3 mb-3 flex-grow">
|
||||
${item.title}
|
||||
</h3>
|
||||
<a href="${item.url}" target="_blank" class="text-blue-400 text-xs font-semibold flex items-center hover:text-blue-300">
|
||||
Mehr lesen
|
||||
<svg class="w-3 h-3 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
|
||||
</svg>
|
||||
</a>
|
||||
`;
|
||||
container.appendChild(div);
|
||||
});
|
||||
}
|
||||
|
||||
// Update System Status
|
||||
if (data.system_status) {
|
||||
document.getElementById('cpu-percent').textContent = data.system_status.cpu.percent + '%';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue