diff --git a/pages/talkBook/talkBookDetail.vue b/pages/talkBook/talkBookDetail.vue index 17696d3..b7da3d5 100644 --- a/pages/talkBook/talkBookDetail.vue +++ b/pages/talkBook/talkBookDetail.vue @@ -11,13 +11,16 @@ - - + + {{talkBookDetail.title}} {{bookInfo.author.authorName}} {{currentTime+'/'+duration}}秒 - + @@ -25,8 +28,21 @@ - + + + {{talkBookDetail.createTime}} + + + + {{contlike}} + + {{pTotal}} +

觉得这本书还不错?

@@ -52,14 +68,77 @@ 下一章
-->
+ + + + + + + + + {{item.user.nickName}} + 匿名用户 + + + + {{formatTimeDifferenceFromT(item.createTime)}} + 删除 + + + + + + + 暂无评论内容~ + + + + + 努力加载中 + + + + + + + 添加评论 + + + + + + + + + 提交 + + + + + + + + + + + - + @@ -291,6 +712,9 @@ .btn { margin-right: 20rpx; + font-size: 22rpx; + justify-content: space-between; + align-items: center; text { display: inline-block; @@ -302,43 +726,213 @@ border-radius: 5px; } } - // 自定义播放器样式 - .audiobox{ - border: 2rpx solid #d6d5d5; - border-radius: 8px; - .audioinfo{ + + + .zanche { + font-size: 22rpx; + justify-content: space-between; + align-items: center; + + .left { + width: 300rpx; + color: #999; + font-size: 24rpx; + } + + .right { + width: 300rpx; display: flex; - .audioimg{ + justify-content: flex-end; + align-items: center; + } + + .gzicon { + margin: 0 0 0 20rpx; + height: 40rpx; + width: 40rpx; + // float:left; + // border-radius: 20rpx; + // border:1rpx solid #e9e9e9; + } + + .opbtns { + .pingjia { + margin-left: 10px; + } + } + } + + // 自定义播放器样式 + .audiobox { + border: 2rpx solid #d6d5d5; + border-radius: 8px; + + .audioinfo { + display: flex; + + .audioimg { padding: 10rpx; width: 180rpx; height: 220rpx; border-radius: 5px; } - .audioimgstart{ + + .audioimgstart { position: absolute; padding: 20rpx; width: 180rpx; height: 220rpx; border-radius: 5px; } - .audiotitle{ + + .audiotitle { padding: 10rpx; font-size: 28rpx; text-align: left; } - .audioauthor{ + + .audioauthor { padding: 4rpx; font-size: 24rpx; text-align: left; color: #999; } - .audioslider{ + + .audioslider { width: 400rpx; } } - - + + } // .opbtn{font-size: 14rpx;} + .pinglunMain { + .pl-item { + margin: 0 0 14rpx 0; + padding: 0 0 14rpx 0; + border-bottom: 1px solid #f0f0f0; + + .condelt { + color: #fd6004; + } + + } + + .plusername { + font-size: 26rpx; + color: #a1a1a1; + image{ + width: 40rpx; + height: 40rpx; + border-radius: 20rpx; + display: inline-block; + margin-right: 15rpx; + vertical-align: sub; + } + } + + .content { + margin: 30rpx 0rpx; + line-height: 40rpx; + color: #000; + font-size: 30rpx; + } + + background-color: #fff; + padding: 10px; + + // h4{color: #55aa00; font-size: 40rpx; margin:30rpx 0 ; text-align: center;} + .time { + color: #888; + font-size: 24rpx; + } + + .btns { + font-size: 22rpx; + // justify-content: space-between; + align-items: center; + + .left { + // width: 300rpx; + margin-right: 20rpx; + color: #a1a1a1; + } + + .right { + width: 300rpx; + display: flex; + justify-content: flex-end; + align-items: center; + } + + .gzicon { + margin: 0 0 0 20rpx; + height: 40rpx; + width: 40rpx; + // float:left; + // border-radius: 20rpx; + // border:1rpx solid #e9e9e9; + } + + .opbtns { + .pingjia { + margin-left: 10px; + } + } + } + + } + + .quesheng { + text-align: center; + color: #8b8a91; + padding-bottom: 20rpx; + padding-top: 20rpx; + } + + .tanchu { + padding: 40rpx 30rpx 40rpx 30rpx; + position: relative; + + + .dp_title { + font-size: 32rpx; + margin-bottom: 50rpx; + color: #555; + text-align: center; + font-weight: bold; + } + + .dp_add { + position: absolute; + top: 40rpx; + right: 30rpx; + font-size: 22rpx; + background-color: #fd6004; + color: #fff; + border-radius: 10rpx; + padding: 5rpx 10rpx; + + .u-icon { + display: inline-block; + margin-right: 5rpx; + } + } + } + + .cuIcon-emoji { + background: url(../../static/biaoqing.png) no-repeat; + background-size: contain; + display: block; + margin-right: 20rpx; + width: 30px; + } + + .cuIcon-keyboard { + background: url(../../static/biaoqing.png) no-repeat; + background-size: contain; + display: block; + width: 30px; + } \ No newline at end of file