make product title wider if it is long

2 files changed, 6 insertions, 0 deletions

diff --git a/StoneIsland/www/css/products.css b/StoneIsland/www/css/products.css
index 664ff45b..2256d662 100755
--- a/StoneIsland/www/css/products.css
+++ b/StoneIsland/www/css/products.css
@@ -104,6 +104,9 @@
   position:relative;
   font-weight:bold;
 }
+.product .product-header.wide {
+  max-width:100%;
+}
 
 #product::before {
   content:'';
diff --git a/StoneIsland/www/js/lib/products/ProductView.js b/StoneIsland/www/js/lib/products/ProductView.js
index 1c05c629..a261218d 100755
--- a/StoneIsland/www/js/lib/products/ProductView.js
+++ b/StoneIsland/www/js/lib/products/ProductView.js
@@ -16,6 +16,7 @@ var ProductView = ScrollableView.extend({
     this.gallery = new GalleryView ()
     this.scroller = new IScroll('#product', app.iscroll_options)
     
+    this.$productHeader = this.$(".product-header")
     this.$num = this.$(".num")
     this.$title = this.$(".title")
     this.$type = this.$(".type")
@@ -169,6 +170,8 @@ var ProductView = ScrollableView.extend({
     this.$type.html(type)
     this.$price.html(price)
     this.$body.html(body)
+    
+    this.$productHeader.toggleClass("wide", title.length > 30)
 
     var fits_large = !! this.fitLargeCodes[this.code]
     app.product.$fit.toggle( fits_large )