popup.wxss 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. /* component/popup/popup.wxss */
  2. .popup {
  3. position: absolute;
  4. left: 0;
  5. top: 0;
  6. width: 100%;
  7. height: 100%;
  8. background: rgba(0, 0, 0, .5);
  9. z-index: 999;
  10. }
  11. .popup-container {
  12. position:absolute;
  13. left:5%;
  14. top:251rpx;
  15. /* transform:translateY(-50%); */
  16. background:#fff;
  17. width:90%;
  18. height:auto;
  19. border-radius:20rpx;
  20. overflow:hidden;
  21. }
  22. .head-img {
  23. width: 100%;
  24. }
  25. .head-img image {
  26. width: 100%;
  27. height: 100%;
  28. }
  29. .head-txt {
  30. position: absolute;
  31. top: 26rpx;
  32. left: 0;
  33. width: 100%;
  34. text-align: center;
  35. color: #fff;
  36. }
  37. .head-txt .title {
  38. font-size: 48rpx;
  39. font-weight: bolder;
  40. }
  41. .head-txt .head-con {
  42. margin: 20rpx 0 0;
  43. }
  44. .content {
  45. display: flex;
  46. flex-direction: column;
  47. justify-content: center;
  48. align-items: center;
  49. font-size: 36rxp;
  50. }
  51. .content text {
  52. margin: 6rpx 0;
  53. }
  54. .send-btn {
  55. width: 70%;
  56. height: 80rpx;
  57. margin: 32rpx auto 40rpx auto;
  58. background: #FF9209;
  59. border-radius: 80rpx;
  60. }
  61. .send-btn text {
  62. width: 100%;
  63. height: 100%;
  64. text-align: center;
  65. line-height: 80rpx;
  66. color: #fff;
  67. display: inline-block;
  68. }
  69. .cha {
  70. position:absolute;
  71. left:80rpx;
  72. width:72rpx;
  73. height:104rpx;
  74. top:151rpx;
  75. }
  76. .cha image {
  77. width: 100%;
  78. height: 100%;
  79. }
  80. .bottom {
  81. width: 100%;
  82. font-size: 20rpx;
  83. text-align: center;
  84. color: #767676;
  85. margin: 60rpx 0 10rpx 0;
  86. }