48 lines
1.3 KiB
HTML
48 lines
1.3 KiB
HTML
{% extends "base.html" %}
|
|
{% block connect %}
|
|
|
|
<div class="container mx-auto px-4 py-6">
|
|
<!-- Connect All Button -->
|
|
<div class="max-w-3xl mx-auto mb-8">
|
|
<form
|
|
hx-post="/connect-all"
|
|
hx-target="#printers-container"
|
|
hx-swap="innerHTML"
|
|
>
|
|
<button class="w-full px-6 py-3 rounded bg-indigo-600 text-white hover:bg-indigo-500 font-bold text-lg">
|
|
Connect All Printers
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Printer Grid Container -->
|
|
<div id="printers-container" class="w-full">
|
|
<div class="grid gap-6 grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4">
|
|
{% for printer in printers.values() %}
|
|
<div class="h-fit">
|
|
{% include "_printer_card.html" %}
|
|
</div>
|
|
{% else %}
|
|
<div class="col-span-full text-center text-slate-400">
|
|
No printers configured. Check config.json file.
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<!-- Debug info -->
|
|
<div class="mt-8 text-sm text-slate-500">
|
|
Total Printers: {{ printers|length }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
/* Ensure grid items don't overlap at any screen size */
|
|
@media (min-width: 1024px) {
|
|
#printers-container .grid {
|
|
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
|
|
}
|
|
}
|
|
</style>
|
|
{% endblock %}
|