checked & senior hover

@@ -2,18 +2,26 @@
 <div class="products-page yoho-page">
 <div class="products-page yoho-page">
     <div class="filter-box">
     <div class="filter-box">
         {{# filters}}
         {{# filters}}
-            {{#if checked}}
-                <div class="checked">
+            {{# checkedConditons}}
+                <div class="checked-conditions section">
                     <span class="title">已选条件：</span>
                     <span class="title">已选条件：</span>
 
 
-                    {{# checked}}
-                        <span class="item">
+                    <div class="attr-content clearfix">
+                        {{#each conditions}}
+                            <a class="tag" href="{{href}}">
+                                {{#if name}}
                                     {{name}}
                                     {{name}}
-                            <i class="close">x</i>
-                        </span>
-                    {{/ checked}}
-                </div>
+                                {{^}}
+                                    <i class="color-block" style="background: {{color}}"></i>
                                 {{/if}}
                                 {{/if}}
+                                <i class="close iconfont">&#xe602;</i>
+                            </a>
+                        {{/each}}
+
+                        <a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
+                    </div>
+                </div>
+            {{/ checkedConditons}}
 
 
             {{#if channel}}
             {{#if channel}}
                 <div class="channel section">
                 <div class="channel section">
@@ -174,7 +182,9 @@
                             {{#each seniorChose}}
                             {{#each seniorChose}}
                                 <li class="attr">
                                 <li class="attr">
                                     {{name}}
                                     {{name}}
-                                    <span class="iconfont"></span>
+                                    <span class="iconfont">&#xe600;</span>
+
+                                    <div class="senior-up-icon"></div>
 
 
                                     <div class="senior-sub hide" data-attr="{{attr}}">
                                     <div class="senior-sub hide" data-attr="{{attr}}">
                                         {{#if showMulti}}
                                         {{#if showMulti}}

@@ -10,6 +10,7 @@
 
 
         &:first-child {
         &:first-child {
             border-top: none;
             border-top: none;
+            background: #eaeceb;
         }
         }
     }
     }
 
 
@@ -48,12 +49,29 @@
         -moz-user-select: none;
         -moz-user-select: none;
     }
     }
 
 
-    .channel {
-        line-height: 35px;
-        background: #eaeceb;
+    .checked-conditions {
+        line-height: 30px;
+
+        .tag {
+            display: block;
+            float: left;
+            padding: 0 10px;
+            margin-right: 30px;
+            background: #000;
+            color: #fff;
+            cursor: pointer;
+        }
+
+        .color-block {
+            height: 14px;
+            width: 14px;
+            border: 1px solid #fff;
+            margin-bottom: -3px;
+        }
 
 
-        .title, .attr {
-            line-height: 35px;
+        .clear-checked {
+            color: #999;
+            float: right;
         }
         }
     }
     }
 
 
@@ -139,6 +157,7 @@
             margin-top: 5px;
             margin-top: 5px;
             background: #f4f7f6;
             background: #f4f7f6;
             min-height: 30px;
             min-height: 30px;
+            border: 1px solid #000;
         }
         }
     }
     }
 
 
@@ -200,17 +219,29 @@
         margin-right: 5px;
         margin-right: 5px;
     }
     }
     
     
-    .senior-attr-wrap {
+    .senior-attr-wrap > .attr {
         position: relative;
         position: relative;
         
         
+        &:hover {
+            > .iconfont {
+                visibility: hidden;
+            }
+
+            .senior-up-icon {
+                display: block;
+            }
+        }
+    }
+
     .senior-sub {
     .senior-sub {
         box-sizing: border-box;
         box-sizing: border-box;
         position: absolute;
         position: absolute;
         padding: 15px 0;
         padding: 15px 0;
         left: 0;
         left: 0;
-            right: -16px;
+        width: 1050px;
+        top: 39px;
         background: #fff;
         background: #fff;
-            border: 1px solid #ccc;
+        border: 1px solid #eaeceb;
 
 
         ul {
         ul {
             max-width: 950px;
             max-width: 950px;
@@ -226,9 +257,18 @@
             right: 15px;
             right: 15px;
         }
         }
     }
     }
-    }
 
 
+    .senior-up-icon {
+        position: absolute;
+        width: 15px;
+        height: 9px;
+        z-index: 1;
+        left: 50%;
+        margin-left: -18px;
+        display: none;
 
 
+        background: image-url('product/senior-up.png') no-repeat;
+    }
 
 
     .checkbox {
     .checkbox {
         display: none;
         display: none;

@@ -13,6 +13,23 @@ class IndexController extends AbstractAction
         $data = array(
         $data = array(
             'searchListPage' => true,
             'searchListPage' => true,
             'filters' => array(
             'filters' => array(
+                'checkedConditons' => array(
+                    'conditions' => array(
+                        array(
+                            'href' => '',
+                            'name' => '暗黑'
+                        ),
+                        array(
+                            'href' => '',
+                            'color' => '#f00'
+                        ),
+                        array(
+                            'href' => '',
+                            'name' => 'CLOT'
+                        )
+                    ),
+                    'clearUrl' => ''
+                ),
                 'channel' => array(
                 'channel' => array(
                     array(
                     array(
                         'href' => '/?gender=1,3',
                         'href' => '/?gender=1,3',