|
@@ -5,7 +5,7 @@
|
|
|
<u-search
|
|
|
v-model="searchForm.keyword"
|
|
|
:clearabled="true"
|
|
|
- bg-color="#E5E5E5"
|
|
|
+ bg-color="#FFFFFF"
|
|
|
:input-style="searchInputStyle"
|
|
|
placeholder="搜索您想要的内容"
|
|
|
@search="onSearchConfirm"
|
|
@@ -66,7 +66,7 @@
|
|
|
import { query } from '@/api/collect.js'
|
|
|
|
|
|
const searchInputStyle = {
|
|
|
- backgroundColor: '#E5E5E5'
|
|
|
+ backgroundColor: '#FFFFFF'
|
|
|
}
|
|
|
const searchType = [
|
|
|
{
|
|
@@ -207,21 +207,29 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+ $certificate-width: 220rpx;
|
|
|
+ $certificate-height: 300rpx;
|
|
|
.container {
|
|
|
height: 100vh;
|
|
|
width: 100vw;
|
|
|
- background-color: $uni-text-color-inverse;
|
|
|
+ background: rgb(141, 204, 255);
|
|
|
+ background: -moz-linear-gradient( 90deg, rgb(141, 204, 255) 10%, rgb(247, 247, 247) 30%);
|
|
|
+ background: -webkit-linear-gradient(90deg, rgb(141, 204, 255) 10%, rgb(247, 247, 247) 30%);
|
|
|
+ background: -o-linear-gradient( 90deg, rgb(141, 204, 255) 10%, rgb(247, 247, 247) 30%);
|
|
|
+ background: -ms-linear-gradient( 90deg, rgb(141, 204, 255) 10%, rgb(247, 247, 247) 30%);
|
|
|
+ background: linear-gradient( 180deg, rgb(141, 204, 255) 10%, rgb(247, 247, 247) 30%);
|
|
|
padding: 0 20rpx;
|
|
|
|
|
|
.header-box {
|
|
|
- background-color: $uni-text-color-inverse;
|
|
|
+ // background-color: $uni-text-color-inverse;
|
|
|
+ padding-top: 40rpx;
|
|
|
@include topMagnet();
|
|
|
}
|
|
|
|
|
|
.search-box {
|
|
|
margin-bottom: 20rpx;
|
|
|
::v-deep(.u-search) {
|
|
|
- background-color: #e5e5e5;
|
|
|
+ background-color: #FFFFFF;
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
.u-action {
|
|
@@ -240,9 +248,14 @@
|
|
|
|
|
|
.list-box {
|
|
|
.list-item-box {
|
|
|
- padding: 20rpx 10rpx;
|
|
|
- border-bottom: 5rpx solid #E6E6E6;
|
|
|
+ // padding: 20rpx 10rpx;
|
|
|
+ // border-bottom: 5rpx solid #E6E6E6;
|
|
|
display: flex;
|
|
|
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ padding: 40rpx 20rpx;
|
|
|
+ margin: 35rpx 0;
|
|
|
&:active {
|
|
|
background-color: $uni-bg-color-hover;
|
|
|
}
|
|
@@ -259,19 +272,20 @@
|
|
|
.info-box {
|
|
|
width: 82%;
|
|
|
.title {
|
|
|
- font-size: $uni-title-font-size-2;
|
|
|
+ font-size: 28rpx;
|
|
|
font-weight: bold;
|
|
|
margin-bottom: 5rpx;
|
|
|
@include text-overflow()
|
|
|
}
|
|
|
.text {
|
|
|
line-height: 40rpx;
|
|
|
- font-size: $uni-font-size-2;
|
|
|
+ font-size: 24rpx;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
}
|
|
|
.suffix-box {
|
|
|
- width: 15%;
|
|
|
+ // width: 15%;
|
|
|
+ flex: 0 0 auto;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
@@ -281,7 +295,8 @@
|
|
|
padding: 5rpx 18rpx;
|
|
|
border-radius: $uni-card-border-radius;
|
|
|
background-color: $uni-color-primary;
|
|
|
- font-size: $uni-font-size-3;
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin: 0 10rpx;
|
|
|
letter-spacing: 3rpx;
|
|
|
}
|
|
|
}
|