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

音频样式bug修复

Browse Source
This commit is contained in:
@fawn-nine
2023-10-09 16:51:26 +08:00
parent c6bff04039
commit 04c821ff48
1 changed files with 55 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
pages/talkBook/talkBookDetail.vue
View File

@@ -4,8 +4,9 @@
<view class="mainContent">
<view class="title">{{talkBookDetail.title}}</view>
<view class="voices" v-if="talkBookDetail.voices != '' && audioShow">
<audio style="text-align: left" :src="talkBookDetail.voices" poster="../../static/icon/fengziIcon.jpg"
:name="talkBookDetail.title" :author="bookInfo.author.authorName" :action="audioAction" controls></audio>
<audio style="text-align: left; overflow: hidden;" :src="talkBookDetail.voices"
poster="../../static/icon/home_icon_0.png" :name="talkBookDetail.title"
:author="bookInfo.author.authorName" :action="audioAction" controls></audio>
</view>
<view class="content" v-if="talkBookDetail.content != ''" v-html="talkBookDetail.content"></view>
<view class="content" v-else></view>
@@ -14,7 +15,8 @@
</view>
<view class="tuijin" v-if="!isBuy && bookInfo.productId != null">
<p>觉得这本书还不错？</p>
<view class="flexbox" style="justify-content: space-between; border: 1px solid #55aa7f; padding: 10rpx; border-radius: 10rpx;">
<view class="flexbox"
style="justify-content: space-between; border: 1px solid #55aa7f; padding: 10rpx; border-radius: 10rpx;">
<view class="flexbox">
<view class="img">
<image v-if="bookInfo.images != ''" :src="bookInfo.images" mode="aspectFit"></image>
@@ -63,9 +65,11 @@
}
}, // 书籍信息
talkBookDetail: {},
windowWidth: 0,
}
},
onLoad(e) {
this.windowWidth = uni.getSystemInfoSync().windowWidth;
console.log(e, 'onLoad')
this.bookId = e.bookId
this.teachId = e.teachId
@@ -163,20 +167,31 @@
.voices {
margin: 10rpx auto;
text-align: center;
}
/deep/ .uni-audio-name {
// white-space: wrap !important;
width: 340rpx;
}
.title {
font-size: 30rpx;
color: #55aa7f;
font-weight: bold;
margin-bottom: 10px;
margin: 40rpx 0;
}
.time {
text-align: right; font-size: 24rpx; margin-top: 20rpx; color: #999;
text-align: right;
font-size: 24rpx;
margin-top: 20rpx;
color: #999;
}
.content {
font-size: 28rpx; text-align:justify;
font-size: 28rpx;
text-align: justify;
color: #666;
line-height: 48rpx;
}
@@ -198,15 +213,25 @@
}
p {
font-size: 28rpx; margin-bottom: 20rpx;
font-size: 28rpx;
margin-bottom: 20rpx;
color: #55aa7f;
}
}
.btn{ margin-right: 20rpx;
text{ display: inline-block; margin-top:52rpx; font-size: 30rpx;
.btn {
margin-right: 20rpx;
text {
display: inline-block;
margin-top: 52rpx;
font-size: 30rpx;
padding: 5px 8px;
background: #55aa7f; color: #fff;
background: #55aa7f;
color: #fff;
border-radius: 5px;
}}
}
}
// .opbtn{font-size: 14rpx;}
</style>