appealCard.vue 744 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <template>
  2. <div class="otherAppeal">
  3. <div class="title">
  4. {{ otherAppeal.title }}
  5. </div>
  6. <div class="details">
  7. <img :src="otherAppeal.image" class="icon" />
  8. <span class="name">{{ otherAppeal.name }}</span
  9. >:
  10. <span class="msg">{{ otherAppeal.msg }}</span>
  11. </div>
  12. </div>
  13. </template>
  14. <script>
  15. export default {
  16. props:['otherAppeal']
  17. }
  18. </script>
  19. <style lang="scss" scoped>
  20. .otherAppeal {
  21. margin: 5% 9%;
  22. .title {
  23. margin-bottom: 5%;
  24. font-size: 35rpx;
  25. }
  26. .details {
  27. .name {
  28. font-size: 30rpx;
  29. color: red;
  30. }
  31. .msg {
  32. font-size: 30rpx;
  33. }
  34. .icon {
  35. width: 60rpx;
  36. height: 60rpx;
  37. position: absolute;
  38. left: 1%;
  39. }
  40. }
  41. }
  42. </style>