Modified styles for the app to look better

views/item/add.twig

@@ -1,6 +1,6 @@
 {% extends 'layout.twig' %}
 
-{% block title %}Create Item{% endblock %}
+{% block title %}Add New Item{% endblock %}
 
 {% block content %}
 
@@ -17,7 +17,7 @@
       <div class="row">
         <div class="columns twelve">
           <label for="item_name">Item name:</label>
-          <input class="u-full-width" type="text" placeholder="My new item" id="item_name" name="item_name">
+          <input class="u-full-width" type="text" placeholder="My new item" id="item_name" name="item_name" required>
         </div>
       </div>
 
@@ -65,7 +65,7 @@
         </div>
       </div>
 
-      <input class="button-primary" type="submit" value="Submit">
+      <input class="button-primary u-full-width" type="submit" value="Submit">
     </form>
   </div>
 </section>

views/item/view.twig

@@ -5,9 +5,11 @@
 {% block content %}
 
 <!-- page header -->
-<header class="row">
+<header id="item-header" class="row">
   <div class="columns twelve">
     <h1>{{ item.name }}</h1>
+    <h4 class="item-added-date">Item added at: {{ item.createdAt }}</h4>
+    <h4 class="item-updated-date">Last updated at: {{ item.updatedAt }}</h4>
   </div>
 </header>
 
@@ -16,18 +18,24 @@
   <table class="columns twelve">
     <thead>
       <tr>
-        <th>Name</th>
+        <th>Product name</th>
+        <th>Serial number</th>
+        <th>SKU Number</th>
         <th>Manufacturer</th>
         <th>Type</th>
-        <th>Created date</th>
+        <th>Seller</th>
+        <th>Purchase date</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <td>{{ item.name }}</td>
-        <td>{{ item.manufacturer }}</td>
+        <td>{{ item.serialNumber ? item.serialNumber : 'N/a' }}</td>
+        <td>{{ item.skuNumber ? item.skuNumber : 'N/a' }}</td>
+        <td>{{ item.manufacturer ? item.manufacturer : 'N/a' }}</td>
         <td>{{ item.type }}</td>
-        <td>{{ item.createdAt | date("m/d/Y h:i:s A") }}</td>
+        <td>{{ item.purchasedFrom ? item.purchasedFrom : 'N/a' }}</td>
+        <td>{{ item.purchasedAt | date("m/d/Y h:i:s A") }}</td>
       </tr>
     </tbody>
   </table>