index.wxss 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. @charset "UTF-8";
  2. .shop-info {
  3. width: 100%;
  4. height: 220rpx;
  5. border: 1rpx solid #ECECEC;
  6. display: flex;
  7. flex-direction: row;
  8. justify-content: space-between;
  9. align-items: center;
  10. padding: 20rpx 30rpx;
  11. box-sizing: border-box;
  12. margin-bottom: 10rpx;
  13. background-color: #fff;
  14. }
  15. .shop-info > .shopimg {
  16. width: 150rpx;
  17. height: 150rpx;
  18. }
  19. .shop-info > .shopimg > .img {
  20. width: 100%;
  21. height: 100%;
  22. }
  23. .shop-info .shopmsg {
  24. flex: 2;
  25. height: 200rpx;
  26. margin-left: 50rpx;
  27. display: flex;
  28. flex-direction: column;
  29. justify-content: space-around;
  30. /* 处理定位图标上移的问题 */
  31. /* 新品促销标签 */
  32. }
  33. .shop-info .shopmsg > .shopview {
  34. display: flex;
  35. justify-content: space-between;
  36. }
  37. .shop-info .shopmsg > .shop-address {
  38. position: relative;
  39. padding-left: 45rpx;
  40. }
  41. .shop-info .shopmsg > .shop-address .address-icon {
  42. position: absolute;
  43. top: -6rpx;
  44. left: 0;
  45. }
  46. .shop-info .shopmsg .mark {
  47. width: 105rpx;
  48. height: 30rpx;
  49. line-height: 30rpx;
  50. text-align: center;
  51. border-radius: 30rpx;
  52. }
  53. .shop-info .shopmsg .discount {
  54. color: #E359A8;
  55. border: 1px solid #E359A8;
  56. }
  57. .shop-info .shopmsg .new {
  58. border: 1px solid #80CB5F;
  59. color: #80CB5F;
  60. }
  61. .c-202020 {
  62. color: #202020;
  63. }
  64. .c-707070 {
  65. color: #707070;
  66. }
  67. .f12 {
  68. font-size: 12px;
  69. }
  70. .f15 {
  71. font-size: 15px;
  72. }