<style scoped>
.card {
  width: 380px;
  height: 139px;
  padding: 20px;
  border: 1px solid #f0efef;
  border-radius: 8px;
}
.number {
  font-size: 56px;
  font-weight: bold;
  color: #2d90ff;
  line-height: 42px;
}
.avator {width: 34px;
height: 34px;
background: #000000;
border-radius: 50%;}
</style>
<template>
  <div class="card">
    <div class="flex">
      <div>
        <span class="number">4.5</span>
        <span>/5</span>
      </div>
      <div class="ml">
        <star :value="4"></star>
        <span>
          <span class="f16">超讚</span>
          <span>200+條評價</span>
        </span>
      </div>
    </div>
    <div class="flex mt">
        <img
            class="avator"
            src="https://imgfile.oytour.com/Upload/DMC/202110131151571540000000139.jpeg"
          />
          <div class="ml f12">
            <div>昵称</div>
            <div class="ellipsis">评论内容</div>
          </div>
    </div>
  </div>
</template>
<script>
import star from "./star.vue";
export default {
  components: { star },
  data() {
    return {};
  },
};
</script>
