Files
ZhHealth/pages/im/components/showText.nvue
2022-02-10 10:22:43 +08:00

55 lines
1.2 KiB
Plaintext

<template>
<view class="msg--text">
<text class="name" v-if="!guest && name">{{ name }}</text>
<text class="im--text" :class="guest ? 'right': 'left'">{{ msg.content }}</text>
</view>
</template>
<script>
export default {
name: 'showText',
props: {
msg: {
type: Object,
default: {}
},
name: {
type: String,
default: ''
},
guest: {
type: Boolean,
default: true
}
}
}
</script>
<style scoped lang="scss">
.msg--text {
.name {
font-size: 24rpx;
line-height: 34rpx;
color: $text-gray-m;
}
.im--text {
max-width: 500rpx;
padding: 20rpx;
line-height: 44rpx;
font-size: 32rpx;
&.left {
border-radius: 0 20rpx 20rpx 20rpx;
background: white;
}
&.right {
border-radius: 20rpx 0 20rpx 20rpx;
background: $main-color;
color: white;
}
}
}
</style>