itemCard.wxss 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. .card{
  2. display: flex;
  3. flex-direction: column;
  4. width: 700rpx;
  5. margin-top: 60rpx;
  6. background-color: #ffffff;
  7. border-radius: 28rpx;
  8. box-shadow: 5rpx 5rpx 8rpx 0rpx rgba(0,0,0,0.16);
  9. }
  10. .avatar-name{
  11. display: flex;
  12. flex-direction: row;
  13. }
  14. .publisher-avatar{
  15. width: 50rpx;
  16. height: 50rpx;
  17. border-radius: 30rpx;
  18. margin-left: 10rpx;
  19. z-index: 2;
  20. border-color: #9E9E9E;
  21. border-style: solid;
  22. border-width: 2rpx;
  23. background-color: #ffffff;
  24. }
  25. .profile{
  26. display: flex;
  27. flex-direction: row;
  28. justify-content: space-between;
  29. position: relative;
  30. top: -20rpx;
  31. margin-right: 10rpx;
  32. }
  33. .publisher-name{
  34. font-size: 24rpx;
  35. align-self: center;
  36. background-color: #ffffff;
  37. padding:5rpx 20rpx 5rpx 30rpx;
  38. margin-left: -20rpx;
  39. border-radius: 22rpx;
  40. box-shadow: 5rpx 5rpx 8rpx 0rpx rgba(0,0,0,0.16);
  41. z-index: 1;
  42. }
  43. .time{
  44. font-size: 16rpx;
  45. }
  46. .activity-attribute{
  47. font-size: 24rpx;
  48. align-self: center;
  49. padding-top: 5rpx;
  50. padding-bottom: 5rpx;
  51. padding-right: 20rpx;
  52. padding-left: 20rpx;
  53. border-radius: 28rpx;
  54. box-shadow: 5rpx 5rpx 8rpx 0rpx rgba(0,0,0,0.16);
  55. }
  56. .title{
  57. font-size: 28rpx;
  58. }
  59. .title-time{
  60. margin-left: 50rpx;
  61. margin-right: 30rpx;
  62. margin-bottom: 20rpx;
  63. display: flex;
  64. flex-direction: row;
  65. justify-content: space-between;
  66. align-items: flex-end;
  67. }
  68. .sub-title{
  69. font-size: 24rpx;
  70. margin-left: 50rpx;
  71. margin-bottom: 20rpx;
  72. margin-right: 20rpx;
  73. }
  74. .bottom-line{
  75. display: flex;
  76. flex-direction: row;
  77. justify-content: space-between;
  78. margin: 10rpx 10rpx 30rpx 10rpx;
  79. }
  80. .to-detail{
  81. display: flex;
  82. flex-direction: row;
  83. align-items: center;
  84. }
  85. .arrow{
  86. height: 20rpx;
  87. width: 20rpx;
  88. margin: 0rpx 20rpx 0rpx 20rpx;
  89. }