myCollection.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <template>
  2. <div class="myCollection">
  3. <div class="collItem" v-for="item in 5">
  4. <span class="collType">【园区通知】</span>
  5. <span class="collTheme">主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题主题</span>
  6. <span class="collTime">2024-04-25 09:00</span>
  7. </div>
  8. </div>
  9. </template>
  10. <script>
  11. export default {
  12. name: "myCollection"
  13. }
  14. </script>
  15. <style lang="scss">
  16. .myCollection{
  17. padding: 12rpx 0 50rpx 0;
  18. .collItem{
  19. width: 686rpx;
  20. margin: 24rpx 32rpx;
  21. background: white;
  22. border-radius: 16rpx;
  23. display: flex;
  24. flex-direction: column;
  25. padding: 32rpx 32rpx;
  26. box-sizing: border-box;
  27. .collType{
  28. color: rgba(3, 101, 249, 1);
  29. font-size: 28rpx;
  30. }
  31. .collTheme{
  32. color: rgba(51, 51, 51, 1);
  33. font-size: 28rpx;
  34. line-height: 42rpx;
  35. display: flex;
  36. flex-wrap: wrap;
  37. margin: 16rpx 0;
  38. }
  39. .collTime{
  40. color:rgba(102, 102, 102, 1);
  41. font-size: 28rpx;
  42. }
  43. }
  44. }
  45. </style>