1 files changed, 70 insertions, 22 deletions
diff --git a/src/templates/index.html b/src/templates/index.html
index 683891c..4663f5d 100644
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -4,34 +4,82 @@
     <meta charset="UTF-8" />
 
     <style>
-      input[type="submit"] {
+      .make {
         display: block;
+        background: none;
+        border: 0 none;
+        cursor: pointer;
+      }
+
+      .model {
+        display: block;
+        background: none;
+        border: 0 none;
+        cursor: pointer;
+        margin-left: 20px;
+      }
+
+      .sidebar {
+        width: 300px;
+        height: 100%;
+        position: fixed;
+        z-index: 1;
+      }
+
+      .main {
+        margin-left: 300px;
+        height: 100%;
       }
     </style>
   </head>
   <body>
-    <h1>Parts Catalog</h1>
-    {{#each makes}}
-    <form action="/parts">
-      {{#if (eq this ../selected_make)}}
-      <input disabled type="submit" name="make" value="{{ this }}" />
-      <input type="hidden" name="make" value="{{ ../selected_make }}" />
-      {{#each ../models}}
-      {{#if (eq this ../../selected_model)}}
-      <input disabled type="submit" name="model" value="{{ this }}" />
-      Parts for {{ this }}
-      {{else}}
-      <input type="submit" name="model" value="{{ this }}" />
-      {{/if}}
+    <div class="sidebar">
+      <h1>Parts Catalog</h1>
+      {{#each makes}}
+      <form action="/parts">
+        {{#if (eq this ../selected_make)}}
+        <button disabled class="make">
+          {{ this }}
+        </button>
+        <input type="hidden" name="make" value="{{ ../selected_make }}" />
+        {{#each ../models}}
+        {{#if (eq this ../../selected_model)}}
+        <button disabled class="model">{{ this }}</button>
+        {{else}}
+        <button class="model" name="model" value="{{ this }}">
+          {{ this }}
+        </button>
+        {{/if}}
+        {{else}}
+        <button disabled class="model">(No models found)</button>
+        {{/each}}
+        {{else}}
+        <button class="make" name="make" value="{{ this }}">{{ this }}</button>
+        {{/if}}
+      </form>
       {{else}}
-      No models found.
+      No makes found.
       {{/each}}
-      {{else}}
-      <input type="submit" name="make" value="{{ this }}" />
-      {{/if}}
-    </form>
-    {{else}}
-    No makes found.
-    {{/each}}
+    </div>
+
+    <div class="main">
+      <form action="/parts">
+        <input type="hidden" name="make" value="{{ selected_make }}" />
+        <input type="hidden" name="model" value="{{ selected_model }}" />
+        <input
+          type="search"
+          name="search"
+          placeholder="Part #, Name, Source, etc."
+        />
+        <button>Search</button>
+      </form>
+      <table>
+        {{#each parts}}
+        <tr>
+          <td>{{ this }}</td>
+        </tr>
+        {{/each}}
+      </table>
+    </div>
   </body>
 </html>