zm/nuttyreading-html
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

页面美化+接口更新

Browse Source
This commit is contained in:
@fawn-nine
2023-09-19 17:58:35 +08:00
parent 8787e14e68
commit 2eda927c44
9 changed files with 486 additions and 460 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
pages/library/library.vue
View File

@@ -3,25 +3,27 @@
<!-- 公共组件-每个页面必须引入 -->
<!-- <public-module></public-module> -->
<!-- <z-nav-bar title="我的图书"></z-nav-bar> -->
<view class="home_bg " >
<view class="flexbox" style=" justify-content: space-between; ">
<view class="home_bg">
<view class="" style=" ">
<view class="icon_hua">
<image src="../../static/icon/home_icon_3.png" mode="aspectFit" class="icon_hua_1"></image>
</view>
<view class="search_box flexbox" @click="onPageJump('../peanut/searchFor')">
</view>
<view class="hehan">
<image src="../../static/icon/hehan.png" mode="aspectFit" class="icon_hua_1"></image>
</view>
<view class="search_box flexbox" @click="onPageJump('./searchFor')">
<view class="search">
<text class="icon_search"></text>
<text class="prompt">请输入想要搜索的书名</text>
</view>
</view>
<view class="searBtn flexbox">
<!-- <view class="searBtn flexbox">
<text>搜索</text>
</view>
</view>
<view class="home_lunbo">
<u-swiper :list="list3" indicator indicatorMode="line" circular style="height: 180rpx;"></u-swiper>
</view>
</view> -->
</view>
<!-- <view class="home_lunbo">
<u-swiper :list="list3" indicator indicatorMode="line" circular style="height: 180rpx;"></u-swiper>
</view> -->
</view>
<!-- <view class="contentButton">
<u-tabs :scrollable="false" bg-color="#d4d4d4" active-color="#2979ff" inactive-color="#606266" bar-height="10" :list="contentButtonList" @click="contentButtonClick" lineWidth="42" :inactiveStyle="{fontSize:'32rpx'}" :activeStyle="{color: '#303133',fontWeight: 'bold', transform: 'scale(1.01)'}"></u-tabs>
@@ -109,9 +111,9 @@
<u-divider text="全部加载完成"></u-divider>
</view>
</view>
<view class="shuwuLink">
<!-- <view class="shuwuLink">
<image @click="" src="../../static/icon/shuwu.jpg" mode="aspectFit"></image>
</view>
</view> -->
<music-play :playData="playData"></music-play>
<z-navigation></z-navigation>
</view>
@@ -431,49 +433,52 @@
}
}
.home_bg {
background-image: url('@/static/icon/home_bg1.jpg');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
padding: 100rpx 20rpx 40rpx 20rpx;
position: relative;
height: 400rpx; margin-bottom: 130rpx;
.icon_hua_1 {
// margin: 0 auto;
width: 150rpx;
height: 150rpx;
}
.icon_hua{width: 150rpx; display: block;}
.search_box { margin-top: 20rpx; align-items: center;
width: calc(100% - 300rpx);
.search{height: 80upx;
display: flex;
width: 100%;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;
border-radius: 20upx;
box-shadow: 0 0px 10px 1px #54a96633;
background-image: url('@/static/icon/home_bg.jpg');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
padding: 20rpx;
position: relative; margin-bottom:60rpx;
// height: 400rpx; margin-bottom: 130rpx;
.icon_hua_1 {
// margin: 0 auto;
width: 100%; text-align: center;
height: 150rpx;
image{width: 150rpx; height: 150rpx;}
}
.prompt {
color: #838383; font-size: 24rpx;
.icon_hua{width: 100%; text-align: center; display: block;
image{width: 150rpx; height: 150rpx; margin: 0 auto;}
}
.icon_search {
background-image: url('@/static/icon/map_ic_search.png');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width:36upx;
height: 36upx;
margin-right: 20upx;
.search_box { margin: 0 auto; margin-top: 20rpx; align-items: center;
width: calc(100% - 30rpx); margin-bottom: -52rpx;
.search{height: 80upx;
display: flex;
width: 100%;
align-items: center;
padding: 0upx 40upx;
background-color: #fff;
border-radius: 20upx;
box-shadow: 0 0px 10px 1px #54a96633;
}
.prompt {
color: #838383; font-size: 24rpx;
}
.icon_search {
background-image: url('@/static/icon/map_ic_search.png');
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width:36upx;
height: 36upx;
margin-right: 20upx;
}
}
.searBtn{
width: 80rpx; align-items: center;
font-size: 30rpx; color: #fff;
}
}
.searBtn{
width: 80rpx; align-items: center;
font-size: 30rpx; color: #fff;
}
}
</style>