Merge pull request #153 from gskema/dev

[*] CSS: Various CSS improvements
PrestaShop · Mar 7, 2016 · f7ee45b · f7ee45b
2 parents debc008 + b37b68c
commit f7ee45b
Show file tree

Hide file tree

Showing 10 changed files with 28 additions and 71 deletions.
diff --git a/themes/community-theme-16/js/global.js b/themes/community-theme-16/js/global.js
@@ -229,7 +229,7 @@ function display(view) {
       html += '<div class="left-block col-xs-4 col-sm-5 col-md-4">' + $(element).find('.left-block').html() + '</div>';
       html += '<div class="center-block col-xs-4 col-sm-7 col-md-4">';
       html += '<div class="product-flags">' + $(element).find('.product-flags').html() + '</div>';
-      html += '<h4 itemprop="name">' + $(element).find('h4').html() + '</h4>';
+      html += '<h5 itemprop="name">' + $(element).find('h5').html() + '</h5>';
       var hookReviews = $(element).find('.hook-reviews');
       if (hookReviews.length) {
         html += hookReviews.clone().wrap('<div>').parent().html();
@@ -267,7 +267,7 @@ function display(view) {
       html += '<div class="left-block">' + $(element).find('.left-block').html() + '</div>';
       html += '<div class="right-block">';
       html += '<div class="product-flags">' + $(element).find('.product-flags').html() + '</div>';
-      html += '<h4 itemprop="name">' + $(element).find('h4').html() + '</h4>';
+      html += '<h5 itemprop="name">' + $(element).find('h5').html() + '</h5>';
       var hookReviews = $(element).find('.hook-reviews');
       if (hookReviews.length) {
         html += hookReviews.clone().wrap('<div>').parent().html();

diff --git a/themes/community-theme-16/js/modules/blocklayered/blocklayered.js b/themes/community-theme-16/js/modules/blocklayered/blocklayered.js
@@ -1,7 +1,6 @@
 /* global param_product_url */
 
 var ajaxQueries = [];
-var ajaxLoaderOn = 0;
 var sliderList = [];
 var slidersInit = false;
 
@@ -365,10 +364,8 @@ function reloadContent(params_plus) {
 
   stopAjaxQuery();
 
-  if (!ajaxLoaderOn) {
-    $('.product_list').css('opacity', '0.7').prepend($('#layered_ajax_loader').html());
-    ajaxLoaderOn = 1;
-  }
+  $form.addClass('loading-overlay');
+  $('.product_list').css('opacity', '0.5');
 
   var data = $form.serialize();
   $('.layered_slider').each(function() {
@@ -471,14 +468,11 @@ function reloadContent(params_plus) {
       if (result.productList) {
         $('.product_list').replaceWith(utf8_decode(result.productList));
       } else {
-        $('.product_list').html('');
+        $('.product_list').html('').css('opacity', '1');
+        $.browser.msie && $('.product_list').css('filter', '');
       }
 
-      $('.product_list').css('opacity', '1');
-      if ($.browser.msie)  {
-        // Fix bug with IE8 and aliasing
-        $('.product_list').css('filter', '');
-      }
+      $form.removeClass('loading-overlay');
 
       if (result.pagination.search(/[^\s]/) >= 0) {
         var pagination = $('<div/>').html(result.pagination);
@@ -631,7 +625,7 @@ function updateProductUrl() {
   // Adding the filters to URL product
   if (typeof(param_product_url) != 'undefined' && param_product_url != '' && param_product_url != '#') {
     $.each($('ul.product_list li.ajax_block_product .product_img_link,' +
-      'ul.product_list li.ajax_block_product h4 a,' +
+      'ul.product_list li.ajax_block_product h5 a,' +
       'ul.product_list li.ajax_block_product .product_desc a,' +
       'ul.product_list li.ajax_block_product .lnk_view'), function() {
       $(this).attr('href', $(this).attr('href') + param_product_url);

diff --git a/themes/community-theme-16/product-list.tpl b/themes/community-theme-16/product-list.tpl
@@ -68,12 +68,12 @@
             {hook h="displayProductPriceBlock" product=$product type="weight"}
           </div>
           <div class="right-block">
-            <h4 itemprop="name">
+            <h5 class="h4" itemprop="name">
               {if isset($product.pack_quantity) && $product.pack_quantity}{$product.pack_quantity|intval|cat:' x '}{/if}
               <a class="product-name" href="{$product.link|escape:'html':'UTF-8'}" title="{$product.name|escape:'html':'UTF-8'}" itemprop="url" >
                 {$product.name|truncate:45:'...'|escape:'html':'UTF-8'}
               </a>
-            </h4>
+            </h5>
             {capture name='displayProductListReviews'}{hook h='displayProductListReviews' product=$product}{/capture}
             {if $smarty.capture.displayProductListReviews}
               <div class="hook-reviews">

diff --git a/themes/community-theme-16/product.tpl b/themes/community-theme-16/product.tpl
@@ -348,7 +348,7 @@
               <div class="box-cart-bottom">
                 <div{if (!$allow_oosp && $product->quantity <= 0) || !$product->available_for_order || (isset($restricted_country_mode) && $restricted_country_mode) || $PS_CATALOG_MODE} class="unvisible"{/if}>
                   <p id="add_to_cart" class="buttons_bottom_block no-print">
-                    <button type="submit" name="Submit" class="btn btn-lg btn-success btn-add-to-cart">
+                    <button type="submit" name="Submit" class="btn btn-block btn-lg btn-success btn-add-to-cart">
                       <i class="icon icon-cart-plus"></i>
                       <span>{if $content_only && (isset($product->customization_required) && $product->customization_required)}{l s='Customize'}{else}{l s='Add to cart'}{/if}</span>
                     </button>

diff --git a/themes/community-theme-16/sass/partials/_headings.scss b/themes/community-theme-16/sass/partials/_headings.scss
@@ -10,6 +10,10 @@
     font-size: $font-size-base;
     line-height: ($font-size-h1 * $headings-line-height);
     float: right;
+    @media (max-width: $screen-xs-max) {
+      float: none;
+      display: block;
+    }
   }
 
   span.lighter {

diff --git a/themes/community-theme-16/sass/partials/_page.scss b/themes/community-theme-16/sass/partials/_page.scss
@@ -4,6 +4,9 @@ $page-content-bg: #fff;
 
 body {
   background-color: $page-body-bg;
+  &.content_only {
+    background-color: $page-content-bg;
+  }
 }
 
 #header-blocks {

diff --git a/themes/community-theme-16/sass/partials/pages/checkout/_cart_steps.scss b/themes/community-theme-16/sass/partials/pages/checkout/_cart_steps.scss
@@ -1,11 +1,7 @@
-//CART steps
+// CART steps
 ul.step {
   margin-bottom: 30px;
   overflow: hidden;
-  //min 480px
-  @media (min-width: $screen-sm) {
-    @include border-radius(4px);
-  }
   li {
     float: left;
     width: 20%;
@@ -14,7 +10,7 @@ ul.step {
     border-top-color: #cacaca;
     border-bottom-color: #9a9a9a;
     border-right-color: #b7b7b7;
-    border-left-width: 0px;
+    border-left-width: 0;
     // max 480px
     @media (max-width: $screen-sm - 1) {
       width: 100%;
@@ -55,22 +51,11 @@ ul.step {
       }
     }
     &.first {
-      border-left-width: 1px;
-      border-left-color: #b7b7b7;
-      //min 480px
-      @media (min-width: $screen-sm) {
-        @include border-top-left-radius(4px);
-        @include border-bottom-left-radius(4px);
-      }
+      border-left: 1px solid #b7b7b7;
       span,
       a {
         z-index: 5;
         padding-left: 13px !important;
-        //min 480px
-        @media (min-width: $screen-sm) {
-          @include border-top-left-radius(4px);
-          @include border-bottom-left-radius(4px);
-        }
       }
     }
     &.second {
@@ -92,20 +77,10 @@ ul.step {
       span {
         z-index: 1;
       }
-      //min 480px
-      @media (min-width: $screen-sm) {
-        @include border-top-right-radius(4px);
-        @include border-bottom-right-radius(4px);
-        span {
-          @include border-top-right-radius(4px);
-          @include border-bottom-right-radius(4px);
-        }
-      }
     }
     &.step_current {
       font-weight: bold;
       background: rgb(66, 184, 86);
-      @include gradient-vertical(rgba(66, 184, 86, 1), rgba(67, 171, 84, 1));
       border-color: #399b49 #51ae5c #208931 #369946;
       span {
         color: #fff;
@@ -115,9 +90,6 @@ ul.step {
         //min 991px
         @media (min-width: $screen-md) {
           padding-left: 38px;
-          &:after {
-            background: url(../img/order-step-a.png) right 0 no-repeat;
-          }
         }
       }
     }
@@ -126,42 +98,25 @@ ul.step {
     }
     &.step_todo {
       background: rgb(247, 247, 247);
-      @include gradient-vertical(rgba(247, 247, 247, 1), rgba(237, 237, 237, 1));
       span {
         display: block;
-        border: 1px solid;
-        border-color: #fff;
+        border: 1px solid #fff;
         position: relative;
         // min 991px
         @media (min-width: $screen-md) {
           padding-left: 38px;
-          &:after {
-            background: url(../img/order-step-current.png) right 0 no-repeat;
-          }
         }
       }
     }
     &.step_done {
       border-color: #666666 #5f5f5f #292929 #5f5f5f;
       background: rgb(114, 113, 113);
-      @include gradient-vertical(rgba(114, 113, 113, 1), rgba(102, 102, 102, 1));
       a {
         color: #fff;
-        border: 1px solid;
-        border-color: #8b8a8a;
+        border: 1px solid #8b8a8a;
         // min 991px
         @media (min-width: $screen-md) {
           padding-left: 38px;
-          &:after {
-            background: url(../img/order-step-done.png) right 0 no-repeat;
-          }
-        }
-      }
-    }
-    &.step_done.step_done_last {
-      @media (min-width: $screen-md) {
-        a:after {
-          background: url(../img/order-step-done-last.png) right 0 no-repeat;
         }
       }
     }

diff --git a/themes/community-theme-16/sass/product_list.scss b/themes/community-theme-16/sass/product_list.scss
@@ -243,7 +243,7 @@ ul.product_list.grid {
           }
         }
       }
-      h4 {
+      h5 {
         padding: 0 15px 7px 15px;
         min-height: 60px;
       }
@@ -323,7 +323,7 @@ ul.product_list.grid {
     }
   }
   li.hovered{
-    h4 {
+    h5 {
       min-height: 30px;
     }
   }
@@ -365,7 +365,7 @@ ul.product_list.list {
         color: #f13340;
       }
     }
-    h4 {
+    h5 {
       padding-bottom: 8px;
     }
     .product-desc {

diff --git a/themes/community-theme-16/sass/sitemap.scss b/themes/community-theme-16/sass/sitemap.scss
@@ -9,6 +9,7 @@
   > ul {
     padding-left: 0;
     list-style: none;
+    margin: 0;
   }
   ul ul {
     padding-left: 2em;

diff --git a/themes/community-theme-16/sitemap.tpl b/themes/community-theme-16/sitemap.tpl
@@ -54,7 +54,7 @@
       {*<div class="tree_top">
         <a href="{$base_dir_ssl}" title="{$categoriesTree.name|escape:'html':'UTF-8'}"><i class="icon icon-home"></i></a>
       </div>*}
-      <ul class="tree">
+      <ul>
         {if !empty($categoriesTree.children)}
           {foreach $categoriesTree.children as $child}
             {include file="$tpl_dir./category-tree-branch.tpl" node=$child}