css product/hub edits

4 files changed, 87 insertions, 49 deletions

diff --git a/StoneIsland/www/css/blogs.css b/StoneIsland/www/css/blogs.css
index 52dd73c1..c8a04a1c 100644
--- a/StoneIsland/www/css/blogs.css
+++ b/StoneIsland/www/css/blogs.css
@@ -59,6 +59,10 @@
   margin:10px auto 20px;
 }
 
+#content .content .body:last-child {
+  margin:10px auto 100px;
+}
+
 .content-header {
   width:calc(100vw - 40px);
   box-sizing:border-box;
@@ -102,7 +106,7 @@
   left:20px;
   content:'\25C0';
   font-size:18px;
-  padding:6px 14px;
+  padding:3px 14px 3px 11px;
   z-index:999;
   position:absolute;
   display:block;
@@ -117,7 +121,7 @@
   right:20px;
   content:'\25B6';
   font-size:18px;
-  padding:6px 14px;
+  padding:3px 11px 3px 14px;
   z-index:999;
   position:absolute;
   display:block;
diff --git a/StoneIsland/www/css/nav.css b/StoneIsland/www/css/nav.css
index b5fbec93..eb5451bc 100644
--- a/StoneIsland/www/css/nav.css
+++ b/StoneIsland/www/css/nav.css
@@ -202,7 +202,7 @@ padding-bottom:0px;
   display: inline-block;
   float: right;
   width: 18px;
-  top:14px;
+  top: 15px;
   height: 18px;
   margin-right:18px;
   border: 1px solid #a9a9a9;
diff --git a/StoneIsland/www/css/products.css b/StoneIsland/www/css/products.css
index 163c470c..9411acc2 100644
--- a/StoneIsland/www/css/products.css
+++ b/StoneIsland/www/css/products.css
@@ -31,12 +31,12 @@
 
 .gallery {
   width: 100vw;
-  height: 63vw;
+  height: 52vh;
 }
 
 .gallery .item {
   width: 100vw;
-  height: 63vw;
+  height: 52vh;
   background-size: contain;
   background-position: center center;
   background-repeat: no-repeat;
@@ -67,83 +67,84 @@
 
 .product .content {
   box-sizing:border-box;
-  width:calc(100vw - 40px);
+  width:calc(100vw - 50px);
   position:relative;
   margin:0 auto 40px;
   padding:0;
 }
 
-.product .content h2 {
-  font-size:15px;
-  margin:15px 0 0px;
-
+.product .product-header {
+  font-size:13px;
+  margin:18px 0 0;
   max-width:60%;
-  position:relative
+  position:relative;
+  font-weight:bold;
 }
 
 #product::before {
-content:'';
-width:100%;
+  content:'';
+  width:100%;
   background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
-height:40px;
-z-index:2;
-position:absolute;
-bottom:0px;
-left:0
+  height:40px;
+  z-index:2;
+  position:absolute;
+  bottom:0px;
+  left:0
 }
 
 .product .style {
-padding:4px 9px;
-border:1px solid black;
-float:left
+  padding:4px 9px;
+  border:1px solid black;
+  float:left
 }
 
 .product .share {
-float:right;
-padding:4px 9px;
-border:1px solid black;
+  float:right;
+  padding:4px 9px;
+  border:1px solid black;
 }
 
 .product .type {
-display:table-cell;
-font-size:12px;
+  display:table-cell;
+  font-size:13px;
 }
 
 .product .size {
-padding-right:16px;
-position:relative
+  padding-right:16px;
+  position:relative
 }
 
 .product .price {
-display:table-cell;
-font-size:14px;
-text-align:right
+  display:table-cell;
+  font-size:14px;
+  text-align:right;
+  vertical-align:bottom
 }
 
 .product .price, .product .type {
-font-weight:bold;
-margin:0;
-padding:10px 0;
+  font-weight:bold;
+  margin:0;
+  padding: 0 0 7px;
 }
 
 .type-price {
-display:table;
-position:relative;
-width:100%
+  display:table;
+  position:relative;
+  width:100%
 }
 
 .style-share {
-letter-spacing:0.5px;
+  letter-spacing:0.5px;
 }
 
 .size-color {
-position:relative
+  position:relative
 }
 
 .type-price, .style-share {
-clear:both;
-position:relative;
-box-sizing:border-box
+  clear:both;
+  position:relative;
+  box-sizing:border-box
 }
 
 
@@ -161,11 +162,41 @@ box-sizing:border-box
 
 
 .product .fit {
-clear:both;
-font-size:10px;
-letter-spacing:0.5px;
-text-decoration:underline;
-text-transform:uppercase;
-padding:12px 0 4px;
+  clear:both;
+  font-size:9px;
+  letter-spacing:0.5px;
+  text-decoration:underline;
+  text-transform:uppercase;
+  padding:12px 0 2px;
+}
+
+#product #gallery::before {
+  border:1px solid black;
+  top:50%;
+  transform:scale(.5,1) translateY(-50%);
+  transform-origin:top left;
+  left:20px;
+  content:'\25C0';
+  font-size:18px;
+  padding:3px 14px 3px 11px;
+  z-index:999;
+  position:absolute;
+  display:block;
+  background:rgba(255,255,255,1);
+}
+
+#product #gallery::after {
+  border:1px solid black;
+  top:50%;
+  transform:scale(.5,1) translateY(-50%);
+  transform-origin:top right;
+  right:20px;
+  content:'\25B6';
+  font-size:18px;
+  padding:3px 11px 3px 14px;
+  z-index:999;
+  position:absolute;
+  display:block;
+  background:rgba(255,255,255,1);
 }
 
diff --git a/StoneIsland/www/index.html b/StoneIsland/www/index.html
index 0b79c15d..17b5c14d 100644
--- a/StoneIsland/www/index.html
+++ b/StoneIsland/www/index.html
@@ -241,7 +241,10 @@
         </script>
       </div>
       <div class="content">
-        <h2><b class="num"></b><span class="title"></h2>
+        <div class="product-header">
+        <span class="num"></span>
+        <span class="title"></span>
+        </div>
         <div class="type-price">
           <span class="type"></span>
           <span class="price"></span>