产品调整

@@ -16,7 +16,7 @@
         .iconfont {
             margin: 0 4px 0 0;
             vertical-align: 9%;
-            font-size: 22rem / $pxConvertRem;
+            font-size: 24rem / $pxConvertRem;
         }
     }
 }
\ No newline at end of file

 .article-type-four {
-    padding: 0 0 5rem / $pxConvertRem 0;
+    padding: 0 0 8rem / $pxConvertRem 0;
     background: #fff;
 
     img {

@@ -14,11 +14,10 @@ $pxConvertRem : 40;
     .thumb-container {
         position: relative;
         font-size: 0;
-        padding-left: 30rem / $pxConvertRem;
+        padding: 20rem / $pxConvertRem 0 0 30rem / $pxConvertRem;
         background: #fff;
         z-index: 10;
-        background: url('../img/li-bg.png') repeat-x;
-        background-size: auto 100%;
+        border-bottom: 1px solid #969696;
 
         &.fixed{
             position: fixed;
@@ -40,11 +39,21 @@ $pxConvertRem : 40;
             }
 
             &.focus {
-                background: url('../img/li-current-bg.png');
-                background-size: 100% 100%;
                 .thumb-img {
                     border-color: #000;
                 }
+
+                .arrow {
+                    position: absolute;
+                    width: 32rem / $pxConvertRem;
+                    height: 19rem / $pxConvertRem;
+                    bottom: -1px;
+                    left: 50%;
+                    margin: 0 0 0 -16rem / $pxConvertRem;
+                    z-index: 12;
+                    background: url('../img/arrow.png') no-repeat;
+                    background-size: 100% 100%;
+                }
             }
 
             .thumb-img {

@@ -16,34 +16,50 @@
     }
 
     .brand-list {
-        padding: 30rem / $pxConvertRem 0 30rem / $pxConvertRem 30rem / $pxConvertRem;
+        padding: 30rem / $pxConvertRem 0 30rem / $pxConvertRem;
         background: #fff;
         border-top: 1px solid #e0e0e0;
         border-bottom: 1px solid #e0e0e0;
 
         li {
             float: left;
-            margin: 0 0 0 20rem / $pxConvertRem;
-            border: 1px solid #e0e0e0;
+            width: 158rem / $pxConvertRem;
+            height: 120rem / $pxConvertRem;
+            border-left: 1px solid #e0e0e0;
+
+            a {
+                display: block;
+            }
 
-            a{
+            .brand-logo {
                 display: table-cell;
-                width: 128rem / $pxConvertRem;
-                height: 128rem / $pxConvertRem;
+                width: 158rem / $pxConvertRem;
+                height: 94rem / $pxConvertRem;
                 vertical-align:middle;
-            }
 
                 img {
                     display: block;
-                max-width: 128rem / $pxConvertRem;
-                max-height: 128rem / $pxConvertRem;
+                    max-width: 158rem / $pxConvertRem;
+                    max-height: 94rem / $pxConvertRem;
                     vertical-align: middle;
                     margin: 0 auto;
                 }
             }
             
+            .brand-name {
+                line-height: 26rem / $pxConvertRem;
+                font-size: 14rem / $pxConvertRem;
+                color: #babac2;
+                text-align: center;
+                text-decoration: none;
+                border-bottom: none;
+                overflow: hidden;
+            }
+            
+        }
+
         li:first-child {
-            margin: 0;
+            border-left: none;
         }
     }
 }
\ No newline at end of file

@@ -6,6 +6,7 @@
                     <li class="thumb">
                         <img class="thumb-img lazy" src="{{thumb}}">
                         <span class="clothe-type {{type}}"></span>
+                        <em class="arrow"></em>
                     </li>
                 {{/ list}}
             </ul>

@@ -3,7 +3,10 @@
     <ul class="brand-list clearfix">
     {{# brands}}
         <li><a href="{{url}}">
+            <div class="brand-logo">
                 <img class="lazy" src="{{thumb}}" alt="{{name}}">
+            </div>
+            <p class="brand-name">{{name}}</p>
         </a></li>
     {{/ brands}}
     </ul>