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

responsive web design

Browse source
This commit is contained in:
pika 2025-03-10 19:35:37 +01:00
parent 377bd7bc16
commit 092cf4995a
1 changed files with 30 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

32
templates/index.html
View file

@ -59,43 +59,45 @@
<body class="bg-gray-900 text-gray-100"> <body class="bg-gray-900 text-gray-100">
<header class="bg-indigo-700 text-white p-6 text-center"> <header class="bg-indigo-700 text-white p-6 text-center">
<h1 class="text-3xl font-bold">Caddy Dashboard</h1> <h1 class="text-2xl md:text-3xl font-bold">Caddy Dashboard</h1>
<p class="text-cyan-300">Übersicht über alle aktiven Proxy-Server</p> <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> <button onclick="toggleSearch()" class="bg-cyan-500 hover:bg-cyan-400 text-white px-4 py-2 rounded mt-3">🔍 Suche</button>
</header> </header>
<div class="container mx-auto p-6"> <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-2 mb-4 text-gray-900 rounded-md" placeholder="🔍 Suche nach einer Subdomain..." onkeyup="filterEntries()">
{% for server, entries in proxies.items() %} {% 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-4 rounded-md shadow-md mb-6">
<div class="flex justify-between items-center"> <div class="flex flex-col md:flex-row justify-between items-start md:items-center">
<h2 class="text-xl font-semibold text-indigo-400">{{ server }}</h2> <h2 class="text-lg md:text-xl font-semibold text-indigo-400">{{ server }}</h2>
<button onclick="deleteServer('{{ server }}')" class="bg-red-500 text-white px-3 py-1 rounded-md">🗑️ Löschen</button> <button onclick="deleteServer('{{ server }}')" class="mt-2 md:mt-0 bg-red-500 text-white px-3 py-1 rounded-md">🗑️ Löschen</button>
</div> </div>
<div class="overflow-x-auto">
<table class="w-full mt-3 border-collapse border border-gray-700"> <table class="w-full mt-3 border-collapse border border-gray-700">
<thead> <thead>
<tr class="text-cyan-400 bg-gray-700"> <tr class="text-cyan-400 bg-gray-700">
<th class="text-left p-3">Domain</th> <th class="text-left p-2 md:p-3">Domain</th>
<th class="text-left p-3">Ziel</th> <th class="text-left p-2 md:p-3">Ziel</th>
<th class="text-left p-3">Status</th> <th class="text-left p-2 md:p-3">Status</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{% for domain, target in entries.items() %} {% for domain, target in entries.items() %}
<tr data-domain="{{ domain }}"> <tr data-domain="{{ domain }}" class="text-sm md:text-base">
<td class="p-3 border border-gray-700"> <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">{{ domain }}</a> <a href="https://{{ domain }}" target="_blank" class="text-indigo-400 hover:text-indigo-300 break-all">{{ domain }}</a>
</td> </td>
<td class="p-3 border border-gray-700">{{ target }}</td> <td class="p-2 md:p-3 border border-gray-700 break-words">{{ target }}</td>
<td class="p-3 border border-gray-700"> <td class="p-2 md:p-3 border border-gray-700">
<button onclick="checkStatus('{{ domain }}', this)" class="bg-cyan-500 text-white px-3 py-1 rounded-md">🔄 Prüfen</button> <button onclick="checkStatus('{{ domain }}', this)" class="bg-cyan-500 text-white px-2 md:px-3 py-1 rounded-md">🔄 Prüfen</button>
</td> </td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
</div> </div>
</div>
{% endfor %} {% endfor %}
</div> </div>