mirror of
https://github.com/ForkAwesome/Fork-Awesome
synced 2024-06-28 10:10:36 +02:00
66136a0606
* adding suggestion-based call-to-action * adding a11y-friendly labels * adding product-based transitions * adding extra padding to colorway controls * converting color toggles to visual swatches * adding titles to sizes * copy updates
32 lines
1.4 KiB
HTML
32 lines
1.4 KiB
HTML
<a class="product" href="http://www.amazon.com/Space-Shuttle-T-shirt-Small-Black/dp/B01ELRXO14">
|
|
<div class="product-sizes">
|
|
<span class="sr-only">Available in the following sizes: </span>
|
|
<i class="fa fa-male" title="Men"></i>
|
|
<i class="fa fa-female" title="Women"></i>
|
|
<i class="fa fa-child" title="Kids"></i>
|
|
</div>
|
|
<div class="tab-content">
|
|
<div class="tab-pane active" id="shuttle-black">
|
|
<img src="http://ecx.images-amazon.com/images/I/71e4BRlSOML._UX679_.jpg">
|
|
</div>
|
|
<div class="tab-pane" id="shuttle-navy">
|
|
<img src="http://ecx.images-amazon.com/images/I/81U%2BSAV23IL._UX679_.jpg">
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="list-inline text-center margin-bottom-0">
|
|
<li class="active"><span data-target="#shuttle-black" data-toggle="tab"><span class="swatch swatch-black" title="Black"></span><span class="sr-only"> Black</span></span></li>
|
|
<li><span data-target="#shuttle-navy" data-toggle="tab"><span class="swatch swatch-navy" title="Navy"></span><span class="sr-only"> Navy</span></span></li>
|
|
</ul>
|
|
|
|
<hr />
|
|
|
|
<div class="gg margin-bottom-sm">
|
|
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Space Shuttle Tee</h3>
|
|
<h3 class="gg-col text-right text-success margin-top-0 margin-bottom-0">$28</h3>
|
|
</div>
|
|
<div class="text-muted">
|
|
American Apparel Fine Jersey Short Sleeve T-Shirt
|
|
</div>
|
|
</a>
|