Started work to move the CSS framework to Bootstrap 5

views/hardware/index.erb

@@ -1,20 +1,20 @@
-<div class="grid-x grid-margin-x">
-  <div class="cell small-12">
+<div class="row mb-3">
+  <div class="col-12">
     <h1>List of hardware</h1>
   </div>
 
-  <div class="cell small-12">
+  <div class="col-12">
     <p>
       <a href="/hardware/add">Add new hardware</a>
     </p>
   </div>
 </div>
 
-<div class="grid-x grid-margin-x">
+<div class="row mb-3">
   <% if hardware.length > 0 %>
-    <div class="cell small-12">
-      <table>
-        <thead>
+    <div class="col-12">
+      <table class="table table-hover table-responsive">
+        <thead class="table-light">
           <tr>
             <th>Hardware name</th>
             <th>Type</th>
@@ -35,7 +35,7 @@
       </table>
     </div>
   <% else %>
-    <div class="cell small-12">
+    <div class="col-12">
       <p>I'm sorry, there doesn't appear to be any hardware added yet. Check again later!</p>
     </div>
   <% end %>