説明なし

mui-picker.css 2.3KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. /**
  2. * 閫夋嫨鍒楄〃鎻掍欢
  3. * varstion 2.0.0
  4. * by Houfeng
  5. * Houfeng@DCloud.io
  6. */
  7. .mui-picker {
  8. background-color: #ddd;
  9. position: relative;
  10. height: 200px;
  11. overflow: hidden;
  12. border: solid 1px rgba(0, 0, 0, 0.1);
  13. -webkit-user-select: none;
  14. user-select: none;
  15. box-sizing: border-box;
  16. }
  17. .mui-picker-inner {
  18. box-sizing: border-box;
  19. position: relative;
  20. width: 100%;
  21. height: 100%;
  22. overflow: hidden;
  23. -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent);
  24. -webkit-mask-box-image: linear-gradient(top, transparent, transparent 5%, #fff 20%, #fff 80%, transparent 95%, transparent);
  25. }
  26. .mui-pciker-list,
  27. .mui-pciker-rule {
  28. box-sizing: border-box;
  29. padding: 0px;
  30. margin: 0px;
  31. width: 100%;
  32. height: 50px;
  33. height: 50px;
  34. line-height: 50px;
  35. position: absolute;
  36. left: 0px;
  37. top: 50%;
  38. margin-top: -28px;
  39. // transform: translate(0,-50%);
  40. }
  41. .mui-pciker-rule-bg {
  42. z-index: 0;
  43. /*background-color: #cfd5da;*/
  44. }
  45. .mui-pciker-rule-ft {
  46. z-index: 2;
  47. border-top: solid 1px rgba(0, 0, 0, 0.1);
  48. border-bottom: solid 1px rgba(0, 0, 0, 0.1);
  49. /*-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);*/
  50. /*box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);*/
  51. }
  52. .mui-pciker-list {
  53. z-index: 1;
  54. -webkit-transform-style: preserve-3d;
  55. transform-style: preserve-3d;
  56. -webkit-transform: perspective(1000px) rotateY(0deg) rotateX(0deg);
  57. transform: perspective(1000px) rotateY(0deg) rotateX(0deg);
  58. }
  59. .mui-pciker-list li {
  60. width: 100%;
  61. height: 100%;
  62. position: absolute;
  63. text-align: center;
  64. vertical-align: middle;
  65. -webkit-backface-visibility: hidden;
  66. backface-visibility: hidden;
  67. overflow: hidden;
  68. box-sizing: border-box;
  69. font-size: .2rem;
  70. font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
  71. color: #999999;
  72. font-size: .14rem;
  73. padding: 0px 8px;
  74. white-space: nowrap;
  75. -webkit-text-overflow: ellipsis;
  76. text-overflow: ellipsis;
  77. overflow: hidden;
  78. cursor: default;
  79. visibility: hidden;
  80. }
  81. .mui-pciker-list li.highlight,
  82. .mui-pciker-list li.visible {
  83. visibility: visible;
  84. }
  85. .mui-pciker-list li.highlight {
  86. color: #222;
  87. font-size: .2rem;
  88. }