Authored by xuqi

checked & senior hover

... ... @@ -2,18 +2,26 @@
<div class="products-page yoho-page">
<div class="filter-box">
{{# filters}}
{{#if checked}}
<div class="checked">
{{# checkedConditons}}
<div class="checked-conditions section">
<span class="title">已选条件:</span>
{{# checked}}
<span class="item">
<div class="attr-content clearfix">
{{#each conditions}}
<a class="tag" href="{{href}}">
{{#if name}}
{{name}}
<i class="close">x</i>
</span>
{{/ checked}}
</div>
{{^}}
<i class="color-block" style="background: {{color}}"></i>
{{/if}}
<i class="close iconfont">&#xe602;</i>
</a>
{{/each}}
<a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
</div>
</div>
{{/ checkedConditons}}
{{#if channel}}
<div class="channel section">
... ... @@ -174,7 +182,9 @@
{{#each seniorChose}}
<li class="attr">
{{name}}
<span class="iconfont"></span>
<span class="iconfont">&#xe600;</span>
<div class="senior-up-icon"></div>
<div class="senior-sub hide" data-attr="{{attr}}">
{{#if showMulti}}
... ...
... ... @@ -10,6 +10,7 @@
&:first-child {
border-top: none;
background: #eaeceb;
}
}
... ... @@ -48,12 +49,29 @@
-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;
background: #f4f7f6;
min-height: 30px;
border: 1px solid #000;
}
}
... ... @@ -200,17 +219,29 @@
margin-right: 5px;
}
.senior-attr-wrap {
.senior-attr-wrap > .attr {
position: relative;
&:hover {
> .iconfont {
visibility: hidden;
}
.senior-up-icon {
display: block;
}
}
}
.senior-sub {
box-sizing: border-box;
position: absolute;
padding: 15px 0;
left: 0;
right: -16px;
width: 1050px;
top: 39px;
background: #fff;
border: 1px solid #ccc;
border: 1px solid #eaeceb;
ul {
max-width: 950px;
... ... @@ -226,9 +257,18 @@
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 {
display: none;
... ...
... ... @@ -13,6 +13,23 @@ class IndexController extends AbstractAction
$data = array(
'searchListPage' => true,
'filters' => array(
'checkedConditons' => array(
'conditions' => array(
array(
'href' => '',
'name' => '暗黑'
),
array(
'href' => '',
'color' => '#f00'
),
array(
'href' => '',
'name' => 'CLOT'
)
),
'clearUrl' => ''
),
'channel' => array(
array(
'href' => '/?gender=1,3',
... ...