updating store

This commit is contained in:
Dave Gandy 2016-04-26 15:23:04 -04:00
parent f3da0dd9ab
commit c9072cf461
5 changed files with 280 additions and 83 deletions

File diff suppressed because one or more lines are too long

Binary file not shown.

View File

@ -1,3 +1,11 @@
// product vars
@shirt-kellygreen: #249265;
@shirt-black: #151010;
@shirt-royalblue: #2A4DB3;
@shirt-navy: #2E2737;
@shirt-silver: #D4D2D3;
@shirt-asphalt: #535059;
.content-underlay {
margin-bottom: -180px;
border-bottom: 1px solid @jumbotron-border;
@ -7,6 +15,8 @@
.product {
transition: box-shadow 0.25s ease-in-out, transform 0.25s ease-in-out;
transform: scale(0.99);
z-index: 2;
position: relative;
display: block;
@ -14,32 +24,62 @@
color: @text-color;
text-decoration: none;
background-color: #fff;
border-radius: @border-radius-base;
border-radius: @border-radius-small;
padding: @buffer-lg;
.box-shadow(0 4px 2px 0 rgba(127,127,127,.2));
&:hover, &:focus {
transform: scale(1.0);
.box-shadow(0 4px 2px 0 rgba(127,127,127,.4));
text-decoration: none;
color: @text-color;
.product-sizes {
opacity: 0.75;
}
&:hover {
.box-shadow(0 4px 2px 0 rgba(127,127,127,.6));
}
img { max-width: 100%; }
li {
color: @link-color;
&:hover, &:focus {
color: @link-hover-color;
text-decoration: underline;
}
padding: @buffer-sm;
}
li.active {
color: @text-muted;
cursor: default;
text-decoration: none;
}
.swatch {
display: inline-block;
width: 30px;
height: 30px;
&.swatch-kellygreen {
background-color: @shirt-kellygreen;
}
&.swatch-black {
background-color: @shirt-black;
}
&.swatch-navy {
background-color: @shirt-navy;
}
&.swatch-silver {
background-color: @shirt-silver;
}
&.swatch-asphalt {
background-color: @shirt-asphalt;
}
&.swatch-royalblue {
background-color: @shirt-royalblue;
}
}
}
.product-sizes {
transition: opacity 0.25s ease-in-out;
position: absolute;
top: 6px;
right: 6px;
@ -49,6 +89,27 @@
line-height: 21px;
padding: @buffer-sm @buffer-md;
color: @text-muted;
opacity: 0.25;
}
.product-title { height: 52px; }
.product-title {
height: 52px;
}
// calls-to-action
.product-cta {
display: block;
margin-top: @buffer-xl;
color: @text-color;
text-decoration: none;
border-radius: @border-radius-base;
padding: @buffer-lg;
}
.cta-content {
margin-bottom: @buffer-lg;
}
.cta-fine-print {
margin-top: @buffer-lg;
}

View File

@ -70,6 +70,7 @@ icons:
- night
- rating
- score
- favorite
categories:
- Web Application Icons
@ -83,6 +84,7 @@ icons:
- night
- rating
- score
- favorite
categories:
- Web Application Icons
@ -215,6 +217,9 @@ icons:
id: signal
unicode: f012
created: 1.0
filter:
- graph
- bars
categories:
- Web Application Icons
@ -394,6 +399,7 @@ icons:
- sound
- listen
- music
- audio
categories:
- Web Application Icons
@ -402,6 +408,7 @@ icons:
unicode: f026
created: 1.0
filter:
- audio
- mute
- sound
- music
@ -413,6 +420,7 @@ icons:
unicode: f027
created: 1.0
filter:
- audio
- lower
- quieter
- sound
@ -425,6 +433,7 @@ icons:
unicode: f028
created: 1.0
filter:
- audio
- higher
- louder
- sound
@ -704,6 +713,7 @@ icons:
filter:
- social
- send
- arrow
categories:
- Web Application Icons
@ -1122,6 +1132,7 @@ icons:
filter:
- eco
- nature
- plant
categories:
- Web Application Icons
@ -1387,6 +1398,7 @@ icons:
- message
- texting
- sms
- chat
categories:
- Web Application Icons
@ -1536,6 +1548,8 @@ icons:
id: lemon-o
unicode: f094
created: 1.0
filter:
- food
categories:
- Web Application Icons
@ -1710,6 +1724,7 @@ icons:
- right
- next
- forward
- finger
categories:
- Directional Icons
- Hand Icons
@ -1723,6 +1738,7 @@ icons:
- left
- previous
- back
- finger
categories:
- Directional Icons
- Hand Icons
@ -1733,6 +1749,7 @@ icons:
created: 2.0
filter:
- point
- finger
categories:
- Directional Icons
- Hand Icons
@ -1743,6 +1760,7 @@ icons:
created: 2.0
filter:
- point
- finger
categories:
- Directional Icons
- Hand Icons
@ -1865,6 +1883,7 @@ icons:
- move
- reorder
- resize
- arrow
categories:
- Video Player Icons
- Directional Icons
@ -1930,6 +1949,8 @@ icons:
created: 2.0
filter:
- duplicate
- clone
- copy
aliases:
- copy
categories:
@ -2117,6 +2138,7 @@ icons:
- dropdown
- menu
- triangle down
- arrow
categories:
- Directional Icons
@ -2126,6 +2148,7 @@ icons:
created: 2.0
filter:
- triangle up
- arrow
categories:
- Directional Icons
@ -2137,6 +2160,7 @@ icons:
- previous
- back
- triangle left
- arrow
categories:
- Directional Icons
@ -2148,6 +2172,7 @@ icons:
- next
- forward
- triangle right
- arrow
categories:
- Directional Icons
@ -2180,6 +2205,7 @@ icons:
- dropdown
- more
- menu
- arrow
aliases:
- sort-down
categories:
@ -2191,6 +2217,8 @@ icons:
created: 2.0
aliases:
- sort-up
filter:
- arrow
categories:
- Web Application Icons
@ -2281,6 +2309,7 @@ icons:
- message
- texting
- sms
- chat
categories:
- Web Application Icons
@ -2477,6 +2506,7 @@ icons:
unicode: f0f9
created: 3.0
filter:
- vehicle
- support
- help
categories:
@ -2559,6 +2589,7 @@ icons:
- quote
- previous
- back
- arrows
categories:
- Directional Icons
@ -2571,6 +2602,7 @@ icons:
- quote
- next
- forward
- arrows
categories:
- Directional Icons
@ -2578,6 +2610,8 @@ icons:
id: angle-double-up
unicode: f102
created: 3.0
filter:
- arrows
categories:
- Directional Icons
@ -2585,6 +2619,8 @@ icons:
id: angle-double-down
unicode: f103
created: 3.0
filter:
- arrows
categories:
- Directional Icons
@ -2595,6 +2631,7 @@ icons:
filter:
- previous
- back
- arrow
categories:
- Directional Icons
@ -2605,6 +2642,7 @@ icons:
filter:
- next
- forward
- arrow
categories:
- Directional Icons
@ -2612,6 +2650,8 @@ icons:
id: angle-up
unicode: f106
created: 3.0
filter:
- arrow
categories:
- Directional Icons
@ -2619,6 +2659,8 @@ icons:
id: angle-down
unicode: f107
created: 3.0
filter:
- arrow
categories:
- Directional Icons
@ -2756,6 +2798,7 @@ icons:
unicode: f118
created: 3.1
filter:
- face
- emoticon
- happy
- approve
@ -2769,6 +2812,7 @@ icons:
unicode: f119
created: 3.1
filter:
- face
- emoticon
- sad
- disapprove
@ -2781,6 +2825,7 @@ icons:
unicode: f11a
created: 3.1
filter:
- face
- emoticon
- rating
- neutral
@ -2979,6 +3024,9 @@ icons:
id: eraser
unicode: f12d
created: 3.1
filter:
- remove
- delete
categories:
- Text Editor Icons
- Web Application Icons
@ -3072,6 +3120,7 @@ icons:
filter:
- previous
- back
- arrow
categories:
- Directional Icons
@ -3082,6 +3131,7 @@ icons:
filter:
- next
- forward
- arrow
categories:
- Directional Icons
@ -3089,6 +3139,8 @@ icons:
id: chevron-circle-up
unicode: f139
created: 3.1
filter:
- arrow
categories:
- Directional Icons
@ -3100,6 +3152,7 @@ icons:
- more
- dropdown
- menu
- arrow
categories:
- Directional Icons
@ -3239,6 +3292,8 @@ icons:
id: level-up
unicode: f148
created: 3.1
filter:
- arrow
categories:
- Web Application Icons
@ -3246,6 +3301,8 @@ icons:
id: level-down
unicode: f149
created: 3.1
filter:
- arrow
categories:
- Web Application Icons
@ -3670,6 +3727,7 @@ icons:
created: 3.2
filter:
- osx
- food
categories:
- Brand Icons
@ -3686,6 +3744,8 @@ icons:
id: android
unicode: f17b
created: 3.2
filter:
- robot
categories:
- Brand Icons
@ -3955,6 +4015,10 @@ icons:
id: slack
unicode: f198
created: 4.1
filter:
- hashtag
- anchor
- hash
categories:
- Brand Icons
@ -4487,6 +4551,8 @@ icons:
id: sliders
unicode: f1de
created: 4.1
filter:
- settings
categories:
- Web Application Icons
@ -4542,6 +4608,9 @@ icons:
id: plug
unicode: f1e6
created: 4.2
filter:
- power
- connect
categories:
- Web Application Icons
@ -5221,6 +5290,8 @@ icons:
created: 4.4
aliases:
- battery-4
filter:
- power
categories:
- Web Application Icons
@ -5230,6 +5301,8 @@ icons:
created: 4.4
aliases:
- battery-3
filter:
- power
categories:
- Web Application Icons
@ -5239,6 +5312,8 @@ icons:
created: 4.4
aliases:
- battery-2
filter:
- power
categories:
- Web Application Icons
@ -5248,6 +5323,8 @@ icons:
created: 4.4
aliases:
- battery-1
filter:
- power
categories:
- Web Application Icons
@ -5257,6 +5334,8 @@ icons:
created: 4.4
aliases:
- battery-0
filter:
- power
categories:
- Web Application Icons
@ -5392,6 +5471,8 @@ icons:
created: 4.4
aliases:
- hand-stop-o
filter:
- stop
categories:
- Web Application Icons
- Hand Icons
@ -5559,6 +5640,10 @@ icons:
created: 4.4
aliases:
- tv
filter:
- display
- computer
- monitor
categories:
- Web Application Icons
@ -5886,6 +5971,8 @@ icons:
unicode: f299
created: 4.6
url: enviragallery.com
filter:
- leaf
categories:
- Brand Icons

View File

@ -180,7 +180,7 @@
<h1><i class="fa fa-shopping-cart fa-lg valign-baseline" aria-hidden="true"></i>&nbsp; Awesome Swag</h1>
<p>Support Font Awesome with some official merchandise!</p>
<p>Show your love &amp; support of Font Awesome with official merchandise!</p>
</div>
@ -194,7 +194,8 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Father-T-shirt-Small-Kelly-Green/dp/B01ELXTKW0">
<div class="product-sizes">
<i class="fa fa-male"></i>
<span class="sr-only">Available in the following sizes: </span>
<i class="fa fa-male" title="Men"></i>
</div>
<div class="tab-content">
<div class="tab-pane active" id="father-kelly-green">
@ -205,16 +206,16 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#father-kelly-green" data-toggle="tab">Kelly Green</span></li>
<li><span data-target="#father-navy" data-toggle="tab">Navy</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#father-kelly-green" data-toggle="tab"><span class="swatch swatch-kellygreen" title="Kelly Green"></span> <span class="sr-only"> Kelly Green</span></span></li>
<li><span data-target="#father-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">
<h3 class="gg-col product-title">Fa-ther Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Fa-ther 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
@ -225,9 +226,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Space-Shuttle-T-shirt-Small-Black/dp/B01ELRXO14">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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">
@ -238,16 +240,16 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#shuttle-black" data-toggle="tab">Black</span></li>
<li><span data-target="#shuttle-navy" data-toggle="tab">Navy</span></li>
<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">
<h3 class="gg-col product-title">Space Shuttle Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<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
@ -258,9 +260,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Paper-Scissors-Lizard-Spock-T-shirt/dp/B01ELX6N7U">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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="rpsls-blue">
@ -268,15 +271,15 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#rpsls-blue" data-toggle="tab">Royal Blue</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#rpsls-blue" data-toggle="tab"><span class="swatch swatch-royalblue" title="Royal Blue"></span><span class="sr-only"> Royal Blue</span></span></li>
</ul>
<hr />
<div class="gg margin-bottom">
<h3 class="gg-col product-title">Rock Paper Scissors Lizard Spock Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Rock Paper Scissors Lizard Spock 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
@ -287,9 +290,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Mens-Schmancy-White-T-shirt-Small/dp/B01ELYG428">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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="white-logo-kelly-green">
@ -303,17 +307,17 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#white-logo-kelly-green" data-toggle="tab">Kelly Green</span></li>
<li><span data-target="#white-logo-navy" data-toggle="tab">Navy</span></li>
<li><span data-target="#white-logo-silver" data-toggle="tab">Silver</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#white-logo-kelly-green" data-toggle="tab"><span class="swatch swatch-kellygreen" title="Kelly Green"></span> <span class="sr-only"> Kelly Green</span></span></li>
<li><span data-target="#white-logo-navy" data-toggle="tab"><span class="swatch swatch-navy" title="Navy"></span><span class="sr-only"> Navy</span></span></li>
<li><span data-target="#white-logo-silver" data-toggle="tab"><span class="swatch swatch-silver" title="Silver"></span><span class="sr-only"> Silver</span></span></li>
</ul>
<hr />
<div class="gg margin-bottom">
<h3 class="gg-col product-title">White Logo Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0">White Logo 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
@ -324,9 +328,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Camera-Retro-T-shirt-Small-Asphalt/dp/B01ELWGV14">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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="camera-asphalt">
@ -337,16 +342,16 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#camera-asphalt" data-toggle="tab">Asphalt</span></li>
<li><span data-target="#camera-kelly-green" data-toggle="tab">Kelly Green</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#camera-asphalt" data-toggle="tab"><span class="swatch swatch-asphalt" title="Asphalt"></span><span class="sr-only"> Asphalt</span></span></li>
<li><span data-target="#camera-kelly-green" data-toggle="tab"><span class="swatch swatch-kellygreen" title="Kelly Green"></span> <span class="sr-only"> Kelly Green</span></span></li>
</ul>
<hr />
<div class="gg margin-bottom">
<h3 class="gg-col product-title">Camera Retro Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Camera Retro 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
@ -357,9 +362,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Mens-Skool-T-shirt-Small-Navy/dp/B01ELWVHJ0">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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="old-skool-kelly-green">
@ -370,16 +376,16 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#old-skool-kelly-green" data-toggle="tab">Kelly Green</span></li>
<li><span data-target="#old-skool-navy" data-toggle="tab">Navy</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#old-skool-kelly-green" data-toggle="tab"><span class="swatch swatch-kellygreen" title="Kelly Green"></span> <span class="sr-only"> Kelly Green</span></span></li>
<li><span data-target="#old-skool-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">
<h3 class="gg-col product-title">Old Skool Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Old Skool 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
@ -390,9 +396,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Mens-Classics-T-shirt-Small-Navy/dp/B01ELY5MT4">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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="classics-kelly-green">
@ -403,16 +410,16 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#classics-kelly-green" data-toggle="tab">Kelly Green</span></li>
<li><span data-target="#classics-navy" data-toggle="tab">Navy</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#classics-kelly-green" data-toggle="tab"><span class="swatch swatch-kellygreen" title="Kelly Green"></span> <span class="sr-only"> Kelly Green</span></span></li>
<li><span data-target="#classics-navy" data-toggle="tab"><span class="swatch swatch-navy"></span><span class="sr-only" title="Navy"> Navy</span></span></li>
</ul>
<hr />
<div class="gg margin-bottom">
<h3 class="gg-col product-title">Classics Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Classics 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
@ -423,9 +430,10 @@
<div class="col-sm-6 col-lg-4">
<a class="product" href="http://www.amazon.com/Mens-Schmancy-Green-Small-Black/dp/B01ELYOYY8">
<div class="product-sizes">
<i class="fa fa-male"></i>
<i class="fa fa-female"></i>
<i class="fa fa-child"></i>
<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="green-logo-black">
@ -436,16 +444,16 @@
</div>
</div>
<ul class="list-inline text-center margin-bottom-lg">
<li class="active"><span data-target="#green-logo-black" data-toggle="tab">Black</span></li>
<li><span data-target="#green-logo-kelly-green" data-toggle="tab">Kelly Green</span></li>
<ul class="list-inline text-center margin-bottom-0">
<li class="active"><span data-target="#green-logo-black" data-toggle="tab"><span class="swatch swatch-navy" title="Navy"></span><span class="sr-only"> Navy</span></span></li>
<li><span data-target="#green-logo-kelly-green" data-toggle="tab"><span class="swatch swatch-kellygreen" title="Kelly Green"></span> <span class="sr-only"> Kelly Green</span></span></li>
</ul>
<hr />
<div class="gg margin-bottom">
<h3 class="gg-col product-title">Green Logo Tee</h3>
<h3 class="gg-col text-right text-success">$28</h3>
<div class="gg margin-bottom-sm">
<h3 class="gg-col product-title margin-top-0 margin-bottom-0 padding-right-sm">Green Logo 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
@ -453,6 +461,47 @@
</a>
</div>
<div class="col-sm-12 col-lg-4">
<div class="product-cta">
<h3 class="cta-title">Have Ideas or Requests?</h3>
<div class="cta-content">
<p>
Got a great idea for a Font Awesome goodie or shirt? Don't see your favorite icon in a wear-able or share-able format?
</p>
<p>
We're all ears! Spend a few minutes and let us know what you'd want. If we end up using your idea, we'll send you a free copy.
</p>
</div>
<a class="btn btn-success btn-block btn-lg" href="mailto:suggestions@fortawesome.com?subject=I have a store idea!">Make a Store Suggestion!</a>
<p class="text-muted cta-fine-print">
Please note: While we appreciate all suggestions, not every idea might be right for Font Awesome nor could we physically make every idea.
</p>
</div>
</div>
</div>
<hr>
<div class="row">
<div class="col-sm-12 col-md-6">
<h4>About Font Awesome Products</h4>
<p>
There might be times where you want to insert a bit of Font Awesome in the real world. That's why we're trying out some schwag. We hope you enjoy our icons and their fun spirit out in the wild and appreciate the support you're showing and giving by doing so. <strong>You're putting the Awesome in Font Awesome!</strong>
</p>
</div>
<div class="col-sm-12 col-md-6">
<h4>Shipping, Tracking, &amp; Refunding Orders</h4>
<p>
All of our products are managed through <a href="http://www.amazon.com/s/ref=w_bl_sl_s_ap_web_7141123011?ie=UTF8&node=7141123011&field-brandtextbin=Font+Awesome"><i class="fas fas-amazon"></i> Amazon</a>. Shipping rates and schedules are managed through their storefront. You'll be able to track your placed orders and contact Amazon's responsive support about refunds, issues, or questions. Ratings and feedback are always welcome either on the product page or <a href="mailto:suggestions@fortawesome.com">directly to us</a>.
</p>
</div>
</div>
</div>