This commit is contained in:
yulixing 2019-11-27 21:12:44 +08:00
parent 7e478003f5
commit 4725567f23
5 changed files with 37 additions and 34 deletions

View File

@ -12,8 +12,10 @@
<div class="card-hd">{{maker.title}}</div>
<div class="card-bd">
<div class="card-cont">{{maker.desc}}</div>
<input class="card-ipt" placeholder="输入一个名称" type="text" v-model="users" />
<div class="card-ipt-tip">输入名称物品或任何文字</div>
<div class="card-ipt-wrap">
<input class="card-ipt" placeholder="输入想要测试的名字" type="text" v-model="users" />
<div class="card-ipt-tip">可输入任何文字</div>
</div>
<div @click="getResult" class="card-btn">GO</div>
</div>
</div>
@ -23,8 +25,8 @@
<div class="sec-2">
<div class="list">
<div class="list-hd">
<div class="l">大家都在</div>
<div @click="goList" class="r">more>></div>
<div class="l">大家都在</div>
<div @click="goList" class="r">更多>></div>
</div>
<div class="list-bd">
<list-item :data="item" :key="index" v-for="(item, index) in hotList"></list-item>
@ -150,14 +152,19 @@ export default {
text-indent: 2em;
}
}
.card-ipt {
height: 42rpx;
color: #333;
border-bottom: 1px solid #333;
}
.card-ipt-wrap {
width: 70%;
margin: 24rpx auto;
.card-ipt {
margin-bottom: 10rpx;
height: 48rpx;
color: #333;
border-bottom: 1px solid #333;
}
.card-ipt-tip {
font-size: 24rpx;
.card-ipt-tip {
font-size: 24rpx;
}
}
.card-btn {
@ -188,7 +195,6 @@ export default {
.list {
background-color: #fff;
border: 4rpx solid #ffdc34;
border-radius: 16rpx;
.list-hd {
display: flex;
justify-content: space-between;

View File

@ -14,8 +14,8 @@
<div class="wrap">
<div class="title">
<div class="l">
<span class="color-white">热门</span>
<span>精选</span>
<span class="color-white">精选</span>
<span>推荐</span>
</div>
<div @click="changeRecommand" class="r">
<image
@ -37,9 +37,9 @@
<div class="sec-2" v-if="listData.length > 0">
<div class="title">
<div class="l">
<span class="color-yellow">HOT</span>NEW
<span class="color-yellow">测试</span>排行
</div>
<div @click="goList" class="color-yellow more">more>></div>
<div @click="goList" class="color-yellow more">更多>></div>
</div>
<div class="list">
<div class="list-hd">
@ -206,7 +206,7 @@ export default {
position: relative;
height: 300rpx;
margin: 0 auto;
padding: 60rpx 32rpx;
padding: 60rpx 32rpx 80rpx;
background-color: #fffdf5;
border: 4px solid #ffdc34;
}
@ -225,10 +225,10 @@ export default {
.r {
position: absolute;
padding: 8rpx;
height: 32rpx;
width: 32rpx;
right: -20rpx;
top: -20rpx;
height: 36rpx;
width: 36rpx;
right: -26rpx;
top: -26rpx;
font-size: 0;
background-color: #ffdc34;
border-radius: 50%;
@ -258,11 +258,12 @@ export default {
position: absolute;
right: 32rpx;
bottom: 32rpx;
width: 96rpx;
height: 96rpx;
width: 108rpx;
height: 108rpx;
color: #fff;
font-size: 36rpx;
font-weight: 700;
line-height: 96rpx;
line-height: 108rpx;
text-align: center;
background: linear-gradient(
0deg,
@ -291,7 +292,6 @@ export default {
.list {
background-color: #fff;
border: 4rpx solid #ffdc34;
border-radius: 16rpx;
.list-hd {
display: flex;
justify-content: space-between;

View File

@ -160,7 +160,6 @@ export default {
.sec-2 {
margin: 60rpx 0 60rpx;
border: 4rpx solid #ffdc34;
border-radius: 16rpx;
background-color: #fff;
.list-hd {
height: 80rpx;

View File

@ -49,8 +49,8 @@
<div class="sec-2">
<div class="list">
<div class="list-hd">
<div class="l">大家都在</div>
<div @click="goList" class="r">more>></div>
<div class="l">大家都在</div>
<div @click="goList" class="r">更多>></div>
</div>
<div class="list-bd">
<list-item :data="item" :key="index" v-for="(item, index) in hotList"></list-item>
@ -311,7 +311,6 @@ export default {
.list {
background-color: #fff;
border: 4rpx solid #ffdc34;
border-radius: 16rpx;
.list-hd {
display: flex;
justify-content: space-between;

View File

@ -162,10 +162,10 @@ export default {
.del {
position: absolute;
padding: 8rpx;
height: 32rpx;
width: 32rpx;
right: -20rpx;
top: -20rpx;
height: 36rpx;
width: 36rpx;
right: -24rpx;
top: -24rpx;
font-size: 0;
background-color: #ffdc34;
border-radius: 50%;
@ -209,7 +209,6 @@ export default {
.sec-3 {
margin: 0 0 80rpx;
border: 4rpx solid #ffdc34;
border-radius: 16rpx;
background-color: #fff;
.list-hd {
height: 80rpx;