partyItem.wxss 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. /* component/roomItem/roomItem.wxss */
  2. .tj_listItem {
  3. display: flex;
  4. align-items: flex-start;
  5. justify-content: flex-start;
  6. padding: 20rpx 0;
  7. border-bottom: 2rpx solid #EDEDED;
  8. background: #fff;
  9. }
  10. .tj_listItem .tj_listItemCover {
  11. /* width: 210rpx;
  12. height: 210rpx; */
  13. width: 160rpx;
  14. height: 160rpx;
  15. border-radius: 8px;
  16. overflow: hidden;
  17. }
  18. .tj_listItem .tj_listItemCover .coverImage {
  19. /* width: 210rpx;
  20. height: 210rpx; */
  21. width: 160rpx;
  22. height: 160rpx;
  23. }
  24. .tj_listItemMsg {
  25. width: calc(100% - 180rpx);
  26. margin-left: 20rpx;
  27. /* padding-top: 10rpx;
  28. box-sizing: border-box; */
  29. }
  30. .tj_listItemMsg .tj_listItemTitle {
  31. font-size: 28rpx;
  32. color: #333;
  33. line-height: 40rpx;
  34. font-weight: bold;
  35. overflow: hidden;
  36. text-overflow: ellipsis;
  37. display: -webkit-box;
  38. -webkit-line-clamp: 2;
  39. -webkit-box-orient: vertical;
  40. height: 100rpx
  41. }
  42. .tj_listItemMsg .tj_listItemTip {
  43. display: flex;
  44. align-items: center;
  45. height: 28rpx;
  46. margin: 10rpx 0 10rpx;
  47. }
  48. .tj_listItemMsg .tj_listItemTip .tj_listItemTipText {
  49. font-size: 24rpx;
  50. color: #666;
  51. overflow: hidden;
  52. text-overflow: ellipsis;
  53. display: flex;
  54. flex-direction: row;
  55. flex-wrap: nowrap;
  56. line-height: 36rpx;
  57. padding-top: 10px;
  58. }
  59. .tj_listItemTipText .label {
  60. color: #0075DC;
  61. display: inline-block;
  62. background-color: rgba(0, 117, 220, 0.2);
  63. padding: 5rpx 8rpx;
  64. border-radius: 2rpx;
  65. }
  66. .tj_listItemMsg .tj_listItemTag {
  67. display: flex;
  68. align-items: center;
  69. margin: 14rpx 0 24rpx 0;
  70. }
  71. .tj_listItemMsg .tj_listItemTag .tagItem {
  72. font-size: 20rpx;
  73. color: #0075DC;
  74. padding: 2rpx 8rpx;
  75. background: rgba(0, 117, 220, 0.2);
  76. border-radius: 4rpx;
  77. margin-right: 8rpx;
  78. display: flex;
  79. align-items: center;
  80. justify-content: center;
  81. border-radius: 4rpx;
  82. }
  83. .tj_listItemMsg .tj_listItemTag .tagVr {
  84. position: relative;
  85. display: flex;
  86. align-items: center;
  87. justify-content: center;
  88. margin-right: 8rpx;
  89. width: 104rpx;
  90. height: 32rpx;
  91. border: 1px solid #0075DC;
  92. box-sizing: border-box;
  93. border-radius: 4rpx;
  94. }
  95. .tj_listItemMsg .tj_listItemTag .tagVr .tagItemIcon {
  96. background: #0075DC;
  97. width: 52rpx;
  98. height: 32rpx;
  99. display: flex;
  100. align-items: center;
  101. justify-content: center;
  102. }
  103. .tj_listItemMsg .tj_listItemTag .tagVr .tagItemIcon .tagItemIconImage {
  104. width: 28rpx;
  105. height: 18rpx;
  106. }
  107. .tj_listItemMsg .tj_listItemTag .tagVr .tip {
  108. width: 52rpx;
  109. height: 32rpx;
  110. color: #0075DC;
  111. display: flex;
  112. align-items: center;
  113. justify-content: center;
  114. /* padding: 2rpx 8rpx; */
  115. background: rgba(0, 117, 220, 0.2);
  116. font-size: 20rpx;
  117. }
  118. .tj_listItemMsg .tj_listItemPrice {
  119. display: flex;
  120. align-items: center;
  121. height: 28rpx;
  122. justify-content: space-between;
  123. }
  124. .tj_listItemMsg .tj_listItemPrice .unitPrice {
  125. font-size: 20rpx;
  126. color: #666;
  127. }
  128. .tj_listItemMsg .tj_listItemPrice .totalPrice {
  129. font-size: 28rpx;
  130. color: #0075DC;
  131. font-weight: bold;
  132. }