index.wxss 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. .zan-actionsheet {
  2. background-color: #f8f8f8;
  3. }
  4. .zan-actionsheet__mask {
  5. position: fixed;
  6. top: 0;
  7. left: 0;
  8. right: 0;
  9. bottom: 0;
  10. z-index: 10;
  11. background: rgba(0, 0, 0, 0.7);
  12. display: none;
  13. }
  14. .zan-actionsheet__container {
  15. position: fixed;
  16. left: 0;
  17. right: 0;
  18. bottom: 0;
  19. background: #f8f8f8;
  20. -webkit-transform: translate3d(0, 50%, 0);
  21. transform: translate3d(0, 50%, 0);
  22. -webkit-transform-origin: center;
  23. transform-origin: center;
  24. -webkit-transition: all 0.2s ease;
  25. transition: all 0.2s ease;
  26. z-index: 11;
  27. opacity: 0;
  28. visibility: hidden;
  29. }
  30. .zan-actionsheet__btn {
  31. margin-bottom: 0 !important;
  32. }
  33. .zan-actionsheet__footer .zan-actionsheet__btn {
  34. background: #fff;
  35. }
  36. .zan-actionsheet__btn-content {
  37. display: -webkit-box;
  38. display: flex;
  39. -webkit-box-orient: horizontal;
  40. -webkit-box-direction: normal;
  41. flex-direction: row;
  42. -webkit-box-pack: center;
  43. justify-content: center;
  44. }
  45. .zan-actionsheet__subname {
  46. color: #999;
  47. }
  48. .zan-actionsheet__name, .zan-actionsheet__subname {
  49. height: 45px;
  50. line-height: 45px;
  51. }
  52. .zan-actionsheet__btn.zan-btn:last-child::after {
  53. border-bottom-width: 0;
  54. }
  55. .zan-actionsheet__subname {
  56. margin-left: 2px;
  57. font-size: 12px;
  58. }
  59. .zan-actionsheet__footer {
  60. margin-top: 10px;
  61. }
  62. .zan-actionsheet__btn--loading .zan-actionsheet__subname {
  63. color: transparent;
  64. }
  65. .zan-actionsheet--show .zan-actionsheet__container {
  66. opacity: 1;
  67. -webkit-transform: translate3d(0, 0, 0);
  68. transform: translate3d(0, 0, 0);
  69. visibility: visible;
  70. }
  71. .zan-actionsheet--show .zan-actionsheet__mask {
  72. display: block;
  73. }