demo.css 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. body .layui-layer-tips .layui-layer-content {
  2. line-height: 1.5;
  3. padding: 8px 12px;
  4. border-radius: 4px;
  5. background-color: #303133;
  6. box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
  7. }
  8. body .layui-layer-tips i.layui-layer-TipsG {
  9. border-width: 5px;
  10. }
  11. body .layui-layer-tips i.layui-layer-TipsR, body .layui-layer-tips i.layui-layer-TipsL {
  12. top: 11px;
  13. }
  14. body .layui-layer-tips i.layui-layer-TipsT, body .layui-layer-tips i.layui-layer-TipsB {
  15. left: 12px;
  16. }
  17. body .layui-layer-tips i.layui-layer-TipsT {
  18. bottom: -10px;
  19. }
  20. body .layui-layer-tips i.layui-layer-TipsT {
  21. border-right-color: transparent;
  22. border-top-style: solid;
  23. border-top-color: #303133;
  24. }
  25. body .layui-layer-tips i.layui-layer-TipsB {
  26. top: -10px;
  27. }
  28. body .layui-layer-tips i.layui-layer-TipsB {
  29. border-right-color: transparent;
  30. border-bottom-style: solid;
  31. border-bottom-color: #303133;
  32. }
  33. body .layui-layer-tips i.layui-layer-TipsL {
  34. right: -10px;
  35. }
  36. body .layui-layer-tips i.layui-layer-TipsL {
  37. border-bottom-color: transparent;
  38. border-left-style: solid;
  39. border-left-color: #303133;
  40. }
  41. body .layui-layer-tips i.layui-layer-TipsR {
  42. left: -10px;
  43. }
  44. body .layui-layer-tips i.layui-layer-TipsR {
  45. border-bottom-color: transparent;
  46. border-right-style: solid;
  47. border-right-color: #303133;
  48. }
  49. /** loading样式 */
  50. .page-loading {
  51. position: absolute;
  52. display: block;
  53. width: 100%;
  54. height: 100%;
  55. top: 0;
  56. left: 0;
  57. right: 0;
  58. bottom: 0;
  59. z-index: 19891017;
  60. background-color: #fff;
  61. }
  62. .page-no-scroll {
  63. overflow: hidden;
  64. overflow-x: hidden;
  65. overflow-y: hidden;
  66. min-height: 80px;
  67. }
  68. .rubik-loader, .ball-loader, .signal-loader {
  69. position: absolute;
  70. left: 50%;
  71. top: 50%;
  72. transform: translate(-50%, -50%);
  73. -ms-transform: translate(-50%, -50%);
  74. -webkit-transform: translate(-50%, -50%);
  75. }
  76. .ball-loader > span, .signal-loader > span {
  77. background-color: #4aca85;
  78. display: inline-block;
  79. }
  80. .ball-loader > span:nth-child(1), .ball-loader.sm > span:nth-child(1), .signal-loader > span:nth-child(1), .signal-loader.sm > span:nth-child(1) {
  81. -webkit-animation-delay: 0s;
  82. animation-delay: 0s;
  83. }
  84. .ball-loader > span:nth-child(2), .ball-loader.sm > span:nth-child(2), .signal-loader > span:nth-child(2), .signal-loader.sm > span:nth-child(2) {
  85. -webkit-animation-delay: 0.1s;
  86. animation-delay: 0.1s;
  87. }
  88. .ball-loader > span:nth-child(3), .ball-loader.sm > span:nth-child(3), .signal-loader > span:nth-child(3), .signal-loader.sm > span:nth-child(3) {
  89. -webkit-animation-delay: 0.15s;
  90. animation-delay: 0.15s;
  91. }
  92. .ball-loader > span:nth-child(4), .ball-loader.sm > span:nth-child(4), .signal-loader > span:nth-child(4), .signal-loader.sm > span:nth-child(4) {
  93. -webkit-animation-delay: 0.2s;
  94. animation-delay: 0.2s;
  95. }
  96. .ball-loader > span {
  97. width: 20px;
  98. height: 20px;
  99. margin: 0 3px;
  100. border-radius: 50%;
  101. transform: scale(0);
  102. -ms-transform: scale(0);
  103. -webkit-transform: scale(0);
  104. animation: ball-load 1s ease-in-out infinite;
  105. -webkit-animation: 1s ball-load ease-in-out infinite;
  106. }
  107. @-webkit-keyframes ball-load {
  108. 0% {
  109. transform: scale(0);
  110. -webkit-transform: scale(0);
  111. }
  112. 50% {
  113. transform: scale(1);
  114. -webkit-transform: scale(1);
  115. }
  116. 100% {
  117. transform: scale(0);
  118. -webkit-transform: scale(0);
  119. }
  120. }
  121. @keyframes ball-load {
  122. 0% {
  123. transform: scale(0);
  124. -webkit-transform: scale(0);
  125. }
  126. 50% {
  127. transform: scale(1);
  128. -webkit-transform: scale(1);
  129. }
  130. 100% {
  131. transform: scale(0);
  132. -webkit-transform: scale(0);
  133. }
  134. }
  135. .ball-loader.sm > span {
  136. width: 15px;
  137. height: 15px;
  138. margin: 0 2px;
  139. }
  140. .layui-input {
  141. border-color: #C9C9C9 !important;
  142. }
  143. .layui-input:focus {
  144. border-color: #009688 !important;
  145. }
  146. .layui-btn-sm {
  147. padding: 0 8px 0 5px;
  148. }
  149. .page-wrapper {
  150. width: 900px;
  151. margin: 0 auto;
  152. padding: 0 15px;
  153. }
  154. .right-desc {
  155. position: absolute;
  156. right: 0;
  157. top: 0;
  158. width: 280px;
  159. padding-top: 6px;
  160. }
  161. .desc-item {
  162. background-color: #FFF8DB;
  163. color: #40485b;
  164. padding: 10px 15px;
  165. margin: 15px 15px 0 0;
  166. font-size: 12px;
  167. line-height: 1.6;
  168. border-radius: 4px;
  169. box-shadow: 0px 0px 6px rgba(0, 0, 0, .15);
  170. }
  171. html, body {
  172. min-width: 1200px;
  173. overflow: auto;
  174. background-color: #fff;
  175. position: relative;
  176. }
  177. @media screen and (max-width: 1480px) {
  178. .page-wrapper {
  179. margin: 0 280px auto auto;
  180. }
  181. }