-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathdetail.html
117 lines (106 loc) · 4.91 KB
/
detail.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<!-- @include _top.html -->
<!-- @include _header.html -->
<div id="product-detail-page">
<div class="row">
<div class="large-12 columns">
<ul class="breadcrumbs">
<li><a href="index.html">Home</a></li>
<li><a href="<!-- @path listing.html -->">Men's Shop</a></li>
<li><a href="<!-- @path listing.html -->">Shirts & Tops</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="large-6 columns">
<span class="product-spotlight">
<img id="product-image-spotlight" style="width: 100%;" src="http://placehold.it/470x470/e7194b/fff&text=Red+1"/>
</span>
<div class="hide" id="product-option">
<img src="http://placehold.it/100x100/e7194b/fff&text=Red+1" data-largeimg="http://placehold.it/470x470/e7194b/fff&text=Red+1" data-product-option="Red" />
<img src="http://placehold.it/100x100/e7194b/fff&text=Red+2" data-largeimg="http://placehold.it/470x470/e7194b/fff&text=Red+2" data-product-option="Red" />
<img src="http://placehold.it/100x100/e7194b/fff&text=Red+3" data-largeimg="http://placehold.it/470x470/e7194b/fff&text=Red+3" data-product-option="Red" />
<img src="http://placehold.it/100x100/2f3042/fff&text=Navy+Blue+1" data-largeimg="http://placehold.it/470x470/2f3042/fff&text=Navy+Blue+1" data-product-option="Navy Blue" />
<img src="http://placehold.it/100x100/2f3042/fff&text=Navy+Blue+2" data-largeimg="http://placehold.it/470x470/2f3042/fff&text=Navy+Blue+2" data-product-option="Navy Blue" />
<img src="http://placehold.it/100x100/aed1a9/fff&text=Light+Green+1" data-largeimg="http://placehold.it/470x470/aed1a9/fff&text=Light+Green+1" data-product-option="Light Green" />
<img src="http://placehold.it/100x100/aed1a9/fff&text=Light+Green+2" data-largeimg="http://placehold.it/470x470/aed1a9/fff&text=Light+Green+2" data-product-option="Light Green" />
<img src="http://placehold.it/100x100/aed1a9/fff&text=Light+Green+3" data-largeimg="http://placehold.it/470x470/aed1a9/fff&text=Light+Green+3" data-product-option="Light Green" />
<img src="http://placehold.it/100x100/aed1a9/fff&text=Light+Green+4" data-largeimg="http://placehold.it/470x470/aed1a9/fff&text=Light+Green+4" data-product-option="Light Green" />
<img src="http://placehold.it/100x100/aed1a9/fff&text=Light+Green+5" data-largeimg="http://placehold.it/470x470/aed1a9/fff&text=Light+Green+5" data-product-option="Light Green" />
<img src="http://placehold.it/100x100/aed1a9/fff&text=Light+Green+6" data-largeimg="http://placehold.it/470x470/aed1a9/fff&text=Light+Green+6" data-product-option="Light Green" />
</div>
</div>
<div id="product-info" class="large-6 columns">
<h3 class="product-title">Chatham Chino Pants</h3>
<p>Style #: F540312</p>
<section class="product-description">
<p>Chatham Chino Company®...The pants that started it all... Our Cape Cod lifestyle brand signature item, Chatham Chinos combine hardworking, high-quality cotton with a comfortable fit and a salt-washed weathered look that emphasizes the clothing’s rugged Cape Cod heritage... Are you ready? </p>
<ul>
<li>Button/Zip fly closure</li>
<li>Belted waist</li>
<li>Flat front</li>
<li>100% Cotton</li>
<li>Machine wash</li>
<li>Style # P022</li></ul>
</section>
<section>
<h6>Color: <span>Red</span></h6>
<select id="modifiers_1" name="modifiers_1" class="hide">
<option value="1">Red</option>
<option value="2">Navy Blue</option>
<option value="3">Light Green</option>
</select>
<ul class="modifiers">
<li>
<a title="Red" href="#" data-option-name="Red" data-modifier-id="1" class="selected">
<span>Red</span>
</a>
</li>
<li>
<a title="Navy Blue" href="#" data-option-name="Navy Blue" data-modifier-id="2">
<span>Navy</span>
</a>
</li>
<li>
<a title="Light Green" href="#" data-option-name="Light Green" data-modifier-id="3">
<span>LtGreen</span>
</a>
</li>
</ul>
</section>
<section>
<h6>Size: <span>S</span></h6>
<input type="hidden" name="modifier_2" value="1" />
<select id="modifiers_1" name="modifier_2" class="hide">
<option value="1">S</option>
<option value="2">M</option>
<option value="3">L</option>
</select>
<ul class="modifiers">
<li>
<a title="S" data-option-name="S" href="#" data-modifier-id="1" class="selected">
<span>S</span>
</a>
</li>
<li>
<a title="M" data-option-name="M" href="#" data-modifier-id="2">
<span>M</span>
</a>
</li>
<li>
<a title="L" data-option-name="L" href="#" ata-modifier-id="3">
<span>L</span>
</a>
</li>
</ul>
</section>
<section class="price">
<h3>$79.00</h3>
</section>
<p>
<a href="#" class="primary-button" data-reveal-id="cart-confirm">Add To Cart</a>
</p>
</div>
</div>
</div>
<!-- @include _footer.html -->
<!-- @include _bottom.html -->