From cd5db12a2f08822e7fe96cfe14c43ec007e0758f Mon Sep 17 00:00:00 2001
From: Mark Cotton <tifosigoon@gmail.com>
Date: Mon, 7 Aug 2023 14:13:37 -0600
Subject: [PATCH] made the camera action buttons more obvious

---
 templates/cameras_partial.html | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/templates/cameras_partial.html b/templates/cameras_partial.html
index c77f3d5..1c752cc 100644
--- a/templates/cameras_partial.html
+++ b/templates/cameras_partial.html
@@ -5,13 +5,25 @@
 {% for camera in template_values['cameras'] %}
     {% if camera.is_online() %}
         <div class="row">
-            <div class="col-7 offset-1 left_text">
+            <div class="col-6 offset-1 left_text" style="overflow: hidden;">
                 {{ camera.name }}
             </div>
-            <div class="col-4">
-                <a href="/camera/{{ camera.id }}/preview" hx-get="/camera/{{ camera.id }}/preview" hx-trigger="click" hx-target="#camera_detail"><i class="bi bi-card-image" title="click to load preview image"></i></a>
-                <a href="/camera/{{ camera.id }}/event" hx-get="/camera/{{ camera.id }}/events" hx-trigger="click" hx-target="#camera_status_events"><i class="bi bi-calendar-event" title="click to load events list"></i></a>
-                <a href="/camera/{{ camera.id }}/status_plot" hx-get="/camera/{{ camera.id }}/status_plot" hx-trigger="click" hx-target="#camera_status_plot"><i class="bi bi-bar-chart" title="click to generate graph of events"></i></a>
+            <div class="col-5">
+                <a href="/camera/{{ camera.id }}/preview" hx-get="/camera/{{ camera.id }}/preview" hx-trigger="click" hx-target="#camera_detail">
+                    <button class="btn btn-outline-success">
+                        <i class="bi bi-card-image" title="click to load preview image"></i>
+                    </button>
+                </a>
+                <a href="/camera/{{ camera.id }}/event" hx-get="/camera/{{ camera.id }}/events" hx-trigger="click" hx-target="#camera_status_events">
+                    <button class="btn btn-outline-success">
+                        <i class="bi bi-calendar-event" title="click to load events list"></i>
+                    </button>
+                </a>
+                <a href="/camera/{{ camera.id }}/status_plot" hx-get="/camera/{{ camera.id }}/status_plot" hx-trigger="click" hx-target="#camera_status_plot">
+                    <button class="btn btn-outline-success">
+                        <i class="bi bi-bar-chart" title="click to generate graph of events"></i>
+                    </button>
+                </a>
             </div>
         </div>
     {% endif %}