docker/caddydb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

fixed mobile?

Browse source
This commit is contained in:
pika 2025-03-10 19:45:47 +01:00
parent 092cf4995a
commit 736dde1e8f
1 changed files with 23 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

53
templates/index.html
View file

@ -2,6 +2,7 @@
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Caddy Dashboard</title>
<script src="https://cdn.tailwindcss.com"></script>
<script>
@ -15,10 +16,10 @@
function filterEntries() {
let query = document.getElementById("search-box").value.toLowerCase();
let rows = document.querySelectorAll("tbody tr");
rows.forEach(row => {
let domain = row.dataset.domain.toLowerCase();
row.style.display = domain.includes(query) ? "" : "none";
let cards = document.querySelectorAll(".domain-card");
cards.forEach(card => {
let domain = card.dataset.domain.toLowerCase();
card.style.display = domain.includes(query) ? "" : "none";
});
}
@ -59,43 +60,31 @@
<body class="bg-gray-900 text-gray-100">
<header class="bg-indigo-700 text-white p-6 text-center">
<h1 class="text-2xl md:text-3xl font-bold">Caddy Dashboard</h1>
<p class="text-cyan-300 text-sm md:text-lg">Übersicht über alle aktiven Proxy-Server</p>
<button onclick="toggleSearch()" class="bg-cyan-500 hover:bg-cyan-400 text-white px-4 py-2 rounded mt-3">🔍 Suche</button>
<h1 class="text-3xl font-bold">Caddy Dashboard</h1>
<p class="text-cyan-300 text-lg">Übersicht über alle aktiven Proxy-Server</p>
<button onclick="toggleSearch()" class="bg-cyan-500 hover:bg-cyan-400 text-white px-6 py-3 rounded-lg mt-4 text-lg">🔍 Suche</button>
</header>
<div class="container mx-auto p-4 md:p-6">
<input type="text" id="search-box" class="hidden w-full p-2 mb-4 text-gray-900 rounded-md" placeholder="🔍 Suche nach einer Subdomain..." onkeyup="filterEntries()">
<input type="text" id="search-box" class="hidden w-full p-4 mb-4 text-gray-900 text-lg rounded-md" placeholder="🔍 Suche nach einer Subdomain..." onkeyup="filterEntries()">
{% for server, entries in proxies.items() %}
<div id="server-box-{{ server }}" class="bg-gray-800 p-4 rounded-md shadow-md mb-6">
<div id="server-box-{{ server }}" class="bg-gray-800 p-6 rounded-lg shadow-lg mb-6">
<div class="flex flex-col md:flex-row justify-between items-start md:items-center">
<h2 class="text-lg md:text-xl font-semibold text-indigo-400">{{ server }}</h2>
<button onclick="deleteServer('{{ server }}')" class="mt-2 md:mt-0 bg-red-500 text-white px-3 py-1 rounded-md">🗑️ Löschen</button>
<h2 class="text-2xl font-semibold text-indigo-400">{{ server }}</h2>
<button onclick="deleteServer('{{ server }}')" class="mt-3 md:mt-0 bg-red-500 text-white px-6 py-2 rounded-lg text-lg">🗑️ Löschen</button>
</div>
<div class="overflow-x-auto">
<table class="w-full mt-3 border-collapse border border-gray-700">
<thead>
<tr class="text-cyan-400 bg-gray-700">
<th class="text-left p-2 md:p-3">Domain</th>
<th class="text-left p-2 md:p-3">Ziel</th>
<th class="text-left p-2 md:p-3">Status</th>
</tr>
</thead>
<tbody>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 mt-4">
{% for domain, target in entries.items() %}
<tr data-domain="{{ domain }}" class="text-sm md:text-base">
<td class="p-2 md:p-3 border border-gray-700 break-words">
<a href="https://{{ domain }}" target="_blank" class="text-indigo-400 hover:text-indigo-300 break-all">{{ domain }}</a>
</td>
<td class="p-2 md:p-3 border border-gray-700 break-words">{{ target }}</td>
<td class="p-2 md:p-3 border border-gray-700">
<button onclick="checkStatus('{{ domain }}', this)" class="bg-cyan-500 text-white px-2 md:px-3 py-1 rounded-md">🔄 Prüfen</button>
</td>
</tr>
<div class="domain-card bg-gray-700 p-4 rounded-lg shadow-md flex flex-col space-y-2" data-domain="{{ domain }}">
<div class="flex justify-between">
<a href="https://{{ domain }}" target="_blank" class="text-indigo-400 hover:text-indigo-300 text-lg break-words">{{ domain }}</a>
<button onclick="checkStatus('{{ domain }}', this)" class="bg-cyan-500 text-white px-4 py-2 rounded-lg text-sm">🔄 Prüfen</button>
</div>
<p class="text-gray-300 break-words text-lg">{{ target }}</p>
</div>
{% endfor %}
</tbody>
</table>
</div>
</div>
{% endfor %}