shop-better

@@ -55,6 +55,7 @@ class AbstractAction extends Controller_Abstract
         $this->_request = $this->getRequest();
         $this->_request = $this->getRequest();
 
 
         $this->_view->assign('isWechat', stripos($this->server('HTTP_USER_AGENT', ''), 'MicroMessenger') !== false);
         $this->_view->assign('isWechat', stripos($this->server('HTTP_USER_AGENT', ''), 'MicroMessenger') !== false);
+        $this->_view->assign('isApp', isset($_GET['app_version']) ? true : false);
 
 
         // 设置环境变量
         // 设置环境变量
         switch (APPLICATION_ENV) {
         switch (APPLICATION_ENV) {

@@ -130,7 +130,7 @@ function postcssEnvPlugin(env) {
 
 
 //Postcss开发环境
 //Postcss开发环境
 gulp.task('postcss-dev', function() {
 gulp.task('postcss-dev', function() {
-    return gulp.src('sass/index.css')
+    return gulp.src(['sass/index.css', 'sass/shop.css'])
         .pipe(sourcemaps.init())
         .pipe(sourcemaps.init())
         .pipe(postcss(postcssEnvPlugin('DEV')))
         .pipe(postcss(postcssEnvPlugin('DEV')))
         .pipe(sourcemaps.write('.'))
         .pipe(sourcemaps.write('.'))
@@ -143,7 +143,7 @@ gulp.task('postcss-watch', function() {
 
 
 //Postcss正式环境生成
 //Postcss正式环境生成
 gulp.task('postcss-pro', ['assets'], function() {
 gulp.task('postcss-pro', ['assets'], function() {
-    return gulp.src('sass/index.css')
+    return gulp.src(['sass/index.css', 'sass/shop.css'])
         .pipe(postcss(postcssEnvPlugin('PRO')))
         .pipe(postcss(postcssEnvPlugin('PRO')))
         .pipe(cssnano())
         .pipe(cssnano())
         .pipe(gulp.dest(distDir.css))
         .pipe(gulp.dest(distDir.css))

-.shop-index {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    overflow: hidden;
-
-    .nav-main {
-        margin-bottom: 30px;
-    }
-
-    .branner-top {
-        width: 100%;
-        height: 200px;
-        position: relative;
-        overflow: hidden;
-
-        .shop-back-img {
-            height: 100%;
-            width: 100%;
-        }
-    }
-
-    .logo {
-        position: absolute;
-        overflow: hidden;
-        left: 30px;
-        bottom: 30px;
-        width: 100px;
-        height: 100px;
-    }
-
-    .store-name {
-        color: #fff;
-        font-size: 28px;
-        position: absolute;
-        overflow: hidden;
-        left: 148px;
-        bottom: 20px;
-    }
-
-    .collect {
-        width: 128px;
-        height: 49px;
-        position: absolute;
-        bottom: 30px;
-        right: 30px;
-        border-radius: 10px;
-        text-align: center;
-        background-size: contain;
-    }
-
-    .alreadyCollect{
-        width: 128px;
-        height: 50px;
-        border-radius: 10px;
-        background-image: url('/product/already-collect.png') no-repeat;
-        background-size: contain;
-    }
-
-    .notCollect{
-        width: 128px;
-        height: 50px;
-        border-radius: 6px;
-        background-image: url('/product/not-collect.png') no-repeat;
-        background-size: contain;
-    }
-
-    .nav {
-        width: 100%;
-        height: 88px;
-        margin: 0;
-        padding: 0;
-        border: 0;
-        font: inherit;
-        vertical-align: baseline;
-        list-style: none;
-        font-size: 28px;
-        background: #fff;
-        overflow: hidden;
-        border-sizing: border-box;
-        border-bottom: 1px solid #e0e0e0;
-        z-index: 2;
-             
-        li{
-            display: block;
-            height: 28px;
-            float: left;
-            line-height: 28px;
-            width: 24.7%;
-            text-align: center;
-            border-left: 1px solid #e0e0e0;
-            margin-top: 30px;
-            border-sizing: border-box;
-            color: #b0b0b0;
-
-            &:first-child {
-                border-left: none;
-            }
-
-            a {
-                color: #b0b0b0;
-            }
-        }
-
-        .color {
-            color: #444;
-        }   
-    }
-
-    .main {
-        background: #f0f0f0;
-        padding-bottom: 40px;
-        overflow: hidden;
-
-        .banner-swiper {
-            width: 640px;
-            height: 310px;
-        }
-    }
-
-    .banner-area {
-        @extend .banner-top;
-        margin-bottom: 30px;
-    }
-
-    .coupon {
-        width: 100%;
-        padding: 30px 0;
-        overflow: hidden;
-
-        img {
-            width: 245px;
-            height: 120px;
-            vertical-align: top;
-            margin-left: 30px;
-            float: left;
-        }
-    }
-
-    .multi-brands {
-        width: 100%;
-        height: 270px;
-        background: #fff;
-        border: 1px solid #e0e0e0;
-        border-top: none;
-        font-size: 20px;
-        text-align: center;
-        padding-top: 25px;
-        margin-bottom: 30px; 
-        overflow: hidden; 
-
-        p {
-            font-size: 30px;
-        }
-    }
-
-    .multi-browse {
-        margin-top: 50px;
-    }
- 
-    .brand-img {
-        margin-left: 30px;
-        width: 140px;
-        height: 150px;
-        overflow: hidden;
-        padding-bottom: 20px;
-        float: left;
-
-        p {
-            font-size: 18px;
-            color: #b0b0b0;
-            padding-top: 10px;
-            height: 30px;
-            white-space: nowrap;
-            overflow: hidden;
-            text-overflow: ellipsis;
-        }
-
-        img {
-            height: 120px;
-        }
-    }
-
-    .spring {
-        margin: 0 15px;
-        overflow: hidden;
-
-        li {
-            width: 50%;
-            height: 160px;
-            float: left;
-            text-align: center;
-            list-style: none;
-            display: list-item;
-
-            img {
-                width: 275px;
-                height: inherit;
-                border-radius: 10px;
-                vertical-align: top;
-            }
-        }
-    }
-
-    .hot-category .floor-header {
-        margin: 0;
-    }
-
-    .popularity-title, .hot-category .floor-header {
-        background: #fff;
-        border-bottom: 1px solid #e0e0e0;
-        border-top: 1px solid #e0e0e0;
-        color: #444;
-        text-align: center;
-        height: 100px;
-        line-height: 100px;
-        font-size: 30px;
-        margin-top: 30px;
-        position: relative;
-    }
-
-    .hot-category .floor-header {
-        border-bottom: none;
-    }
-
-    .more {
-        position: absolute;
-        right: 30px;
-        top: 0;
-        bottom: 0;
-        color: #b0b0b0;
-        font-size: 50px;
-        font-family: "iconfont" !important;
-        font-style: normal;
-        text-decoration: none;
-    }
-
-    .product-list {
-        margin-left: auto;
-        margin-right: auto;
-        width: 610px;
-        overflow: hidden;
-        background: #fff;
-        border-bottom: 30px solid #f0f0f0;
-
-        li {
-            width: 275px;
-            height: 368px;
-            margin-top: 50px;
-            margin-left: 15px;
-            margin-right: 15px;
-            float: left;
-            text-align: center;
-            list-style: none;
-
-            img {
-                width: 275px;
-                height: 368px;
-                vertical-align: top;
-            }
-        }
-    }
-
-    .list-price {
-        height: 60px;
-        background: #aaaeac;
-        color: #FFFFFF;
-        font-size: 22px;
-        margin-top: -60px;
-        position: relative;
-        opacity: 0.90;
-        padding-left: 15px;
-
-        p {
-            margin: 0;
-            line-height: 32px;
-            text-align: left;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-        }
-    }
-
-    .red {
-        color: red;
-    }
-
-    .icon {
-        position: relative;
-        color: #b0b0b0;
-
-        i {
-            position: absolute;
-        }
-
-        .up {
-            top: -5px;
-            left: 8px;
-        }
-
-        .down {
-            top: 8px;
-            left: 8px;
-        }
-    }
-    .product-warp{
-        background-color: #fff;
-    }
-    .goods-container {
-        position: relative;
-        min-height: 440px;
-        /* padding-left: 15px; */
-        padding-top: 20px;
-        border-bottom: 1px solid #e0e0e0;
-    }
-
-    .pos-list {
-        border-bottom: 1px solid #e6e6e6;
-
-        li {
-            position: relative;
-        }
-
-        .new .iconfont,
-        .price .iconfont,
-        .discount .iconfont {
-            transform: scale(0.8);
-            -webkit-transform: scale(0.8);
-            font-weight: bold;
-        }
-
-        .new:after,
-        .price:after,
-        .discount:after {
-            height: 28px;
-            content: '';
-            border-left: 1px solid #e0e0e0;
-            position: absolute;
-            top: 25px;
-            left: 163px;
-        }
-    }
-
-    .discount-area {
-        @extend .discount-page;
-
-        #list-nav {
-            border-top: 1px solid #e0e0e0;
-            border-bottom: 1px solid #e0e0e0;
-        }
-
-        .list-nav li {
-            display: block;
-            height: 80px;
-            float: left;
-            line-height: 80px;
-            width: 24.8%;
-            text-align: center;
-            border-sizing: border-box;
-            position: relative;
-
-            span {
-                padding-top: 0;
-                font-size: 28px;
-            }
-
-            &.new:after,
-            &.price:after,
-            &.discount:after {
-                height: 28px;
-                content: '';
-                border-left: 1px solid #e0e0e0;
-                position: absolute;
-                top: 25px;
-                left: 163px;
-            }
-        }
-
-        .active {
-            .cur {
-                color: #444;
-            } 
-        }
-        
-       .list-nav .icon .up {
-                top: -28px;
-        }
-
-        .list-nav .icon .down {
-            top: -14px;
-        }
-
-        .goods-container {
-            padding-top: 30px;
-            padding-bottom: 100px;
-        }
-    }
-
-    .search-area {
-        @extend .search-page;
-    }
-
-    .hide {
-        display: none;
-    }
-
-    .shop-foot-wrapper {
-        position: absolute;
-        bottom: 0;
-        display: table;
-        width: 100%;
-        height: 88px;
-        line-height: 88px;
-        font-size: 28px;
-        background: #fff;
-        border-top: 1px solid #e0e0e0;
-        z-index: 2;
-
-
-        ul {
-            display: table-row;
-        }
-
-        li {
-            display: table-cell;
-            text-align: center;
-
-            .wall {
-                width: 0;
-                height: 28px;
-                margin-top: 30px;
-                float: right;
-                border-right: 1px solid #e0e0e0;
-                display: inline-block;
-            }
-        }
-
-        .sub-group {
-            position: absolute;
-            background: #fff;
-            border: 1px solid #e0e0e0;
-            border-radius: 12px;
-            bottom: 104px;
-            width: 40%;
-            margin-left: 5%;
-
-            dl {
-                padding: 0 30px;
-                margin: 0 auto;
-            }
-
-            dd {
-                line-height: 80px;
-                text-align: center;
-                border-top: 1px solid #e0e0e0;
-                white-space: nowrap;
-                overflow: hidden;
-                text-overflow: ellipsis;
-
-                a {
-                    color: #444;
-                }
-            }
-
-            dd:first-child {
-                border-top: 0;
-            }
-        }
-
-        .sharp {
-            position: absolute;
-            width: 100%;
-            height: 10px;
-            background: resolve('product/sharp.png') no-repeat center center;
-        }
-
-        .foot-list-3 .sub-group {
-            width: 29%;
-            margin-left: 2%;
-        }
-    }
-
-    .bytouch{
-        background:#eee;
-    }
-
-    .new-arrival {
-        padding-top: 30px;
-        overflow: hidden;
-        padding-left: 15px;
-        background: #fff;
-        padding-bottom: 100px;
-    }
-
-    .popularity {
-        padding-top: 30px;
-        overflow: hidden;
-        padding-left: 15px;
-        background: #fff;
-        padding-bottom: 100px;
-    }
-
-    .pos-list {
-        @extend .discount-page;
-        background: #fff;
-        width: 100%;
-        overflow: hidden;
-
-        li {
-            display: block;
-            height: 78px;
-            float: left;
-            line-height: 78px;
-            width: 24.8%;
-            text-align: center;
-            border-sizing: border-box;
-
-            span {
-                font-size: 28px;
-            }
-
-            a {
-                display: block;
-                box-sizing: border-box;
-                text-align: center;
-                width: 100%;
-                height: 100%;
-                color: #b0b0b0;
-
-            /*b {
-                height: 28px;
-                    border-left: 1px solid #e0e0e0;
-                float: right;
-                margin-top: 25px;
-            }*/
-        }
-        }
-
-        .active .cur {
-            color: #444;
-        }
-
-        .active a {
-            color: #444;
-        }
-
-
-        .new .iconfont {
-            transform: scale(0.8);
-            font-weight: bold;
-        }
-
-        .price .iconfont {
-            transform: scale(0.8);
-            font-weight: bold;
-        }
-
-        .filter .iconfont {
-            font-size: 22px;
-            transition: transform 0.1 ease-in;
-        }
-
-        .filter.active .iconfont {
-            transform: rotate(-180deg);
-        }
-    }
-
-    .pos-list .icon .up {
-        top: -28px;
-    }
-
-    .pos-list .icon .down {
-        top: -14px;
-    }
-
-    .category-list-top-board {
-        border-top: 1px solid #e0e0e0;
-    }
-    
-    .category-list-last-li {
-        border-right: 1px solid #e0e0e0;
-    }
-
-    .category-list-only-one-row {
-        border-top: none!important;
-    }
-}
-
-.shop-index + .filter-mask {
-    margin-top: 1px;
-
-    .filter-body {
-        overflow: auto;
-    }
-
-    .classify {
-        height: auto;
-    }
-
-    &.call-by-fix {
-        top: 78px;
-    }
+.shop-index {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    overflow: hidden;
+
+    .nav-main {
+        margin-bottom: 30px;
+    }
+
+    .branner-top {
+        width: 100%;
+        height: 200px;
+        position: relative;
+        overflow: hidden;
+
+        .shop-back-img {
+            height: 100%;
+            width: 100%;
+        }
+    }
+
+    .logo {
+        position: absolute;
+        overflow: hidden;
+        left: 30px;
+        bottom: 30px;
+        width: 100px;
+        height: 100px;
+    }
+
+    .store-name {
+        color: #fff;
+        font-size: 28px;
+        position: absolute;
+        overflow: hidden;
+        left: 148px;
+        bottom: 20px;
+    }
+
+    .collect {
+        width: 128px;
+        height: 49px;
+        position: absolute;
+        bottom: 30px;
+        right: 30px;
+        border-radius: 10px;
+        text-align: center;
+        background-size: contain;
+    }
+
+    .alreadyCollect{
+        width: 128px;
+        height: 50px;
+        border-radius: 10px;
+        background-image: url('/product/already-collect.png') no-repeat;
+        background-size: contain;
+    }
+
+    .notCollect{
+        width: 128px;
+        height: 50px;
+        border-radius: 6px;
+        background-image: url('/product/not-collect.png') no-repeat;
+        background-size: contain;
+    }
+
+    .nav {
+        width: 100%;
+        height: 88px;
+        margin: 0;
+        padding: 0;
+        border: 0;
+        font: inherit;
+        vertical-align: baseline;
+        list-style: none;
+        font-size: 28px;
+        background: #fff;
+        overflow: hidden;
+        border-sizing: border-box;
+        border-bottom: 1px solid #e0e0e0;
+        z-index: 2;
+             
+        li{
+            display: block;
+            height: 28px;
+            float: left;
+            line-height: 28px;
+            width: 24.7%;
+            text-align: center;
+            border-left: 1px solid #e0e0e0;
+            margin-top: 30px;
+            border-sizing: border-box;
+            color: #b0b0b0;
+
+            &:first-child {
+                border-left: none;
+            }
+
+            a {
+                color: #b0b0b0;
+            }
+        }
+
+        .color {
+            color: #444;
+        }   
+    }
+
+    .main {
+        background: #f0f0f0;
+        padding-bottom: 40px;
+        overflow: hidden;
+
+        .banner-swiper {
+            width: 640px;
+            height: 310px;
+        }
+    }
+
+    .banner-area {
+        @extend .banner-top;
+        margin-bottom: 30px;
+    }
+
+    .coupon {
+        width: 100%;
+        padding: 30px 0;
+        overflow: hidden;
+
+        img {
+            width: 245px;
+            height: 120px;
+            vertical-align: top;
+            margin-left: 30px;
+            float: left;
+        }
+    }
+
+    .multi-brands {
+        width: 100%;
+        height: 270px;
+        background: #fff;
+        border: 1px solid #e0e0e0;
+        border-top: none;
+        font-size: 20px;
+        text-align: center;
+        padding-top: 25px;
+        margin-bottom: 30px; 
+        overflow: hidden; 
+
+        p {
+            font-size: 30px;
+        }
+    }
+
+    .multi-browse {
+        margin-top: 50px;
+    }
+ 
+    .brand-img {
+        margin-left: 30px;
+        width: 140px;
+        height: 150px;
+        overflow: hidden;
+        padding-bottom: 20px;
+        float: left;
+
+        p {
+            font-size: 18px;
+            color: #b0b0b0;
+            padding-top: 10px;
+            height: 30px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+
+        img {
+            height: 120px;
+        }
+    }
+
+    .spring {
+        margin: 0 15px;
+        overflow: hidden;
+
+        li {
+            width: 50%;
+            height: 160px;
+            float: left;
+            text-align: center;
+            list-style: none;
+            display: list-item;
+
+            img {
+                width: 275px;
+                height: inherit;
+                border-radius: 10px;
+                vertical-align: top;
+            }
+        }
+    }
+
+    .hot-category .floor-header {
+        margin: 0;
+    }
+
+    .popularity-title, .hot-category .floor-header {
+        background: #fff;
+        border-bottom: 1px solid #e0e0e0;
+        border-top: 1px solid #e0e0e0;
+        color: #444;
+        text-align: center;
+        height: 100px;
+        line-height: 100px;
+        font-size: 30px;
+        margin-top: 30px;
+        position: relative;
+    }
+
+    .hot-category .floor-header {
+        border-bottom: none;
+    }
+
+    .more {
+        position: absolute;
+        right: 30px;
+        top: 0;
+        bottom: 0;
+        color: #b0b0b0;
+        font-size: 50px;
+        font-family: "iconfont" !important;
+        font-style: normal;
+        text-decoration: none;
+    }
+
+    .product-list {
+        margin-left: auto;
+        margin-right: auto;
+        width: 610px;
+        overflow: hidden;
+        background: #fff;
+        border-bottom: 30px solid #f0f0f0;
+
+        li {
+            width: 275px;
+            height: 368px;
+            margin-top: 50px;
+            margin-left: 15px;
+            margin-right: 15px;
+            float: left;
+            text-align: center;
+            list-style: none;
+
+            img {
+                width: 275px;
+                height: 368px;
+                vertical-align: top;
+            }
+        }
+    }
+
+    .list-price {
+        height: 60px;
+        background: #aaaeac;
+        color: #FFFFFF;
+        font-size: 22px;
+        margin-top: -60px;
+        position: relative;
+        opacity: 0.90;
+        padding-left: 15px;
+
+        p {
+            margin: 0;
+            line-height: 32px;
+            text-align: left;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+    }
+
+    .red {
+        color: red;
+    }
+
+    .icon {
+        position: relative;
+        color: #b0b0b0;
+
+        i {
+            position: absolute;
+        }
+
+        .up {
+            top: -5px;
+            left: 8px;
+        }
+
+        .down {
+            top: 8px;
+            left: 8px;
+        }
+    }
+    .product-warp{
+        background-color: #fff;
+    }
+    .goods-container {
+        position: relative;
+        min-height: 440px;
+        /* padding-left: 15px; */
+        margin: 0 auto;
+        padding: 0 15PX;
+        width: 100%;
+        border-bottom: 1px solid #e0e0e0;
+
+      .good-info {
+        width: 41.5%;
+
+        &:nth-child(even) {
+          margin-right: 26px;
+        }
+      }
+    }
+
+    .pos-list {
+        border-bottom: 1px solid #e6e6e6;
+
+        li {
+            position: relative;
+        }
+
+        .new .iconfont,
+        .price .iconfont,
+        .discount .iconfont {
+            transform: scale(0.8);
+            -webkit-transform: scale(0.8);
+            font-weight: bold;
+        }
+
+        .new:after,
+        .price:after,
+        .discount:after {
+            height: 28px;
+            content: '';
+            border-left: 1px solid #e0e0e0;
+            position: absolute;
+            top: 25px;
+            left: 163px;
+        }
+    }
+
+    .discount-area {
+        @extend .discount-page;
+
+        #list-nav {
+            border-top: 1px solid #e0e0e0;
+            border-bottom: 1px solid #e0e0e0;
+        }
+
+        .list-nav li {
+            display: block;
+            height: 80px;
+            float: left;
+            line-height: 80px;
+            width: 24.8%;
+            text-align: center;
+            border-sizing: border-box;
+            position: relative;
+
+            span {
+                padding-top: 0;
+                font-size: 28px;
+            }
+
+            &.new:after,
+            &.price:after,
+            &.discount:after {
+                height: 28px;
+                content: '';
+                border-left: 1px solid #e0e0e0;
+                position: absolute;
+                top: 25px;
+                left: 163px;
+            }
+        }
+
+        .active {
+            .cur {
+                color: #444;
+            } 
+        }
+        
+       .list-nav .icon .up {
+                top: -28px;
+        }
+
+        .list-nav .icon .down {
+            top: -14px;
+        }
+
+        .goods-container {
+            padding-top: 30px;
+            padding-bottom: 100px;
+        }
+    }
+
+    .search-area {
+        @extend .search-page;
+    }
+
+    .hide {
+        display: none;
+    }
+
+    .shop-foot-wrapper {
+        position: absolute;
+        bottom: 0;
+        display: table;
+        width: 100%;
+        height: 88px;
+        line-height: 88px;
+        font-size: 28px;
+        background: #fff;
+        border-top: 1px solid #e0e0e0;
+        z-index: 2;
+
+
+        ul {
+            display: table-row;
+        }
+
+        li {
+            display: table-cell;
+            text-align: center;
+
+            .wall {
+                width: 0;
+                height: 28px;
+                margin-top: 30px;
+                float: right;
+                border-right: 1px solid #e0e0e0;
+                display: inline-block;
+            }
+        }
+
+        .sub-group {
+            position: absolute;
+            background: #fff;
+            border: 1px solid #e0e0e0;
+            border-radius: 12px;
+            bottom: 104px;
+            width: 40%;
+            margin-left: 5%;
+
+            dl {
+                padding: 0 30px;
+                margin: 0 auto;
+            }
+
+            dd {
+                line-height: 80px;
+                text-align: center;
+                border-top: 1px solid #e0e0e0;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+
+                a {
+                    color: #444;
+                }
+            }
+
+            dd:first-child {
+                border-top: 0;
+            }
+        }
+
+        .sharp {
+            position: absolute;
+            width: 100%;
+            height: 10px;
+            background: resolve('product/sharp.png') no-repeat center center;
+        }
+
+        .foot-list-3 .sub-group {
+            width: 29%;
+            margin-left: 2%;
+        }
+    }
+
+    .bytouch{
+        background:#eee;
+    }
+
+    .new-arrival {
+        padding-top: 30px;
+        overflow: hidden;
+        padding-left: 15px;
+        background: #fff;
+        padding-bottom: 100px;
+    }
+
+    .popularity {
+        padding-top: 30px;
+        overflow: hidden;
+        padding-left: 15px;
+        background: #fff;
+        padding-bottom: 100px;
+    }
+
+    .pos-list {
+        @extend .discount-page;
+        background: #fff;
+        width: 100%;
+        overflow: hidden;
+
+        li {
+            display: block;
+            height: 78px;
+            float: left;
+            line-height: 78px;
+            width: 24.8%;
+            text-align: center;
+            border-sizing: border-box;
+
+            span {
+                font-size: 28px;
+            }
+
+            a {
+                display: block;
+                box-sizing: border-box;
+                text-align: center;
+                width: 100%;
+                height: 100%;
+                color: #b0b0b0;
+
+            /*b {
+                height: 28px;
+                    border-left: 1px solid #e0e0e0;
+                float: right;
+                margin-top: 25px;
+            }*/
+        }
+        }
+
+        .active .cur {
+            color: #444;
+        }
+
+        .active a {
+            color: #444;
+        }
+
+
+        .new .iconfont {
+            transform: scale(0.8);
+            font-weight: bold;
+        }
+
+        .price .iconfont {
+            transform: scale(0.8);
+            font-weight: bold;
+        }
+
+        .filter .iconfont {
+            font-size: 22px;
+            transition: transform 0.1 ease-in;
+        }
+
+        .filter.active .iconfont {
+            transform: rotate(-180deg);
+        }
+    }
+
+    .pos-list .icon .up {
+        top: -28px;
+    }
+
+    .pos-list .icon .down {
+        top: -14px;
+    }
+
+    .category-list-top-board {
+        border-top: 1px solid #e0e0e0;
+    }
+    
+    .category-list-last-li {
+        border-right: 1px solid #e0e0e0;
+    }
+
+    .category-list-only-one-row {
+        border-top: none!important;
+    }
+
+    .hot-category .category-list li {
+        width: 25%;
+        box-sizing: border-box;
+    }
+}
+
+.shop-index + .filter-mask {
+    margin-top: 1px;
+
+    .filter-body {
+        overflow: auto;
+    }
+
+    .classify {
+        height: auto;
+    }
+
+    &.call-by-fix {
+        top: 78px;
+    }
 }
 }

+@charset "utf-8";
+
+@use postcss-clearfix;
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font: inherit;
+  font-size: 100%;
+  vertical-align: baseline;
+}
+
+html {
+  line-height: 1;
+}
+
+ol, ul {
+  list-style: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+caption, th, td {
+  text-align: left;
+  font-weight: normal;
+  vertical-align: middle;
+}
+
+q, blockquote {
+  quotes: none;
+}
+
+q:before, q:after, blockquote:before, blockquote:after {
+  content: "";
+  content: none;
+}
+
+a img {
+  border: none;
+}
+
+article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
+  display: block;
+}
+/*Reset End*/
+
+.clearfix {
+  clear: fix;
+}
+
+* {
+  -webkit-tap-highlight-color: rgba(0,0,0,0);
+  -moz-tap-highlight-color: rgba(0,0,0,0);
+  tap-highlight-color: rgba(0,0,0,0);
+}
+
+html, body {
+  font-family: helvetica,Arial,"黑体";
+  width: 100%;
+  font-size: 12PX;
+  line-height: 1.4;
+}
+
+button, input, select, textarea {
+  font-size: 100%;
+  margin: 0;
+}
+
+img {
+  max-width: 100%;
+  display: block;
+  border: 0;
+  margin: 0 auto;
+}
+
+a {
+  text-decoration: none;
+  outline: none;
+  color: #000;
+
+  &:link,
+  &:visited,
+  &:hover,
+  &:actived {
+    color: #111;
+  }
+}
+
+/* 屏蔽统计代码对样式的影响 */
+iframe[height="0"] {
+  display: none;
+}
+
+*:focus {
+  outline: none;
+}
+
+.hide {
+  display: none;
+}
+
+.overflow-hidden {
+  overflow: hidden;
+}
+
+@font-face {
+  font-family: "iconfont";
+  src: resolve('iconfont.eot'); /* IE9*/
+  src: resolve('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  resolve('iconfont.woff') format('woff'), /* chrome、firefox */
+  resolve('iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
+  resolve('iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16PX;
+  font-style: normal;
+  text-decoration: none;
+  -webkit-font-smoothing: antialiased;
+  -webkit-text-stroke-width: 0.2PX;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.yoho-tip {
+  position: fixed;
+  display: none;
+  text-align: center;
+  width: 70%;
+  padding: 34PX 0;
+  top: 50%;
+  left: 50%;
+  margin-left: -35%;
+  margin-top: -45PX;
+  background-color: rgba(0,0,0,.7);
+  color: #fff;
+  font-size: 18PX;
+  border: none;
+  z-index:4;
+  border-radius: 10PX;
+}
+
+.tap-hightlight {
+  &.highlight {
+    background: #eee!important;
+  }
+}
+
+.load-more-info {
+  width: 100%;
+  height: 70px;
+  line-height: 70px;
+  text-align: center;
+  font-size: 14PX;
+  overflow: hidden;
+
+  .status {
+    &.hide {
+      display: none;
+    }
+  }
+}
+
+@import "layout/header";
+@import "layout/footer";
+@import "layout/footer_tab";
+@import "good";
+@import "lazy-failure";
+@import "filter";
+@import "loading";
+@import "index/index";
+@import "home/index";
+@import "category/index";
+@import "product/index";
+@import "shop/index";

@@ -30,7 +30,9 @@
                  <!-- /tar modifield 160826  -->
                  <!-- /tar modifield 160826  -->
                 <div class="branner-top">
                 <div class="branner-top">
                     <img class="shop-back-img" src="{{branerImg}}">
                     <img class="shop-back-img" src="{{branerImg}}">
-                    <img class="logo" src="{{logoImg}}">
+                    {{#if logoImg}}
+                        <img class="logo" src="{{logoImg}}">
+                    {{/if}}
                     <p class="store-name">{{storeName}}</p>
                     <p class="store-name">{{storeName}}</p>
                     <div class="collect">
                     <div class="collect">
                         {{#if collect}}
                         {{#if collect}}

 <!-- Google Tag Manager -->
 <!-- Google Tag Manager -->
+{{#unless isApp}}
 <noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-W958MG" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
 <noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-W958MG" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
 <script>
 <script>
     var _hmt = _hmt || [];
     var _hmt = _hmt || [];
@@ -17,3 +18,4 @@
     }
     }
     window.addEventListener('load', async_load, false);
     window.addEventListener('load', async_load, false);
 </script>
 </script>
+{{/unless}}

@@ -27,16 +27,32 @@
 <link rel="dns-prefetch" href="//img12.static.yhbimg.com">
 <link rel="dns-prefetch" href="//img12.static.yhbimg.com">
 <link rel="dns-prefetch" href="//img13.static.yhbimg.com">
 <link rel="dns-prefetch" href="//img13.static.yhbimg.com">
 {{#if rlsEnv}}
 {{#if rlsEnv}}
-<link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/index.css">
+    {{#if shopPager}}
+        <link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/shop.css">
+    {{^}}
+        <link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/index.css">
+    {{/if}}
 {{/if}}
 {{/if}}
 {{#if preEnv}}
 {{#if preEnv}}
-<link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/index.css">
+    {{#if shopPager}}
+        <link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/shop.css">
+    {{^}}
+        <link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/index.css">
+    {{/if}}
 {{/if}}
 {{/if}}
 {{#if testEnv}}
 {{#if testEnv}}
-<link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/index.css">
+    {{#if shopPager}}
+        <link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/shop.css">
+    {{^}}
+        <link rel="stylesheet" href="//cdn.yoho.cn/myohobuy/{{version}}/index.css">
+    {{/if}}
 {{/if}}
 {{/if}}
 {{#if devEnv}}
 {{#if devEnv}}
-<link rel="stylesheet" href="//static.dev.yohobuy.com/css/index.css">
+    {{#if shopPager}}
+        <link rel="stylesheet" href="//static.dev.yohobuy.com/css/shop.css">
+    {{^}}
+        <link rel="stylesheet" href="//static.dev.yohobuy.com/css/index.css">
+    {{/if}}
 {{/if}}
 {{/if}}
 <link rel="apple-touch-icon-precomposed" href="//static.yohobuy.com/m/v1/img/touch/apple-touch-icon-144x144-precomposed-new.png">
 <link rel="apple-touch-icon-precomposed" href="//static.yohobuy.com/m/v1/img/touch/apple-touch-icon-144x144-precomposed-new.png">
 <link rel="apple-touch-startup-image" sizes="640x920" href="//static.yohobuy.com/m/v1/img/startup/startup-retina.png" media="screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)">
 <link rel="apple-touch-startup-image" sizes="640x920" href="//static.yohobuy.com/m/v1/img/startup/startup-retina.png" media="screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)">

@@ -514,7 +514,8 @@ class IndexController extends AbstractAction
             ),
             ),
             'gender' => $data['gender'],
             'gender' => $data['gender'],
             'coverChannel' => $coverChannel,
             'coverChannel' => $coverChannel,
-            'appVersion' => !empty($appVersion)
+            'appVersion' => !empty($appVersion),
+            'shopPager' => true
         ));
         ));
 
 
     }
     }