index.scss 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. view {
  2. box-sizing: border-box;
  3. }
  4. .container {
  5. .mainBox{
  6. margin-top: 24rpx;
  7. padding: 0 40rpx;
  8. padding-bottom: 384rpx;
  9. .titleBox{
  10. background: #F0F1F4;
  11. background: linear-gradient(90deg,#DCEBFF,#fff);
  12. height: 62rpx;
  13. width: 80%;
  14. border-radius: 32rpx 0rpx 0rpx 0rpx;
  15. font-size: 32rpx;
  16. font-family: SourceHanSansCN, SourceHanSansCN;
  17. font-weight: bold;
  18. color: #333333;
  19. display: flex;
  20. align-items: center;
  21. padding-left: 32rpx;
  22. }
  23. .contentBox{
  24. min-height: 1004rpx;
  25. background: linear-gradient(180deg, #DCEBFF 0%, #FFFFFF 100%);
  26. box-shadow: 0rpx 8rpx 16rpx -8rpx rgba(0,71,190,0.4);
  27. border-radius:0 32rpx 32rpx 32rpx;
  28. padding: 0 40rpx;
  29. .bgTag{
  30. width: 434rpx;
  31. height: 54rpx;
  32. background: linear-gradient(132deg, #4FDDFF 0%, #5ECFFF 49%, #017AFF 100%);
  33. // filter: blur(0.5px);
  34. font-size: 36rpx;
  35. font-family: SourceHanSansCN, SourceHanSansCN;
  36. font-weight: bold;
  37. color: #333333;
  38. display: flex;
  39. align-items: center;
  40. justify-content: center;
  41. margin-left: 50%;
  42. transform: translate(-50%,-50%);
  43. }
  44. .storeBox{
  45. // overflow: hidden;
  46. position: relative;
  47. overflow: auto; /* 清除float的影响 */
  48. text{
  49. font-size: 28rpx;
  50. font-family: SourceHanSansCN, SourceHanSansCN;
  51. font-weight: 500;
  52. color: #333333;
  53. line-height: 66rpx;
  54. margin-top: 48rpx;
  55. text-wrap: wrap;
  56. text-align: justify;
  57. // float: left;
  58. }
  59. .img1{
  60. width: 256rpx;
  61. height: 256rpx;
  62. border-radius: 30rpx;
  63. float: left;
  64. margin-right: 24rpx;
  65. clear: both;
  66. }
  67. .img2{
  68. width: 256rpx;
  69. height: 356rpx;
  70. border-radius: 30rpx;
  71. float: right;
  72. clear: both;
  73. // margin-bottom: 1px;
  74. // margin-bottom: 500rpx;
  75. // position: absolute;
  76. // bottom: 0;
  77. // right: 0;
  78. // height: auto; /* 保持图片比例 */
  79. }
  80. }
  81. }
  82. }
  83. }
  84. .btnBox{
  85. padding-top: 32rpx;
  86. padding-left: 40rpx;
  87. padding-right: 40rpx;
  88. padding-bottom: 40rpx;
  89. height: 312rpx;
  90. background: #FFFFFF;
  91. box-shadow: 0rpx -2rpx 20rpx 0rpx rgba(0,0,0,0.05);
  92. border-radius: 32rpx 32rpx 0rpx 0rpx;
  93. position: fixed;
  94. bottom: 0;
  95. width: 100%;
  96. .btn{
  97. display: flex;
  98. align-items: center;
  99. justify-content: center;
  100. }
  101. .b1{
  102. // width: 670rpx;
  103. height: 108rpx;
  104. background: linear-gradient(132deg, #0298FF 0%, #017AFF 100%);
  105. box-shadow: 0rpx 4rpx 8rpx 0rpx rgba(0,122,255,0.2);
  106. border-radius: 54rpx;
  107. font-size: 32rpx;
  108. font-family: SourceHanSansCN, SourceHanSansCN;
  109. font-weight: bold;
  110. color: #FFFFFF;
  111. margin-bottom: 24rpx;
  112. }
  113. .b2{
  114. // width: 670rpx;
  115. height: 108rpx;
  116. border-radius: 54rpx;
  117. border: 2rpx solid #017AFF;
  118. font-size: 32rpx;
  119. font-family: SourceHanSansCN, SourceHanSansCN;
  120. font-weight: bold;
  121. color: #017AFF;
  122. }
  123. }