card.wxss 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. .tui-card {
  2. margin: 0 30rpx;
  3. font-size: 28rpx;
  4. background: #fff;
  5. border-radius: 10rpx;
  6. box-shadow: 0 0 10rpx #eee;
  7. box-sizing: border-box;
  8. overflow: hidden;
  9. }
  10. .tui-card-full{
  11. margin: 0 !important;
  12. border-radius: 0 !important;
  13. }
  14. .tui-card-full::after{
  15. border-radius: 0 !important;
  16. }
  17. .tui-card-border {
  18. position: relative;
  19. box-shadow: none !important
  20. }
  21. .tui-card-border::after {
  22. content: ' ';
  23. position: absolute;
  24. height: 200%;
  25. width: 200%;
  26. border: 1px solid #ddd;
  27. transform-origin: 0 0;
  28. -webkit-transform-origin: 0 0;
  29. -webkit-transform: scale(0.5);
  30. transform: scale(0.5);
  31. left: 0;
  32. top: 0;
  33. border-radius: 20rpx;
  34. box-sizing: border-box;
  35. }
  36. .tui-card-header {
  37. width: 100%;
  38. padding: 20rpx;
  39. display: flex;
  40. align-items: center;
  41. justify-content: space-between;
  42. position: relative;
  43. box-sizing: border-box;
  44. overflow: hidden;
  45. border-top-left-radius: 10rpx;
  46. border-top-right-radius: 10rpx;
  47. }
  48. .tui-card-header::after {
  49. content: '';
  50. position: absolute;
  51. border-bottom: 1rpx solid #eaeef1;
  52. -webkit-transform: scaleY(0.5);
  53. transform: scaleY(0.5);
  54. bottom: 0;
  55. right: 0;
  56. left: 0;
  57. }
  58. .tui-header-line::after {
  59. border-bottom: 0 !important;
  60. }
  61. .tui-header-thumb {
  62. height: 60rpx;
  63. width: 60rpx;
  64. vertical-align: middle;
  65. margin-right: 20rpx;
  66. border-radius: 6rpx;
  67. }
  68. .tui-thumb-circle {
  69. border-radius: 50% !important;
  70. }
  71. .tui-header-title {
  72. display: inline-block;
  73. font-size: 30rpx;
  74. color: #7a7a7a;
  75. vertical-align: middle;
  76. max-width: 460rpx;
  77. overflow: hidden;
  78. white-space: nowrap;
  79. text-overflow: ellipsis;
  80. }
  81. .tui-header-right {
  82. font-size: 24rpx;
  83. color: #b2b2b2;
  84. }
  85. .tui-card-body {
  86. font-size: 32rpx;
  87. color: #262b3a;
  88. box-sizing: border-box;
  89. }
  90. .tui-card-footer {
  91. font-size: 28rpx;
  92. color: #596d96;
  93. border-bottom-left-radius: 10rpx;
  94. border-bottom-right-radius: 10rpx;
  95. box-sizing: border-box;
  96. }