Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

L7 end #148

Open
wants to merge 18 commits into
base: master
Choose a base branch
from
Prev Previous commit
Next Next commit
L7 starting code
Adam Jahr authored and Adam Jahr committed Jul 7, 2020
commit 58e74974e0611367551eed54b789ffe871f7693c
10 changes: 8 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
@@ -26,8 +26,14 @@ <h1>{{ product }}</h1>
<ul>
<li v-for="detail in details">{{ detail }}</li>
</ul>
<div v-for="variant in variants" :key="variant.id" @mouseover="updateImage(variant.image)">{{ variant.color }}</div>
<button class="button" v-on:click="addToCart">Add to Cart</button>

<div
class="color-circle"
v-for="variant in variants"
:key="variant.id"
@mouseover="updateImage(variant.image)"
:style="{ backgroundColor: variant.color }"></div>
<button class="button" :class="{ disabledButton: !inStock }" :disabled="!inStock" v-on:click="addToCart">Add to Cart</button>
</div>
</div>
</div>
2 changes: 1 addition & 1 deletion main.js
Original file line number Diff line number Diff line change
@@ -5,7 +5,7 @@ const app = Vue.createApp({
product: 'Socks',
brand: 'Vue Mastery',
image: './assets/images/socks_blue.jpg',
inStock: true,
inStock: false,
details: ['50% cotton', '30% wool', '20% polyester'],
variants: [
{ id: 2234, color: 'green', image: './assets/images/socks_green.jpg' },