fe / yohoblk-wap · Commits

Go to a project

Authored by 王水玲
Commit 7133059307720c4b3d4bdc86da236279af672f49 1 parent 5c834699

bug 修改

Inline Side-by-side
Showing 8 changed files with 51 additions and 50 deletions
... ... @@ -16,10 +16,10 @@
<div class="filter-content">
<ul class="filter-type">
<li
class="type-item"><span class="sort-label">新品<i class="icon down icon-sort-down"></i></span></li>
class="type-item"><span class="sort-label">新品<i class="icon down icon-arrow-down"></i></span></li>
<li
class="type-item"><span class="sort-label">筛选
<i class="icon down icon-sort-down"></i></span></li>
<i class="icon down icon-arrow-down"></i></span></li>
</ul>
</div>
</div>
... ...
... ... @@ -6,7 +6,7 @@
<dd class="item" v-for="brand in currentData[item.index]" :key="brand.id" :class="{'active': brand.checked}" @click="select(brand)">
<div class="item-inner">{{brand.name}}</div>
<div class="item-check">
<i class="icon icon-check"></i>
<i class="icon icon-choose"></i>
</div>
</dd>
</dl>
... ...
... ... @@ -149,8 +149,8 @@
.item,
.index {
color: #000;
padding-left: 30px;
padding-right: 30px;
padding-left: 35px;
padding-right: 35px;
}
.index {
... ... @@ -191,7 +191,8 @@
display: none;
i {
font-weight: bold;
font-size: 60px;
line-height: 82px;
}
}
}
... ...
... ... @@ -135,15 +135,15 @@ export default {
recClass() {
return {
down: this.recDown,
'icon-sort-up': !this.recDown,
'icon-sort-down': this.recDown
'icon-arrow-up': !this.recDown,
'icon-arrow-down': this.recDown
};
},
filterClass() {
return {
down: this.filterDown,
'icon-sort-up': !this.filterDown,
'icon-sort-down': this.filterDown
'icon-arrow-up': !this.filterDown,
'icon-arrow-down': this.filterDown
};
},
activeSort: {
... ... @@ -426,14 +426,10 @@ export default {
.icon {
position: absolute;
top: 14px;
top: 10px;
right: -46px;
font-size: 32px;
font-size: 20px;
font-weight: bold;
&.down {
top: -10px;
}
}
}
... ...
... ... @@ -5,7 +5,7 @@
{{item.name}}
</div>
<div class="item-check">
<i class="icon icon-check"></i>
<i class="icon icon-choose"></i>
</div>
</div>
<slot></slot>
... ...
... ... @@ -40,7 +40,8 @@
$sideIdx: '',
sideRect: {},
firstIdxRect: {},
zoomSwitch: false
zoomSwitch: false,
slideLeft: 0
};
},
watch: {
... ... @@ -62,13 +63,14 @@
}, 500);
},
hideZoom() {
this.zoomIdx = '';
// this.zoomIdx = '';
this.zoomSwitch = false;
},
showZoom(e) {
const eX = e.center.x;
const eY = e.center.y;
const outRect = eX < this.sideRect.left || eY < this.sideRect.top || eY > this.sideRect.bottom;
const outRect = eX < this.slideLeft || eY < this.sideRect.top || eY > this.sideRect.bottom;
if (outRect) {
return this.hideZoom();
... ... @@ -127,6 +129,7 @@
this.$nextTick(function() {
setTimeout(() => {
this.recordIdxRect();
this.slideLeft = this.sideRect.left;
}, 500);
});
}
... ...
<template>
<resource class="resource-category">
<a-link class="cate-label" :href="brandLink" :yas="value" :yas-f="index">品牌<i class="icon icon-arrow-right"></i></a-link>
<a-link class="cate-label" :href="brandLink" :yas="value" :yas-f="index">品牌<i class="icon icon-arrow-up trans-right"></i></a-link>
<div v-for="(item, index) in sort" v-if="item.sub" :key="index">
<p class="cate-label" @click="toggle(index)">{{item.category_name
}}<i class="icon" :class="sortClass[index]"></i></p>
... ... @@ -94,7 +94,7 @@ export default {
color: #030303;
font-size: 28px;
font-weight: bold;
font-family: "HiraginoSansGB-W6", "PingFang SC", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei";
font-family: "HiraginoSansGB-W6";
.icon {
position: absolute;
... ... @@ -102,10 +102,11 @@ export default {
right: 24px;
font-size: 20px;
line-height: 88px;
font-weight: bold;
}
.icon.icon-arrow-right {
font-size: 34px;
.icon.trans-right {
transform: rotate(90deg);
}
&:after {
... ...
... ... @@ -37,92 +37,92 @@
/* HiraginoSansGB-W3 */
@font-face {
font-family: "HiraginoSansGB-W3";
src: resolve("hiragino/hiragino_sans_gb_w3.eot");
src: resolve("hiragino/hiragino_sans_gb_w3.eot?#iefix") format("embedded-opentype"), resolve("hiragino/hiragino_sans_gb_w3.woff") format("woff"), resolve("hiragino/hiragino_sans_gb_w3.ttf") format("truetype"), resolve("hiragino/hiragino_sans_gb_w3.svg#HiraginoSansGB-W3") format("svg");
src: url("../font/hiragino/hiragino_sans_gb_w3.eot");
src: url("../font/hiragino/hiragino_sans_gb_w3.eot?#iefix") format("embedded-opentype"), url("../font/hiragino/hiragino_sans_gb_w3.woff") format("woff"), url("../font/hiragino/hiragino_sans_gb_w3.ttf") format("truetype"), url("../font/hiragino/hiragino_sans_gb_w3.svg#HiraginoSansGB-W3") format("svg");
}
/* HiraginoSansGB-W6 */
@font-face {
font-family: "HiraginoSansGB-W6";
src: resolve("hiragino/hiragino_sans_gb_w6.eot");
src: resolve("hiragino/hiragino_sans_gb_w6.eot?#iefix") format("embedded-opentype"), resolve("hiragino/hiragino_sans_gb_w6.woff") format("woff"), resolve("hiragino/hiragino_sans_gb_w6.ttf") format("truetype"), resolve("hiragino/hiragino_sans_gb_w6.svg#HiraginoSansGB-W6") format("svg");
src: url("../font/hiragino/hiragino_sans_gb_w6.eot");
src: url("../font/hiragino/hiragino_sans_gb_w6.eot?#iefix") format("embedded-opentype"), url("../font/hiragino/hiragino_sans_gb_w6.woff") format("woff"), url("../font/hiragino/hiragino_sans_gb_w6.ttf") format("truetype"), url("../font/hiragino/hiragino_sans_gb_w6.svg#HiraginoSansGB-W6") format("svg");
}
/* SanFranciscoText-Regular */
@font-face {
font-family: "SanFranciscoText-Regular";
src: resolve("sanFranciscoText/sanfranciscotext-regular.eot");
src: resolve("sanFranciscoText/sanfranciscotext-regular.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-regular.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-regular.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-regular.svg#SanFranciscoText-Regular") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-regular.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-regular.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-regular.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-regular.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-regular.svg#SanFranciscoText-Regular") format("svg");
}
/* SanFranciscoText-Bold */
@font-face {
font-family: "SanFranciscoText-Bold";
src: resolve("sanFranciscoText/sanfranciscotext-bold.eot");
src: resolve("sanFranciscoText/sanfranciscotext-bold.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-bold.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-bold.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-bold.svg#SanFranciscoText-Bold") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-bold.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-bold.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-bold.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-bold.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-bold.svg#SanFranciscoText-Bold") format("svg");
}
/* SanFranciscoText-Bolditalic */
@font-face {
font-family: "SanFranciscoText-Bolditalic";
src: resolve("sanFranciscoText/sanfranciscotext-bolditalic.eot");
src: resolve("sanFranciscoText/sanfranciscotext-bolditalic.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-bolditalic.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-bolditalic.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-bolditalic.svg#SanFranciscoText-Bolditalic") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-bolditalic.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-bolditalic.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-bolditalic.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-bolditalic.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-bolditalic.svg#SanFranciscoText-Bolditalic") format("svg");
}
/* SanFranciscoText-Heavy */
@font-face {
font-family: "SanFranciscoText-Heavy";
src: resolve("sanFranciscoText/sanfranciscotext-heavy.eot");
src: resolve("sanFranciscoText/sanfranciscotext-heavy.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-heavy.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-heavy.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-heavy.svg#SanFranciscoText-Heavy") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-heavy.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-heavy.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-heavy.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-heavy.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-heavy.svg#SanFranciscoText-Heavy") format("svg");
}
/* SanFranciscoText-Heavyitalic */
@font-face {
font-family: "SanFranciscoText-Heavyitalic";
src: resolve("sanFranciscoText/sanfranciscotext-heavyitalic.eot");
src: resolve("sanFranciscoText/sanfranciscotext-heavyitalic.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-heavyitalic.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-heavyitalic.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-heavyitalic.svg#SanFranciscoText-Heavyitalic") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-heavyitalic.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-heavyitalic.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-heavyitalic.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-heavyitalic.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-heavyitalic.svg#SanFranciscoText-Heavyitalic") format("svg");
}
/* SanFranciscoText-Light */
@font-face {
font-family: "SanFranciscoText-Light";
src: resolve("sanFranciscoText/sanfranciscotext-light.eot");
src: resolve("sanFranciscoText/sanfranciscotext-light.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-light.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-light.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-light.svg#SanFranciscoText-Light") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-light.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-light.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-light.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-light.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-light.svg#SanFranciscoText-Light") format("svg");
}
/* SanFranciscoText-Lightitalic */
@font-face {
font-family: "SanFranciscoText-Lightitalic";
src: resolve("sanFranciscoText/sanfranciscotext-lightitalic.eot");
src: resolve("sanFranciscoText/sanfranciscotext-lightitalic.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-lightitalic.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-lightitalic.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-lightitalic.svg#SanFranciscoText-Lightitalic") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-lightitalic.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-lightitalic.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-lightitalic.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-lightitalic.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-lightitalic.svg#SanFranciscoText-Lightitalic") format("svg");
}
/* SanFranciscoText-Medium */
@font-face {
font-family: "SanFranciscoText-Medium";
src: resolve("sanFranciscoText/sanfranciscotext-medium.eot");
src: resolve("sanFranciscoText/sanfranciscotext-medium.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-medium.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-medium.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-medium.svg#SanFranciscoText-Medium") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-medium.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-medium.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-medium.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-medium.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-medium.svg#SanFranciscoText-Medium") format("svg");
}
/* SanFranciscoText-Mediumitalic */
@font-face {
font-family: "SanFranciscoText-Mediumitalic";
src: resolve("sanFranciscoText/sanfranciscotext-mediumitalic.eot");
src: resolve("sanFranciscoText/sanfranciscotext-mediumitalic.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-mediumitalic.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-mediumitalic.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-mediumitalic.svg#SanFranciscoText-Mediumitalic") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-mediumitalic.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-mediumitalic.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-mediumitalic.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-mediumitalic.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-mediumitalic.svg#SanFranciscoText-Mediumitalic") format("svg");
}
/* SanFranciscoText-Regularitalic */
@font-face {
font-family: "SanFranciscoText-Regularitalic";
src: resolve("sanFranciscoText/sanfranciscotext-regularitalic.eot");
src: resolve("sanFranciscoText/sanfranciscotext-regularitalic.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-regularitalic.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-regularitalic.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-regularitalic.svg#SanFranciscoText-Regularitalic") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-regularitalic.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-regularitalic.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-regularitalic.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-regularitalic.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-regularitalic.svg#SanFranciscoText-Regularitalic") format("svg");
}
/* SanFranciscoText-Semibold */
@font-face {
font-family: "san_francisco_textsemibold";
src: resolve("sanFranciscoText/sanfranciscotext-semibold.eot");
src: resolve("sanFranciscoText/sanfranciscotext-semibold.eot?#iefix") format("embedded-opentype"), resolve("sanFranciscoText/sanfranciscotext-semibold.woff") format("woff"), resolve("sanFranciscoText/sanfranciscotext-semibold.ttf") format("truetype"), resolve("sanFranciscoText/sanfranciscotext-semibold.svg#SanFranciscoText-Semibold") format("svg");
src: url("../font/sanFranciscoText/sanfranciscotext-semibold.eot");
src: url("../font/sanFranciscoText/sanfranciscotext-semibold.eot?#iefix") format("embedded-opentype"), url("../font/sanFranciscoText/sanfranciscotext-semibold.woff") format("woff"), url("../font/sanFranciscoText/sanfranciscotext-semibold.ttf") format("truetype"), url("../font/sanFranciscoText/sanfranciscotext-semibold.svg#SanFranciscoText-Semibold") format("svg");
}
.brown-light {
... ...