From 2bd501d071f30402046ef15d39aa4bf804f2497a Mon Sep 17 00:00:00 2001
From: Adam Jahr <adamjahr@Adams-iMac.local>
Date: Fri, 19 Jun 2020 19:45:00 -0400
Subject: [PATCH] L5 ending code

---
 index.html | 7 +++++++
 main.js    | 7 ++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index ac95523..7918f28 100644
--- a/index.html
+++ b/index.html
@@ -21,6 +21,13 @@
             <h1>{{ product }}</h1>
             <p v-if="inStock">In Stock</p>
             <p v-else>Out of Stock</p>
+            <ul>
+              <li v-for="detail in details">{{ detail }}</li>
+            </ul>
+            <ul>
+              <li v-for="size in sizes">{{ size }}</li>
+            </ul>
+            <div v-for="variant in variants" :key="variant.id">{{ variant.color }}</div>
           </div>
         </div>
       </div>
diff --git a/main.js b/main.js
index 1725ec2..f238d40 100644
--- a/main.js
+++ b/main.js
@@ -4,7 +4,12 @@ const app = Vue.createApp({
             product: 'Socks',
             image: './assets/images/socks_blue.jpg',
             inStock: true,
-            details: ['50% cotton', '30% wool', '20% polyester']
+            details: ['50% cotton', '30% wool', '20% polyester'],
+            sizes: ['S', 'M', 'L', 'XL'],
+            variants: [
+              { id: 2234, color: 'green' },
+              { id: 2235, color: 'blue' },
+            ]
         }
     }
 })