convertPopup.wxss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. .content{
  2. text-align: center;
  3. background: #fff;
  4. width: 550rpx;
  5. position: absolute;
  6. top: 25%;
  7. right: 0;
  8. left: 0;
  9. margin: auto;
  10. border-radius: 20rpx;
  11. font-size: 28rpx;
  12. box-shadow: 0 5rpx 10rpx rgba(0,0,0,.4);
  13. padding: 0 40rpx;
  14. }
  15. .content .modu{
  16. padding: 30rpx 0;
  17. border-bottom: 1rpx solid #ccc;
  18. }
  19. .popup-title{
  20. display: flex;
  21. align-items: center;
  22. justify-content: space-between;
  23. font-size: 30rpx;
  24. margin-bottom: 30rpx;
  25. width: 100%;
  26. padding: 0;
  27. font-weight: 700;
  28. }
  29. .time-list{
  30. display: flex;
  31. align-content: center;
  32. justify-content: space-between;
  33. }
  34. .time-list .list-item{
  35. border: 1px solid #ee3a43;
  36. padding: 0 20rpx;
  37. color: #ee3a43;
  38. line-height: 1.8;
  39. border-radius: 30rpx;
  40. }
  41. .popup-content{
  42. width: 100%;
  43. }
  44. .popup-content .content-item{
  45. display: flex;
  46. align-items: center;
  47. justify-content: space-between;
  48. line-height: 2;
  49. }
  50. .tip{
  51. margin-bottom: 30rpx;
  52. color: #878787;
  53. font-size: 24rpx;
  54. }
  55. .ins-icon{
  56. display: flex;
  57. align-items: center;
  58. font-weight: 500;
  59. color: #717071;
  60. }
  61. .none-accord{
  62. color: #C7C8C9;
  63. }
  64. .none-accord .item-value-icon{
  65. background-image: linear-gradient(to top,rgb(199,200,201,.7) 0% ,rgb(199,200,201,.4) 30%, rgb(199,200,201,0));
  66. }
  67. .none-accord .item-value-icon .icon{
  68. color: #C7C8C9;
  69. }
  70. /* 底部按钮 */
  71. button[disabled][type=warn]{
  72. background:rgba(199,200,201,1);
  73. color:#fff
  74. }
  75. .bottom-btn button{
  76. width: 40%;
  77. border-radius: 15rpx;
  78. font-size: 28rpx;
  79. }
  80. .bottom-btn .cancel{
  81. background:#fff;
  82. color: #ee3a43;
  83. border: 1rpx solid #ee3a43;
  84. }
  85. .bottom-btn button::after{
  86. border: none;
  87. }
  88. .bottom-btn{
  89. display: flex;
  90. align-items: center;
  91. justify-content: space-around;
  92. width: 100%;
  93. margin-top: 20rpx;
  94. }
  95. .time-list .checkedTime{
  96. background: #ee3a43;
  97. color: #fff;
  98. }
  99. .item-value-icon{
  100. display: inline-block;
  101. padding: 1px;
  102. height: 26rpx;
  103. width: 26rpx;
  104. border-radius: 50%;
  105. background-image: linear-gradient(to top,rgb(237,58,67,.35) 0% ,rgb(237,58,67,.2) 30%, rgb(255, 255, 255,0));
  106. margin-left: .2rem;
  107. }
  108. .item-value-icon .icon{
  109. border-radius: 50%;
  110. background: #fff;
  111. color: #ee3a43;
  112. display: block;
  113. line-height: 26rpx;
  114. font-size: 22rpx;
  115. font-weight: 700;
  116. }