answer-dialogue.vue 1.2 KB
<template>
  <view class="response-group inquire-group">
    <view class="dialogue answer-inner">
      <view class="top answer-name">我的名字</view>
      <view class="answer-dialogue">您好,请问怎么提高访问量?</view>
    </view>
    <image class="avatar" style="margin-right: 0;" src="/static/images/useCoupon.png"></image>
  </view>
</template>

<script setup>
  import { onLoad } from '@dcloudio/uni-app'
  onLoad(() => {

  })
</script>

<style lang="scss">
  .inquire-group {
    @include flex();

    .avatar {
      @include common-icon-wh(96rpx);
      margin-right: 20rpx;
    }

    .dialogue {
      .top {
        font-size: 24rpx;
      }

      .inquire {
        width: 462rpx;
        padding: 32rpx;
        margin-top: 8rpx;
        box-sizing: border-box;
        border-radius: 0 16rpx 16rpx 16rpx;
        background: #242228ff;
      }
    }
  }

  .response-group {
    .answer-inner {
      margin-left: auto;

      .answer-name {
        text-align: right;
      }
    }

    .answer-dialogue {
      width: 416rpx;
      padding: 32rpx;
      margin-top: 8rpx;
      box-sizing: border-box;
      border-radius: 16rpx 0 16rpx 16rpx;
      background: #dda372ff;
    }
  }
</style>