fe / xianyu-ufo-app-web · Commits

Go to a project

Authored by zhangwenxue
Commit 232ca80b7d544bc2ceab0553b18f4e6186144de9 1 parent 6aa7f332

商品详情: 调整UI

Inline Side-by-side
Showing 1 changed file with 10 additions and 13 deletions
... ... @@ -12,7 +12,7 @@
</cube-slide-item>
<template slot="dots" slot-scope="props">
<div class="dot-wrap">
<span class="dot" :class="{active: props.current === index}" v-for="(item, index) in props.dots">&bull;</span>
<span class="cube-dot" :class="{active: props.current === index}" v-for="(item, index) in props.dots">&bull;</span>
</div>
</template>
</cube-slide>
... ... @@ -31,14 +31,14 @@
</a>
<div class="info">
<transition-group name="info-list" tag="div" class="info-list">
<div class="info-list-item" transtion="fade" v-if="activity && activity.length !== 0" @click="showActivity" key="promotion">
<div class="info-list-item" transtion="fade" v-if="activity && activity.length !== 0" @click="showActivity" key="促销">
<div class="info-list-name">促销</div>
<div class="info-list-value info-promote">
<span>{{activity[0].promotionTypeStr}}</span>
<i class="cubeic-arrow"></i>
</div>
</div>
<div class="info-list-item" v-for="(desc, index) in productDec" :key="index">
<div class="info-list-item" v-for="desc in productDec" :key="desc.text">
<div class="info-list-name">{{desc.text}}</div>
<div class="info-list-value">{{desc.value}}</div>
</div>
... ... @@ -485,20 +485,17 @@ export default {
padding-bottom: 10px;
}
.dot {
.cube-dot {
display: inline-block;
width: 8px;
height: 8px;
width: 6px;
height: 6px;
margin: 0 10px;
background: radial-gradient(8px 8px at 50% 50%, rgba(0, 0, 0, 0.15) 50%, transparent 50%) no-repeat;
background: rgba(0, 0, 0, 0.15);
border-radius: 50%;
&.active {
/*margin: 2px 10px 0;*/
/*width: 12px;*/
/*height: 12px;*/
transform-origin: 50% 50%;
transform: scale(1.5);
background: radial-gradient(8px 8px at 50% 50%, rgba(0, 0, 0, 1) 50%, transparent 50%) no-repeat;
transform: scale(1.3333);
background: rgba(0, 0, 0, 1);
}
}
... ...