gougu.css 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381
  1. @import url("../../layui/css/layui.css");
  2. @import url("../../icons/fonts/remixicon.css");
  3. /*reset layui*/
  4. .layui-card{margin-bottom:12px; box-shadow: 0 1px 3px 0 rgb(5 32 96 / 10%);}
  5. .layui-card-header {position: relative; padding:0 12px;}
  6. .layui-card-header .layui-icon,.layui-card-header .pull-right{line-height: initial; position: absolute;right: 12px;top: 50%; margin-top: -9px}
  7. .layui-card-title {font-size: 18px;font-weight: 600;padding: 12px 12px 0;}
  8. .layui-table td, .layui-table th{padding:8px;}
  9. .picker-table{padding:8px;}
  10. .picker-table .layui-table-cell {padding:4px; height: 32px;line-height: 24px;}
  11. .layui-table-cell{padding:6px;}
  12. .layui-table-box{background-color:#fff;}
  13. .layui-table-page{background-color:#fff;border-bottom:1px solid #f1f1f1;}
  14. .layui-table-tool{box-shadow: 0 0 0 rgb(0 0 0 / 1%);}
  15. .layui-input, .layui-select, .layui-textarea {height: 36px;line-height: 1.22;line-height: 36px\9;}
  16. .layui-input, .layui-textarea {padding-left:6px;}
  17. .layui-form-pane .layui-form-label{height: 36px;}
  18. .layui-btn {height: 36px;line-height: 36px; padding:0 16px;}
  19. .layui-btn-sm {height: 30px; line-height: 30px; padding:0 8px;}
  20. .layui-btn-xs {height: 22px; line-height: 22px; padding:0 4px;}
  21. .layui-btn-reset {height: 36px;background-color: #fff; line-height: 36px; border: 1px solid transparent;padding: 0 8px; white-space: nowrap; color: #767a82;font-size: 14px;cursor: pointer;vertical-align: middle;}
  22. .layui-btn-reset:hover{color: #333333;}
  23. .layui-tab-brief>.layui-tab-title .layui-this{color:#187FDD}
  24. .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after{border-color:#187FDD}
  25. .layui-form-radio{padding-right:4px;}
  26. .layui-form-radio>i{margin-right:4px;}
  27. .layui-form-label{padding:9px; color:#909399}
  28. .layui-form-label font{color:#FF6347; margin-right: 2px;}
  29. .layui-input-block{margin-left:0px;}
  30. .layui-form-2 .layui-form-label{width:112px;}
  31. .layui-form-2 .layui-input-block{margin-left:130px;}
  32. .layui-table-view{margin:0;}
  33. .layui-table-view .layui-table th{background-color:#f8f8f8;}
  34. .layui-table-form tbody tr:hover{background-color: #fff;}
  35. .layui-table-tool{padding:10px 12px}
  36. .layui-td-gray,.layui-td-gray-2,.layui-td-gray-3,.layui-td-gray-4{color:#909399; width:68px; text-align:right; background-color:#fafafa;}
  37. .layui-td-gray-2{width:96px;}
  38. .layui-td-gray-3{width:126px;}
  39. .layui-td-gray-4{width:152px;}
  40. .layui-td-gray font,.layui-td-gray-2 font,.layui-td-gray-3 font,.layui-td-gray-4 font{color:#FF6347; margin-left: 2px;}
  41. .layui-table-min th{font-size:13px; text-align:center; background-color:#f8f8f8;}
  42. .layui-table-min td{font-size:13px; padding:6px;text-align:center;}
  43. .layui-select-tags{padding:10px 0;}
  44. .layui-tags-span{padding:5px 8px; font-size:14px; border-radius:3px; margin-bottom:6px; margin-right:6px; border:1px solid #e6e6e6; display:inline-block;cursor:pointer;}
  45. .layui-readonly{background-color: #f5f5f5; color:#999;}
  46. .layui-tags-span:hover{border:1px solid #ddd; background-color:#f2f2f2;}
  47. .layui-tags-span i{margin-left:5px; font-size:14px;}
  48. .layui-tags-span i:hover{border-radius:2px;background-color:#FF6347;color:#fff}
  49. .layui-letter-span{padding:10px 5px; font-size:15px; display:inline-block; cursor:pointer;}
  50. .layui-letter-span.on{color:#FF6347; font-weight:800;}
  51. .layui-letter-span:hover{color:#4285f4;}
  52. .layui-tags-all{float: right; font-weight: 200; background-color:#4285f4; color:#fff; border-radius: 3px; padding: 2px 6px; cursor: pointer; display: none;}
  53. .layui-data-none{padding:12px 0; color:#969696; text-align:center; font-size:12px;}
  54. .gougu-data-none{background:url(../images/data-none.png) no-repeat center center; background-size:auto 80%;}
  55. .click-edit{position: relative; display:inline-block; padding-right:24px; box-sizing:border-box;}
  56. .click-edit::after{content: ""; width: 16px; height: 24px; display: block; position: absolute; right:0; bottom: 0; background:url(../images/edit.png) no-repeat center center; background-size:16px auto; opacity: 0; transition: opacity ease-in-out .2s; cursor:pointer;}
  57. .click-edit:hover::after {opacity: 1;}
  58. html {background-color: #fafafa; color: #162a48;}
  59. html,body{height:100%;scrollbar-width: thin;}
  60. body.right-open{overflow:hidden;}
  61. .bg-white{background-color:#fff;}
  62. a.tab-a,a.open-a,a.link-a,a.right-a,a.side-a{color:#187FDD; cursor:pointer;}
  63. a.tab-a:hover,a:hover,a.open-a:hover,a.link-a:hover,a.right-a:hover{color:#187FDD; opacity:0.8}
  64. .left{float:left;}
  65. .right{float:right;}
  66. .h1,h1{font-size:24px; font-weight: 600;}
  67. .h2,h2{font-size:20px; font-weight: 600;}
  68. .h3,h3{font-size:18px; font-weight: 600;}
  69. .h4,h4{font-size:16px; font-weight: 600;}
  70. .f12{font-size:12px;}
  71. .f14{font-size:14px;}
  72. .f16{font-size:16px;}
  73. .f18{font-size:18px;}
  74. .f20{font-size:20px;}
  75. .f24{font-size:24px;}
  76. .f28{font-size:28px;}
  77. .f32{font-size:32px;}
  78. .f36{font-size:36px;}
  79. .m-0{margin:0}
  80. .m-1{margin:4px}
  81. .m-2{margin:8px}
  82. .m-3{margin:12px}
  83. .m-4{margin:16px}
  84. .m-5{margin:20px}
  85. .my-1{margin-top:4px;margin-bottom:4px}
  86. .my-2{margin-top:8px;margin-bottom:8px}
  87. .my-3{margin-top:12px;margin-bottom:12px}
  88. .my-4{margin-top:16px;margin-bottom:16px}
  89. .my-5{margin-top:20px;margin-bottom:20px}
  90. .mx-1{margin-left:4px;margin-right:4px}
  91. .mx-2{margin-left:8px;margin-right:8px}
  92. .mx-3{margin-left:12px;margin-right:12px}
  93. .mx-4{margin-left:16px;margin-right:16px}
  94. .mx-5{margin-left:20px;margin-right:20px}
  95. .ml-1{margin-left:4px}
  96. .ml-2{margin-left:8px}
  97. .ml-3{margin-left:12px}
  98. .ml-4{margin-left:16px}
  99. .ml-5{margin-left:20px}
  100. .mt-1{margin-top:4px}
  101. .mt-2{margin-top:8px}
  102. .mt-3{margin-top:12px}
  103. .mt-4{margin-top:16px}
  104. .mt-5{margin-top:20px}
  105. .mr-1{margin-right:4px}
  106. .mr-2{margin-right:8px}
  107. .mr-3{margin-right:12px}
  108. .mr-4{margin-right:16px}
  109. .mr-5{margin-right:20px}
  110. .mb-1{margin-bottom:4px}
  111. .mb-2{margin-bottom:8px}
  112. .mb-3{margin-bottom:12px}
  113. .mb-4{margin-bottom:16px}
  114. .mb-5{margin-bottom:20px}
  115. .p-0{padding:0}
  116. .p-1{padding:4px}
  117. .p-2{padding:8px}
  118. .p-3{padding:12px}
  119. .p-4{padding:16px}
  120. .p-5{padding:20px}
  121. .py-1{padding-top:4px;padding-bottom:4px}
  122. .py-2{padding-top:8px;padding-bottom:8px}
  123. .py-3{padding-top:12px;padding-bottom:12px}
  124. .py-4{padding-top:16px;padding-bottom:16px}
  125. .py-5{padding-top:20px;padding-bottom:20px}
  126. .px-1{padding-left:4px;padding-right:4px}
  127. .px-2{padding-left:8px;padding-right:8px}
  128. .px-3{padding-left:12px;padding-right:12px}
  129. .px-4{padding-left:16px;padding-right:16px}
  130. .px-5{padding-left:20px;padding-right:20px}
  131. .pl-1{padding-left:4px}
  132. .pl-2{padding-left:8px}
  133. .pl-3{padding-left:12px}
  134. .pl-4{padding-left:16px}
  135. .pt-1{padding-top:4px}
  136. .pt-2{padding-top:8px}
  137. .pt-3{padding-top:12px}
  138. .pt-4{padding-top:16px}
  139. .pt-5{padding-top:20px}
  140. .pr-1{padding-right:4px}
  141. .pr-2{padding-right:8px}
  142. .pr-3{padding-right:12px}
  143. .pr-4{padding-right:16px}
  144. .pr-5{padding-right:20px}
  145. .pb-1{padding-bottom:4px}
  146. .pb-2{padding-bottom:8px}
  147. .pb-3{padding-bottom:12px}
  148. .pb-4{padding-bottom:16px}
  149. .pb-5{padding-bottom:20px}
  150. .border{border:1px solid #eee; box-sizing:border-box}
  151. .border-y{border-top:1px solid #eee;border-bottom:1px solid #eee; box-sizing:border-box}
  152. .border-x{border-left:1px solid #eee;border-right:1px solid #eee; box-sizing:border-box}
  153. .border-t{border-top:1px solid #eee; box-sizing:border-box}
  154. .border-b{border-bottom:1px solid #eee; box-sizing:border-box}
  155. .border-l{border-left:1px solid #eee; box-sizing:border-box}
  156. .border-r{border-right:1px solid #eee; box-sizing:border-box}
  157. .layui-bg-0{background-color:#648A8D !important;}/*灰青*/
  158. .layui-bg-1,.layui-bg-green{background-color:#16b777 !important;}/*亮绿*/
  159. .layui-bg-2{background-color:#187FDD !important;}/*亮蓝*/
  160. .layui-bg-3{background-color:#FEC939 !important;}/*亮黄*/
  161. .layui-bg-4{background-color:#FD6206 !important;}/*亮橙*/
  162. .layui-bg-5{background-color:#FF5823 !important;}/*亮红*/
  163. .layui-bg-6{background-color:#4AC8BE !important;}/*亮青*/
  164. .layui-bg-7{background-color:#7860C0 !important;}/*亮紫*/
  165. .layui-bg-8{background-color:#646464 !important;}/*黑*/
  166. .layui-bg-9{background-color:#969696 !important;}/*灰黑*/
  167. .layui-color-0{color:#648A8D !important;}/*灰青*/
  168. .layui-color-1{color:#16b777 !important;}/*亮绿*/
  169. .layui-color-2{color:#187FDD !important;}/*亮蓝*/
  170. .layui-color-3{color:#FEC939 !important;}/*亮黄*/
  171. .layui-color-4{color:#FD6206 !important;}/*亮橙*/
  172. .layui-color-5{color:#FF5823 !important;}/*亮红*/
  173. .layui-color-6{color:#4AC8BE !important;}/*亮青*/
  174. .layui-color-7{color:#7860C0 !important;}/*亮紫*/
  175. .layui-color-8{color:#646464 !important;}/*黑*/
  176. .layui-color-9{color:#969696 !important;}/*灰黑*/
  177. .black{color:#182b50}
  178. .blue{color:#187FDD}
  179. .blue-dark{color:#3c9cff;}
  180. .blue-disabled{color:#9acafc;}
  181. .blue-light{color:#ecf5ff;}
  182. .yellow{color:#f9ae3d;}
  183. .yellow-dark{color:#f1a532;}
  184. .yellow-disabled{color:#f9d39b;}
  185. .yellow-light{color:#fdf6ec;}
  186. .green{color:#16b777;}
  187. .green-dark{color:#53c21d;}
  188. .green-disabled{color:#a9e08f;}
  189. .green-light{color:#f5fff0;}
  190. .red{color:#f56c6c;}
  191. .red-dark{color:#e45656;}
  192. .red-disabled{color:#f7b2b2;}
  193. .red-light{color:#fef0f0;}
  194. .gray{color:#969696;}
  195. .gray-dark{color:#767676;}
  196. .gray-disabled{color:#c6c6c6;}
  197. .gray-light{color:#f1f1f1;}
  198. /* 滚动条 */
  199. ::-webkit-scrollbar {
  200. width: 8px;
  201. }
  202. ::-webkit-scrollbar-thumb {
  203. background-color:rgba(0,0,0,.15);background-clip:content-box;border:1px solid transparent;border-radius:8px
  204. }
  205. ::-webkit-scrollbar-track{background-color:transparent}
  206. ::-webkit-scrollbar-track:hover{background-color:rgba(0,0,0,.04)}
  207. ::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.4);border:1px solid transparent}
  208. ::-webkit-scrollbar-thumb:active{background-color:rgba(0,0,0,.65)}
  209. ::-moz-scrollbar {
  210. width: 8px;
  211. background-color: transparent;
  212. }
  213. ::-moz-scrollbar-thumb {
  214. background-color: #c1c1c1;
  215. border-radius: 8px;
  216. }
  217. body.right-open{overflow-y:clip;}
  218. div.layui-table-main::-webkit-scrollbar{width:12px;height:12px}
  219. div.layui-table-main::-webkit-scrollbar-thumb{min-width:12px;min-height:12px;background-color:rgba(0,0,0,.15);background-clip:content-box;border:2px solid transparent;border-radius:12px}
  220. div.layui-table-main::-webkit-scrollbar-track{background-color:transparent}
  221. div.layui-table-main::-webkit-scrollbar-track:hover{background-color:rgba(0,0,0,.04)}
  222. div.layui-table-main::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.4);border:2px solid transparent}
  223. div.layui-table-main::-webkit-scrollbar-thumb:active{background-color:rgba(0,0,0,.65)}
  224. /*placeholder*/
  225. ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  226. color: #aaa;
  227. }
  228. :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  229. color:#aaa;
  230. }
  231. ::-moz-placeholder { /* Mozilla Firefox 19+ */
  232. color:#aaa;
  233. }
  234. :-ms-input-placeholder { /* Internet Explorer 10-11 */
  235. color:#aaa;
  236. }
  237. /*text ellipsis*/
  238. .text-overflow1{ overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box !important;
  239. -webkit-box-orient: vertical;
  240. -webkit-line-clamp: 1;
  241. }
  242. .text-overflow2{ overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box !important;
  243. -webkit-box-orient: vertical;
  244. -webkit-line-clamp: 2;
  245. }
  246. .text-overflow3{ overflow: hidden; text-overflow: ellipsis; word-break: break-all; display: -webkit-box !important;
  247. -webkit-box-orient: vertical;
  248. -webkit-line-clamp: 3;
  249. }
  250. /*gg-DIY*/
  251. .gg-form-bar{padding:10px 12px 0; background-color:#fff;}
  252. .gg-form-bar .layui-input-inline{margin-bottom:10px;}
  253. .gg-tab-bar{background-color:#fff;}
  254. .gg-tab{text-align: left!important;}
  255. .gg-tab-title{position: relative;left: 0; height: 40px; white-space: nowrap; font-size: 0;}
  256. .gg-tab-title li{display: inline-block;*display: inline;*zoom: 1;vertical-align: middle; font-size: 16px; position: relative;line-height: 40px; min-width: 64px; padding: 0 12px;text-align: center;cursor: pointer;}
  257. .gg-tab-title li:hover,.gougu-tab li.tab-this{ color:#187FDD;}
  258. .gg-tab-title li.tab-this:after{border-bottom: 2px solid #187FDD;position: absolute;left: 0; top: 0; content: ""; width: 100%; height: 41px; box-sizing: border-box;pointer-events: none;}
  259. .gg-tab-title.big{height: 46px;}
  260. .gg-tab-title.big li{line-height: 46px;}
  261. .gg-tab-title.big li{line-height: 46px;}
  262. .gg-tab-title.big li.tab-this:after{height: 47px;}
  263. .gg-img-center{display: table-cell;vertical-align: middle;}
  264. .gg-img-center img{max-width: 100%; max-height: 100%; display: block; margin: auto;}
  265. .gg-img-radius img{border-radius:4px;max-width: 100%; max-height: 100%;}
  266. .gg-img-round img{border-radius:50%;max-width: 100%; max-height: 100%;}
  267. .gg-img-cover { width: 100%; position: relative; padding-top: 0; border-radius: 3px; overflow: hidden; background-color: #f0f0f0;}
  268. .gg-img-cover img { width: 100%;height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; border-radius: 2px; max-width: 100%;}
  269. .gg-img-cover.cover-2-1 { padding-top: 50%;}
  270. .gg-img-cover.cover-4-3 { padding-top: 75%;}
  271. .gg-img-cover.cover-16-9 { padding-top: 56.25%;}
  272. .sub-menu { overflow: hidden; position: absolute; height: 100%;top: 0;left: 0;}
  273. .sub-menu ul{padding:0; line-height:2.7}
  274. .sub-menu li.sub-menu-title{margin-top:10px;}
  275. .sub-menu li.sub-menu-title i{font-size:18px; font-weight:800}
  276. .sub-menu li.sub-menu-title span{padding-left:8px; font-size:15px;}
  277. .sub-menu li.sub-menu-title cite{font-size:12px; margin-left:4px; color:#999}
  278. .sub-menu li.sub-menu-title.active a{color:#4285F4;}
  279. .sub-menu li.sub-menu-li a{padding-left:12px; font-size:14px; display:inline-block; width:100%; box-sizing:border-box;}
  280. .sub-menu li.sub-menu-li a .iconfont{margin-right:8px; font-weight:600}
  281. .sub-menu li.sub-menu-li.active a{color:#4285F4; background-color:#F2F8FF}
  282. .sub-menu li.sub-menu-li span.num{margin-left:4px}
  283. /*附件*/
  284. .file-card {background: #fff;border: 1px solid #f1f1f1; border-radius: 2px; padding:0; margin:4px 6px;
  285. -webkit-box-align: center;
  286. -ms-flex-align: center;
  287. align-items: center;
  288. display: -webkit-box;
  289. display: -ms-flexbox;
  290. display: flex;
  291. }
  292. .file-card .file-icon{font-size:44px; color:#646464; margin-right: 4px;}
  293. .file-card .file-info {width: calc(100% - 110px); line-height:1.5}
  294. .file-card.file-view .file-info{width: calc(100% - 82px);}
  295. .file-card .file-title {font-size: 14px; word-break:keep-all; overflow: hidden; text-overflow: ellipsis; display: width: 100%;}
  296. .file-card .file-ops{font-size:12px; color:#aaa;}
  297. .file-card .file-tool .iconfont{font-size:20px; font-weight:600; padding:4px; display:inline-block; cursor:pointer;}
  298. .file-card.file-view .btn-delete{display:none}
  299. .file-hasdelete{background:url(../images/delete_icon.png) no-repeat 99% 0; background-size: auto 58px; color:#aaa}
  300. .file-hasdelete .file-icon{color:#aaa;}
  301. .file-hasdelete .file-tool{display:none}
  302. /*审批*/
  303. .check-items{overflow-x: auto; padding: 2px 0;}
  304. .flow-flex-row {box-direction: row;
  305. box-orient: horizontal;
  306. -webkit-box-orient: horizontal;
  307. -ms-flex-direction: row;
  308. flex-direction: row;
  309. }
  310. .flow-flexbox { width: 100%;text-align: left;
  311. display: -webkit-box;
  312. display: -ms-flexbox;
  313. display: flex;
  314. display: -webkit-flex;
  315. box-align: center;
  316. -webkit-box-align: center;
  317. -ms-flex-align: center;
  318. align-items: center;
  319. flex-wrap: wrap;
  320. }
  321. .check-item{width: auto; -ms-flex-negative: 0; flex-shrink: 0; padding:4px 0}
  322. .check-item i{margin-right:3px; color:#646464;}
  323. .check-item span{color:#999;margin:0 3px;}
  324. .check-item .layui-icon {font-size:18px;}
  325. .check-item .layui-icon.layui-icon-right{font-size:12px;}
  326. .layui-icon[data-ok]{color:#34a853}
  327. .layui-icon[data-no]{color:#FF5722;}
  328. .check-item-status{color:#999; font-size:12px; margin-left:3px;}
  329. .flow-tips{padding:6px 10px;}
  330. .flow-tips li{padding:5px 0;}
  331. .flow-tips li i{color:#4285f4;}
  332. .flow-tips li span{color:#999; font-size:12px; margin-left:4px;}
  333. .flow-record{padding:4px 4px 0;}
  334. .flow-record .layui-timeline-item{text-decoration:line-through; color:#acacac; padding-bottom:10px;}
  335. .flow-record .layui-timeline-item.delete-0{text-decoration:none; color:#323232;}
  336. .layui-timeline-content ul{font-size:12px;}
  337. .check-status{color:#999; margin-left:5px;}
  338. .check-remark{padding:6px; margin-top:6px; margin-bottom:10px; border-radius:4px; background-color:#f5f5f5;}
  339. .check-record{line-height:1.5; padding:4px 0}
  340. .flow-this{font-weight:800;}
  341. .flow-this i{color:#4285f4}
  342. .editormd,.editormd-toolbar,.editormd .CodeMirror,.CodeMirror-gutters{border-color:#eeeeee!important;}
  343. .editormd{margin-bottom:0!important;}
  344. .CodeMirror-gutters{background-color:#fafafa!important;}
  345. .layui-layer-gougu-admin {box-shadow: 1px 1px 10px rgba(0,0,0,.1); border-radius: 0!important;overflow:initial!important;}
  346. .express-box { position: fixed; z-index:9999; height:100%; right: -100%; top:0;background-color: #fff;}
  347. .express-box article{width:100%; height:100%; overflow:auto;}
  348. .express-mask{ display: none; position: fixed; top: 0; left: 0; z-index: 9998; width: 100%; height: 100%; background-color: rgba(0,0,0,.6); }
  349. .express-close{position: absolute;width:24px;height:60px; padding:20px 6px; line-height:30px;text-align:center; left: -38px;right:0; top: 16%;background-color:#FF5722;color:#fff;border-radius:6px 0 0 6px; cursor:pointer; border:2px solid #fff; border-right:none; font-weight:600; font-size:14px;}
  350. .express-close:hover{opacity:0.9}