index.less 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. page {
  2. background: #f6f6f6;
  3. }
  4. .tabs {
  5. background: #ffffff;
  6. }
  7. .box {
  8. background: #ffffff;
  9. margin: 30rpx;
  10. padding: 30rpx;
  11. border-radius: 30rpx;
  12. .order-times {
  13. width: 100%;
  14. background: #FFFFFF;
  15. border: 1rpx solid #FFE300;
  16. border-radius: 30rpx;
  17. margin: 20rpx 0;
  18. display: flex;
  19. justify-content: space-between;
  20. padding: 10rpx 30rpx;
  21. .order-date {
  22. display: flex;
  23. .date {
  24. margin-right: 20rpx;
  25. }
  26. }
  27. .price {
  28. color: red;
  29. }
  30. }
  31. .order-number {
  32. display: flex;
  33. justify-content: space-between;
  34. .number {
  35. font-size: 30rpx;
  36. }
  37. .state {
  38. font-size: 30rpx;
  39. }
  40. }
  41. .order-txt {
  42. display: flex;
  43. margin: 20rpx 0rpx 0 0;
  44. .order-image {
  45. width: 240rpx;
  46. height: 180rpx;
  47. margin-right: 20rpx;
  48. }
  49. .order-text {
  50. margin-top: 5rpx;
  51. .order-name {
  52. overflow: hidden; //一定要写
  53. text-overflow: ellipsis; //超出省略号
  54. display: -webkit-box; //一定要写
  55. -webkit-line-clamp: 1; //控制行数
  56. -webkit-box-orient: vertical; //一定要写
  57. }
  58. .order-price {
  59. color: red;
  60. margin-top: 20rpx;
  61. }
  62. .order-time {
  63. margin-top: 20rpx;
  64. color: #666666;
  65. font-size: 26rpx;
  66. }
  67. }
  68. }
  69. .order-btns {
  70. display: flex;
  71. justify-content: flex-end;
  72. margin-top: 20rpx;
  73. .btn {
  74. border: 2rpx solid #eeeeee;
  75. }
  76. }
  77. }