index.wxss 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. /* pages/logistics/index.wxss */
  2. page{
  3. background: #f7f8fa;
  4. }
  5. view,text {
  6. margin: 0;
  7. padding: 0;
  8. }
  9. .logistop{
  10. background: #fff;
  11. position: relative;
  12. }
  13. .logistop .logisinfo{
  14. padding-left: 180rpx;
  15. box-sizing: border-box;
  16. height: 200rpx;
  17. display: flex;
  18. flex-direction: column;
  19. justify-content: center;
  20. font-size: 28rpx;
  21. }
  22. .logistop image{
  23. position: absolute;
  24. left: 30rpx;
  25. width: 100rpx;
  26. height: 100rpx;
  27. top: 50%;
  28. transform: translateY(-50%);
  29. }
  30. .logisinfo text{
  31. display: block;
  32. }
  33. .logisdetail{
  34. padding: 40rpx;
  35. margin-top: 40rpx;
  36. background: #fff;
  37. }
  38. .logisdetail .ul{
  39. border-left: 1px solid #e5e5e5;
  40. }
  41. .logisdetail .li{
  42. position: relative;
  43. padding-left: 60rpx;
  44. }
  45. .logisdetail .i-date{
  46. margin-top: 10rpx;
  47. }
  48. .logisdetail .li:not(:first-of-type) view{
  49. color: #999;
  50. font-size: 28rpx;
  51. }
  52. .logisdetail .li:not(:last-of-type){
  53. margin-bottom: 20rpx;
  54. }
  55. .logisdetail .li image,.logisdetail .li .li-point{
  56. width: 40rpx;
  57. height: 40rpx;
  58. position: absolute;
  59. left: -20rpx;
  60. top: -4rpx;
  61. }
  62. .logisdetail .li .li-point{
  63. background: #dddddd;
  64. width: 12rpx;
  65. height: 12rpx;
  66. border-radius: 50%;
  67. left: -6rpx;
  68. top: 14rpx;
  69. }