Add new styling for expandable tabes to hint that they can be expande…

…d when clicked.

app/assets/stylesheets/application.scss

@@ -27,6 +27,7 @@
 @import 'progress_stepper';
 @import 'audits';
 @import 'modal-dialog';
+@import 'expandable_table';
 @import 'custom';
 
 .modal-dialog {

app/assets/stylesheets/expandable_table.scss

@@ -0,0 +1,22 @@
+/*
+ * Customized Styling for Exandable Tables - provided by AdminLTE
+ * ExpandableTable - https://adminlte.io/docs/3.1/javascript/expandable-tables.html
+ */
+
+/*
+ * Default Expanded table has no indicator that the row is clickable. This styles an expand/collapse icon.
+ * Expanded=true is minus, Expanded=false is plus
+ */
+[data-widget="expandable-table"] {
+  &[aria-expanded="true"] {
+    td > .fa::before{
+      content: "\f068";
+    }
+  }
+
+  &[aria-expanded="false"] {
+    td > .fa::before{
+      content: "\f067";
+    }
+  }
+}

app/views/items/_item_row_inventory.html.erb

@@ -1,14 +1,17 @@
 <% row_item = row.last %>
 <tr data-widget="expandable-table" aria-expanded="false">
+  <td><i class="fa" /></td>
   <td><%= link_to(row_item[:item_name], item_url(row_item[:item_id])) %></td>
   <td class="numeric"><%= row_item[:quantity] %></td>
   <td class="numeric"><%= row_item[:item_on_hand_minimum_quantity] %></td>
   <td class="numeric"><%= row_item[:item_on_hand_recommended_quantity] %></td>
 </tr>
 <tr class="expandable-body">
-  <td colspan="4">
+  <td colspan="5">
+    <p>
     <% row_item[:locations].each do |location_name, quantity| %>
-      <p><%= "#{location_name} - #{quantity} units" %></p>
+      <%= "#{location_name} - #{quantity} units" %><br>
     <% end %>
+    </p>
   </td>
 </tr>

app/views/items/_items_inventory.html.erb

@@ -6,6 +6,7 @@
   <table class="table table-items-location">
     <thead>
     <tr>
+      <th></th>
       <th>Name</th>
       <th class="numeric">Quantity</th>
       <th class="numeric">Minimum Quantity</th>