_win7.scss 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288
  1. & {
  2. color: #222;
  3. background-color: #f0f0f0;
  4. }
  5. .layui-btn {
  6. background: linear-gradient(180deg, #eee 45%, #ddd 0, #bbb);
  7. border: 1.5px solid #888;
  8. border-radius: 3px;
  9. box-shadow: inset 0 -1px 1px hsla(0, 0%, 100%, .8), inset 0 1px 1px #fff;
  10. box-sizing: border-box;
  11. color: #222;
  12. &:hover {
  13. background: linear-gradient(180deg, #e5f4fd 45%, #b3e0f9 0);
  14. border-color: #72a2c5;
  15. }
  16. }
  17. .layui-layer-easy .layui-layer-btn a {
  18. @extend .layui-btn;
  19. color: #222 !important;
  20. height: 26px;
  21. line-height: 26px;
  22. font-size: 12px;
  23. }
  24. .layui-layer-title {
  25. background: linear-gradient(90deg, hsla(0, 0%, 100%, .4), rgba(0, 0, 0, .1), hsla(0, 0%, 100%, .2)), linear-gradient(55deg, transparent, rgba(0, 0, 0, .1) 20%, rgba(0, 0, 0, .1) 50%, transparent 53%), #4580c4 !important;
  26. border: 1px solid rgba(0, 0, 0, .6);
  27. border-radius: 6px 6px 0 0;
  28. // box-shadow : inset 0 0 .5px .5px #fff;
  29. height: 27px;
  30. line-height: 27px;
  31. color: #000 !important;
  32. letter-spacing: 0;
  33. font-size: 12px;
  34. text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
  35. padding: 0 80px 0 8px;
  36. border: 0;
  37. box-shadow: inset 0 .5px #fff;
  38. }
  39. .layui-layer-easy .layui-layer-title~.layui-layer-setwin {
  40. height: 27px !important;
  41. top: 1px;
  42. }
  43. .layui-layer-easy .layui-layer-title~.layui-layer-setwin>span {
  44. height: 20px !important;
  45. line-height: 20px !important;
  46. background: linear-gradient(hsla(0, 0%, 100%, .3), hsla(0, 0%, 100%, .3) 45%, rgba(0, 0, 0, .1) 50%, rgba(0, 0, 0, .1) 75%, hsla(0, 0%, 100%, .5)) !important;
  47. border: 0;
  48. border-radius: 0;
  49. border-bottom-right-radius: 0px;
  50. border-right: 1px solid rgba(0, 0, 0, .6);
  51. box-shadow: inset 0 0 0 .5px #eee;
  52. box-sizing: border-box;
  53. padding: 0;
  54. position: relative;
  55. margin-left: 0;
  56. min-width: 26px;
  57. text-align: center;
  58. &:hover {
  59. background: radial-gradient(circle at 50% 100%, #2aceda, transparent 60%), linear-gradient(#a9d2e8 50%, #196c9b 0) !important;
  60. }
  61. &:last-child {
  62. border: 0;
  63. border-bottom-right-radius: 5px;
  64. }
  65. &:first-child {
  66. border-bottom-left-radius: 5px;
  67. }
  68. &.layui-layer-close1 {
  69. background-color: #d04a37 !important;
  70. min-width: 45px !important;
  71. &:hover {
  72. filter: contrast(1.3);
  73. background-image: linear-gradient(hsla(0, 0%, 100%, .3), hsla(0, 0%, 100%, .3) 45%, rgba(0, 0, 0, .1) 50%, rgba(0, 0, 0, .1) 75%, hsla(0, 0%, 100%, .5)) !important;
  74. }
  75. }
  76. }
  77. .layui-layer-dialog {
  78. border-radius: 20px;
  79. }
  80. .layui-layer-iframe {
  81. border-radius: 20px;
  82. }
  83. .layui-layer:not(.layui-layer-loading) {
  84. .layui-layer-content {
  85. background: #f0f0f0;
  86. border: 1px solid rgba(0, 0, 0, .6);
  87. box-shadow: 0 -1px 1px .5px #fff;
  88. margin: 0 6px 0 6px;
  89. padding: 6px;
  90. border-bottom-width: 0;
  91. }
  92. &::before {
  93. background: linear-gradient(transparent 20%, hsla(0, 0%, 100%, .7) 40%, transparent 41%), linear-gradient(90deg, hsla(0, 0%, 100%, .4), rgba(0, 0, 0, .1), hsla(0, 0%, 100%, .2)), linear-gradient(55deg, transparent, rgba(0, 0, 0, .1) 20%, rgba(0, 0, 0, .1) 50%, transparent 53%), #4580c4;
  94. border-radius: 6px;
  95. content: "";
  96. height: 100%;
  97. position: absolute;
  98. width: 100%;
  99. z-index: -1;
  100. }
  101. &.layui-layer-iframe {
  102. &::before {
  103. height: calc(100% + 20px);
  104. }
  105. }
  106. }
  107. .layui-layer-easy .layui-layer-btn {
  108. background: #f0f0f0;
  109. border: 1px solid rgba(0, 0, 0, .6);
  110. box-shadow: 0 0 1px .5px #fff;
  111. margin: 0 6px 6px;
  112. padding: 6px;
  113. border-top: 0;
  114. text-align: right !important;
  115. }
  116. .layui-card {
  117. border: 1px solid rgba(0, 0, 0, .6);
  118. border-radius: 6px;
  119. box-shadow: 0 0 5px 1px rgba(0, 0, 0, .6);
  120. font: 9pt Segoe UI, sans-serif;
  121. position: relative;
  122. z-index: 0;
  123. &::before {
  124. background: linear-gradient(transparent 20%, hsla(0, 0%, 100%, .7) 40%, transparent 41%), linear-gradient(90deg, hsla(0, 0%, 100%, .4), rgba(0, 0, 0, .1), hsla(0, 0%, 100%, .2)), linear-gradient(55deg, transparent, rgba(0, 0, 0, .1) 20%, rgba(0, 0, 0, .1) 50%, transparent 53%), #4580c4;
  125. border-radius: 6px;
  126. content: "";
  127. height: 100%;
  128. position: absolute;
  129. width: 100%;
  130. z-index: -1;
  131. }
  132. .layui-card-header {
  133. align-items: center;
  134. background: linear-gradient(90deg, hsla(0, 0%, 100%, .4), rgba(0, 0, 0, .1), hsla(0, 0%, 100%, .2)), linear-gradient(55deg, transparent, rgba(0, 0, 0, .1) 20%, rgba(0, 0, 0, .1) 50%, transparent 53%), #4580c4;
  135. border-radius: 6px 6px 0 0;
  136. font: 9pt Segoe UI, sans-serif;
  137. justify-content: space-between;
  138. padding: 6px;
  139. border: 0;
  140. box-shadow: inset 0 .5px #fff;
  141. height: 15px;
  142. color: #000;
  143. letter-spacing: 0;
  144. line-height: 15px;
  145. text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
  146. }
  147. .layui-card-body {
  148. background: #f0f0f0;
  149. border: 1px solid rgba(0, 0, 0, .6);
  150. box-shadow: 0 0 1px .5px #fff;
  151. margin: 0 6px 6px;
  152. padding: 6px;
  153. }
  154. }
  155. .layui-tab-brief>.layui-tab-title .layui-this {
  156. color: #222;
  157. }
  158. .layuimini-tab .layui-tab-control>li {
  159. height: 27px !important;
  160. line-height: 27px !important;
  161. }
  162. .layui-form-checkbox[lay-skin="primary"] i {
  163. background: #ddd;
  164. border: 1px solid #888;
  165. box-shadow: inset 0 0 0 1.5px #eee, inset 0 2px 4px #888, inset -2px -3px 4px #fff;
  166. box-sizing: border-box;
  167. content: "";
  168. display: inline-block;
  169. height: 13px;
  170. margin-right: 6px;
  171. width: 13px;
  172. color: transparent;
  173. }
  174. .layui-form-checked[lay-skin="primary"] i {
  175. color: #16638f;
  176. border-color: #888;
  177. display: block;
  178. font-weight: 700;
  179. position: absolute;
  180. &::before {
  181. font-size: 14px;
  182. }
  183. }
  184. .layui-form-radio:hover *,
  185. .layui-form-radioed,
  186. .layui-form-radioed>i {
  187. color: #16638f;
  188. }
  189. .layui-input {
  190. background-color: #fff;
  191. border: 1px solid #ccc;
  192. border-top-color: rgb(204, 204, 204);
  193. border-radius: 2px;
  194. border-top-color: #888;
  195. box-sizing: border-box;
  196. font: 9pt Segoe UI, sans-serif;
  197. padding: 3px 4px 5px;
  198. }
  199. .layui-input,
  200. .layui-select,
  201. .layui-textarea {
  202. height: unset
  203. }
  204. .layui-form-label {
  205. padding: 3px 15px;
  206. font: 9pt Segoe UI, sans-serif;
  207. }
  208. .layuimini-form>.layui-form-item .required::after {
  209. top: 2px;
  210. }
  211. .form-search .layui-input-inline input,
  212. .form-search .layui-input-inline select {
  213. height: unset;
  214. line-height: unset;
  215. }
  216. .form-search .layui-form-label {
  217. height: unset;
  218. background: unset;
  219. text-align: right;
  220. border: unset;
  221. }
  222. .layuimini-upload-btn {
  223. .layui-btn {
  224. height: 25px;
  225. line-height: 25px;
  226. }
  227. }