From b8b82c0970b3e35e4805acdc1670ee448eb4387b Mon Sep 17 00:00:00 2001
From: Arona Jones <aj@aronajones.com>
Date: Mon, 7 Oct 2019 16:41:52 +0100
Subject: [PATCH] Prettify search/filter a bit

---
 assets/templates/asset_list.html | 73 +++++++++++++++++---------------
 1 file changed, 38 insertions(+), 35 deletions(-)

diff --git a/assets/templates/asset_list.html b/assets/templates/asset_list.html
index e3854b58..c6aa1281 100644
--- a/assets/templates/asset_list.html
+++ b/assets/templates/asset_list.html
@@ -8,45 +8,48 @@
   <h1 class="text-center">Asset List</h1>
 </div>
 
-<form id="asset-search-form" method="get">
+<form id="asset-search-form" method="get" class="form-inline pull-right">
   {% csrf_token %}
-  <div class="input-group">
-    <input type="query" name="query" placeholder="Search by Asset ID/Description" class="form-control" value="{{search_name}}">
+  <div class="input-group pull-right" style="width: auto;">
+    <input type="query" name="query" placeholder="Search by Asset ID/Description" class="form-control" value="{{search_name}}" style="width: 250px">
     <label for="asset_id" class="sr-only">Asset ID/Description:</label>
     <span class="input-group-btn"><button type="submit" class="btn btn-default">Search</button></span>
   </div>
-  <div class="form-group">
-    <label for="cat">Category:</label>
-    <select name="cat" class="form-control">
-          <option value="">None</option>
-          {% for name in categories %}
-          {% if name.name == category_select %}
-          <option selected>
-          {% else %}
-          <option>
-          {% endif %}
-            {{ name }}
-          </option>
-          {% endfor %}
-      </select>
-  </div>
-  <div class="form-group">
-    <label for="status">Status:</label>
-    <select name="status" class="form-control">
-    <option value="">None</option>
-            {% for name in statuses %}
-            {% if name.name == status_select %}
-            <option selected>
-            {% else %}
-            <option>
-            {% endif %}
-              {{ name }}
-            </option>
-            {% endfor %}
-    </select>
-  </div>
-  <!---TODO: Auto filter whenever an option is selected, instead of using a button -->
-  <button type="submit" class="btn btn-default">Filter</button>
+  <br>
+  <div style="margin-top: 1em;" class="pull-right">
+      <div class="form-group">
+        <label for="cat" class="sr-only">Category</label>
+        <select name="cat" class="form-control">
+              <option value="" class="text-muted">(category)</option>
+              {% for name in categories %}
+              {% if name.name == category_select %}
+              <option selected>
+              {% else %}
+              <option>
+              {% endif %}
+                {{ name }}
+              </option>
+              {% endfor %}
+          </select>
+      </div>
+      <div class="form-group">
+        <label for="status" class="sr-only">Status</label>
+        <select name="status" class="form-control">
+        <option value="">(status)</option>
+                {% for name in statuses %}
+                {% if name.name == status_select %}
+                <option selected>
+                {% else %}
+                <option>
+                {% endif %}
+                  {{ name }}
+                </option>
+                {% endfor %}
+        </select>
+      </div>
+      <!---TODO: Auto filter whenever an option is selected, instead of using a button -->
+      <button type="submit" class="btn btn-default">Filter</button>
+    </div>
 </form>
 
 <table class="table">