fix(用例评审): 修复评论换行不生效的问题

This commit is contained in:
shiziyuan9527 2020-09-27 16:24:27 +08:00
parent 0b5b55e76c
commit 72b2a2784c
1 changed files with 42 additions and 36 deletions

View File

@ -2,16 +2,18 @@
<div class="main"> <div class="main">
<div class="comment-left"> <div class="comment-left">
<div class="icon-title"> <div class="icon-title">
{{comment.author.substring(0,1)}} {{ comment.author.substring(0, 1) }}
</div> </div>
</div> </div>
<div class="comment-right"> <div class="comment-right">
<span style="font-size: 14px;color: #909399;font-weight: bold">{{comment.author}}</span> <span style="font-size: 14px;color: #909399;font-weight: bold">{{ comment.author }}</span>
<span style="color: #8a8b8d; margin-left: 8px; font-size: 12px"> <span style="color: #8a8b8d; margin-left: 8px; font-size: 12px">
{{comment.createTime | timestampFormatDate}} {{ comment.createTime | timestampFormatDate }}
</span> </span>
<br/> <br/>
<div class="comment-desc" style="font-size: 10px;color: #303133">{{comment.description}}</div> <div class="comment-desc" style="font-size: 10px;color: #303133">
<pre>{{ comment.description }}</pre>
</div>
</div> </div>
</div> </div>
</template> </template>
@ -29,41 +31,45 @@ export default {
</script> </script>
<style scoped> <style scoped>
.main { .main {
overflow-y: scroll; overflow-y: scroll;
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 10px; margin-top: 10px;
} }
.comment-left { .comment-left {
float: left; float: left;
width: 50px; width: 50px;
height: 100%; height: 100%;
} }
.comment-right { .comment-right {
float: left; float: left;
width: 90%; width: 90%;
padding: 0; padding: 0;
line-height: 25px; line-height: 25px;
} }
.icon-title { .icon-title {
color: #fff; color: #fff;
width: 30px; width: 30px;
background-color: #72dc91; background-color: #72dc91;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
text-align: center; text-align: center;
border-radius: 30px; border-radius: 30px;
font-size: 14px; font-size: 14px;
} }
.comment-desc { .comment-desc {
overflow-wrap: break-word; overflow-wrap: break-word;
word-break: break-all; word-break: break-all;
border-bottom: 1px solid #ced3de; border-bottom: 1px solid #ced3de;
} }
pre {
margin: 0 0;
}
</style> </style>