Change look of device list

This commit is contained in:
Peter Stockings
2023-01-24 23:52:05 +11:00
parent b25f57e103
commit e7087aedbb

View File

@@ -1,29 +1,39 @@
<div class="flex justify-center"> <div class="w-full max-w-screen-xl mx-auto p-6">
<div class="relative overflow-x-auto"> <div class="relative overflow-hidden mb-8 bg-white">
<table class="lg:w-1/4 sm:w-full text-sm text-left text-gray-500 dark:text-gray-400"> <div class="p-4 bg-grey-lighter py-8">
<thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400"> <div class="bg-white mx-auto max-w-sm shadow-lg rounded-lg overflow-hidden">
<tr> <div class="sm:flex sm:items-center px-2 py-4">
<th scope="col" class="px-6 py-3"> <div class="flex-grow">
Name <h3 class="font-normal px-2 py-3 leading-tight">Devices</h3>
</th> <div class="w-full">
<th scope="col" class="px-6 py-3"> {% for d in devices %}
Status <div class="flex cursor-pointer my-1 hover:bg-blue-lightest rounded"
</th> hx-get="{{ url_for('device', device_id=d['id']) }}" hx-push-url="true"
</tr> hx-target="#container">
</thead> <div class="w-8 h-10 text-center py-1">
<tbody> <p
{% for d in devices %} class="text-3xl p-0 {{ 'text-green-dark' if d['is_active']=='yes' else 'text-grey-dark'}}">
<tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700 cursor-pointer" &bull;</p>
hx-get="{{ url_for('device', device_id=d['id']) }}" hx-push-url="true" hx-target="#container"> </div>
<th scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white"> <div class="w-4/5 h-10 py-3 px-1">
{{d['name']}} <p class="hover:text-blue-dark">{{d['name']}}</p>
</th> </div>
<td class="px-6 py-4"> <div class="w-1/5 h-10 text-right p-3">
{{d['is_active']}} <p class="text-sm text-grey-dark">0</p>
</td> </div>
</tr> </div>
{% endfor %} {% endfor %}
</tbody> </div>
</table> </div>
</div>
<div class="sm:flex bg-grey-light sm:items-center px-2 py-4">
<div class="flex-grow text-right">
<button class="bg-blue hover:bg-blue-dark text-white py-2 px-4 rounded">
Add New
</button>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>