detail.wxss 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. .main {
  2. width: 750rpx;
  3. height: 100%;
  4. background: #000;
  5. overflow: hidden;
  6. z-index: 99999;
  7. }
  8. .main .section video {
  9. width: 750rpx;
  10. height: 100vh;
  11. }
  12. .goods {
  13. width: 400rpx;
  14. height: 150rpx;
  15. background: #fff;
  16. border-radius: 10rpx;
  17. position: fixed;
  18. bottom: 160rpx;
  19. left: 20rpx;
  20. z-index: 9998;
  21. display: flex;
  22. }
  23. .goods .good-img {
  24. width: 150rpx;
  25. height: 150rpx;
  26. margin-right: 10rpx;
  27. box-sizing: border-box;
  28. padding: 10rpx;
  29. }
  30. .good-img cover-image {
  31. width: 150rpx;
  32. height: 150rpx;
  33. object-fit: cover;
  34. border-radius: 10rpx;
  35. overflow: hidden;
  36. }
  37. .good-title {
  38. display: inline-block;
  39. font-size: 26rpx;
  40. margin-top: 10rpx;
  41. height: 60rpx;
  42. line-height: 30rpx;
  43. white-space: pre-wrap;
  44. }
  45. .xqbottom {
  46. display: flex;
  47. justify-content: space-between;
  48. align-items: center;
  49. margin-bottom: 10rpx;
  50. }
  51. .good-price {
  52. display: inline-block;
  53. flex: 1;
  54. font-size: 28rpx;
  55. color: red;
  56. }
  57. .cart {
  58. width: 45rpx;
  59. height: 45rpx;
  60. margin-left: 8rpx;
  61. }
  62. .switch {
  63. display: flex;
  64. position: fixed;
  65. bottom: 40rpx;
  66. color: #fff;
  67. font-size: 30rpx;
  68. font-weight: bold;
  69. left: 115rpx;
  70. }
  71. .switch .an {
  72. width: 250rpx;
  73. height: 80rpx;
  74. background: rgba(0, 0, 0, 0.3);
  75. margin-left: 20rpx;
  76. border-radius: 10rpx;
  77. line-height: 80rpx;
  78. text-align: center;
  79. }
  80. .switch .an:nth-child(2) {
  81. margin-right: 20rpx;
  82. }
  83. .nav-btn {
  84. position: relative;
  85. top: 0;
  86. left: 0;
  87. display: flex;
  88. justify-content: center;
  89. align-items: center;
  90. width: 31px;
  91. height: 31px;
  92. line-height: 31px;
  93. padding: 0;
  94. min-width: 31px;
  95. max-width: 31px;
  96. text-align: center;
  97. border-radius: 50%;
  98. min-height: initial;
  99. box-sizing: border-box;
  100. background: rgba(0,0,0,0.25);
  101. border: 1px solid rgba(255,255,255,0.05);
  102. color: #fff;
  103. backdrop-filter: blur(20px);
  104. }
  105. .nav-btn .img {
  106. width: 20px;
  107. height: 20px;
  108. vertical-align: top;
  109. }