initial commit

2025-08-04 16:59:29 +02:00
commit 21b41de886
10 changed files with 470 additions and 0 deletions
--- a/templates/htop.html
+++ b/templates/htop.html
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <title>Task Manager</title>
+    <script src="/static/htmx.min.js"></script>
+    <style>
+        :root {
+            --bg-color: #121212;
+            --text-color: #e0e0e0;
+            --accent-color: #007bff;
+            --danger-color: #dc3545;
+            --table-bg: #1e1e1e;
+            --hover-bg: #2a2a2a;
+            --border-color: #333;
+        }
+
+        body {
+            font-family: Arial, sans-serif;
+            background-color: var(--bg-color);
+            color: var(--text-color);
+            margin: 2rem;
+        }
+
+        .page-title {
+            text-align: center;
+            font-size: 2.8rem;
+            margin: 2rem 0 1rem 0;
+            font-weight: bold;
+            letter-spacing: 1px;
+            background: linear-gradient(to right, #00c6ff, #00e6aa);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            text-shadow: 0 0 5px rgba(0,0,0,0.5);
+        }
+
+        .card {
+            background-color: #1e1e2f; /* dark card background */
+            border-radius: 12px;
+            padding: 20px;
+            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
+            margin: 3rem auto;      /* vertical margin + horizontal centering */
+            max-width: 900px;       /* limits width */
+            color: #e0e0ff;
+        }
+        table {
+            width: 100%;
+            border-collapse: collapse;
+            background-color: var(--table-bg);
+            box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
+            margin-top: 1rem;
+            color: var(--text-color);
+        }
+
+        th, td {
+            padding: 10px 15px;
+            border-bottom: 1px solid var(--border-color);
+            text-align: left;
+            font-size: 14px;
+        }
+
+        th {
+            background-color: var(--accent-color);
+            color: white;
+            position: sticky;
+            top: 0;
+            z-index: 1;
+        }
+
+        tr:hover {
+            background-color: var(--hover-bg);
+        }
+
+        button {
+            padding: 5px 10px;
+            background-color: var(--danger-color);
+            color: white;
+            border: none;
+            border-radius: 4px;
+            cursor: pointer;
+        }
+
+        button:hover {
+            background-color: #c82333;
+        }
+
+        a {
+            color: #80dfff;
+            text-decoration: none;
+        }
+
+        a:hover {
+            text-decoration: underline;
+        }
+    </style>
+</head>
+<body>
+    <h1 class="page-title">🧠 Task Manager</h1>
+    <div 
+  id="htop-wrapper"
+  hx-get="/taskmanager/htop?sort={{.CurrentSort}}&order={{.CurrentOrder}}"
+  hx-trigger="load, every 1s"
+  hx-target="#process-table"
+  hx-swap="innerHTML">
+
+<div id="process-table" class="card">
+  {{template "table.html" .}}
+</div>
+</body>
+</html>