public.css 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437
  1. .mt10 {
  2. margin-top: 10px;
  3. }
  4. .mt20 {
  5. margin-top: 20px;
  6. }
  7. .mt40 {
  8. margin-top: 40px;
  9. }
  10. .mt100 {
  11. margin-top: 100px;
  12. }
  13. .mb10 {
  14. margin-bottom: 10px;
  15. }
  16. .ml10 {
  17. margin-left: 10px;
  18. }
  19. .txt-center {
  20. text-align: center;
  21. }
  22. .wrap {
  23. width: 1200px;
  24. margin: 0 auto;
  25. }
  26. @media screen and (max-width: 1024px) {
  27. .wrap {
  28. width: 100%;
  29. margin: 0;
  30. }
  31. }
  32. @media screen and (min-width:600px) and (max-width:1024px) {
  33. .activeTask {
  34. overflow-y: scroll;
  35. }
  36. }
  37. .glass {
  38. width: 932px;
  39. height: 593px;
  40. background: rgba(255, 255, 255, 0.39);
  41. border: 3px solid rgba(255, 255, 255, 0.6);
  42. box-shadow: 0px 3px 6px rgb(0, 0, 0);
  43. border-radius: 12px;
  44. position: relative;
  45. margin: 5vh auto 10vh;
  46. }
  47. /* 任务介绍样式 */
  48. .desc_wrap {
  49. width: 100%;
  50. height: 500px;
  51. margin: 30px auto;
  52. }
  53. #title {
  54. padding-top: 49px;
  55. font-size: 30px;
  56. font-family: PingFang SC;
  57. font-weight: bold;
  58. line-height: 48px;
  59. color: #FFFFFF;
  60. text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  61. opacity: 1;
  62. text-align: center;
  63. }
  64. .right_part {
  65. float: right;
  66. width: 50%;
  67. height: 100%;
  68. background-size: 100% 100%;
  69. border-radius: 0px 12px 12px 0px;
  70. position: relative;
  71. }
  72. .left_part {
  73. float: left;
  74. width: 50%;
  75. height: 100%;
  76. overflow-y: auto
  77. }
  78. .desc_content {
  79. width: 70%;
  80. height: 100%;
  81. background: rgb(248, 248, 248);
  82. opacity: 1;
  83. border-radius: 12px;
  84. margin: 0 auto;
  85. }
  86. #left_top {
  87. margin-top: 30px;
  88. }
  89. #setting {
  90. width: 32.95px;
  91. height: 32.95px;
  92. float: left;
  93. margin-left: 39px;
  94. }
  95. #text {
  96. float: left;
  97. width: 150px;
  98. height: 32px;
  99. font-size: 22px;
  100. font-family: PingFang SC;
  101. font-weight: bold;
  102. line-height: 32px;
  103. color: #57ACBB;
  104. opacity: 1;
  105. }
  106. .el-button.start {
  107. background: rgb(87, 172, 187);
  108. border: 2px solid rgb(255, 255, 255);
  109. box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  110. opacity: 1;
  111. border-radius: 39px;
  112. color: #ffffff;
  113. }
  114. .el-progress-bar__innerText {
  115. color: #333333;
  116. }
  117. .taskHead {
  118. display: flex;
  119. box-sizing: border-box;
  120. width: 100%;
  121. padding: 22px 22px 0 39px;
  122. flex-direction: row-reverse;
  123. justify-content: space-between;
  124. }
  125. .scale {
  126. cursor: pointer;
  127. }
  128. .scale:active {
  129. transform: scale(0.95);
  130. opacity: 0.9;
  131. }
  132. .countdownStr {
  133. width: 70%;
  134. position: absolute;
  135. top: 50%;
  136. left: 50%;
  137. transform: translate(-50%, -50%);
  138. color: black;
  139. font-size: 70px;
  140. text-align: center;
  141. line-height: 100px;
  142. }
  143. /*按钮颜色及分页器颜色统一处理 2022-03-17 by lwl*/
  144. .el-button--default:focus,
  145. .el-button--default:hover {
  146. color: #57acbb;
  147. background-color: #EFF9FF;
  148. border-color: #57ACBB;
  149. }
  150. .el-pagination__sizes .el-input .el-input__inner:hover {
  151. border-color: #57acbb;
  152. }
  153. /* .el-select-dropdown__item.selected {
  154. color: #57acbb;
  155. } */
  156. .el-select-dropdown__item.selected {
  157. color: #5c5a5a;
  158. }
  159. .el-input.is-active .el-input__inner,
  160. .el-input__inner:focus {
  161. border-color: #57acbb;
  162. outline: 0;
  163. }
  164. .el-pager li.active {
  165. color: #57acbb;
  166. }
  167. .el-pager li:focus,
  168. .el-pager li:hover {
  169. color: #57acbb;
  170. }
  171. /*新增按钮颜色*/
  172. .el-button--success{
  173. border-color:#00BF78;
  174. background-color: #00BF78;
  175. color:white;
  176. /* background-color: transparent; */
  177. }
  178. .el-button--success:focus, .el-button--success:hover{
  179. border-color: #00BF78;
  180. color:white;
  181. background-color: #00BF78;
  182. }
  183. /*表格列表按钮颜色*/
  184. .el-button--text{
  185. cursor: pointer;
  186. color:#00BF78 ;
  187. font-weight: 700;
  188. }
  189. .el-button--text:focus, .el-button--text:hover{
  190. cursor: pointer;
  191. color:#00BF78 ;
  192. }
  193. /* 清空按钮颜色 */
  194. .el-button--info{
  195. border-color: #00BF78;
  196. color:#00BF78;
  197. background-color: transparent;
  198. }
  199. .el-button--info:focus, .el-button--info:hover{
  200. border-color: #00BF78;
  201. color:#00BF78;
  202. background-color: transparent;
  203. }
  204. /* 删除按钮颜色 */
  205. .el-button--delete{
  206. border-color: #ff1014;
  207. color:#ffffff;
  208. background-color: #ff1014;
  209. }
  210. .el-button--delete:focus, .el-button--delete:hover{
  211. border-color: #ff1014;
  212. color:#ffffff;
  213. background-color: #ff1014;
  214. }
  215. .el-button--delete.is-disabled{
  216. border-color: #ff1014 !important;
  217. color:#ffffff;
  218. background-color: #ff1014 !important;
  219. opacity: 0.5;
  220. }
  221. .el-button--delete.is-disabled :focus .el-button--delete.is-disabled :hover{
  222. border-color: #ff1014 !important;
  223. color:#ffffff;
  224. background-color: #ff1014 !important;
  225. opacity: 0.5;
  226. }
  227. /* 按钮主题色统一处理 2022-03-10 by sxy */
  228. .el-button--primary {
  229. color: #fff;
  230. background-color: #565656;
  231. border-color: #565656;
  232. }
  233. .el-button--primary:focus,
  234. .el-button--primary:hover {
  235. background: #565656;
  236. border-color: #565656;
  237. color: #FFF;
  238. }
  239. /* 分页更换主题色 */
  240. .el-pagination.is-background .el-pager li:not(.disabled).active {
  241. background-color: #104FFF;
  242. color: #FFF;
  243. }
  244. .el-pagination.is-background .el-pager li:not(.disabled):hover {
  245. color: #104FFF;
  246. }
  247. .el-pagination.is-background .el-pager li:not(.disabled):hover {
  248. color: #ffffff;
  249. background-color: #104FFF;
  250. }
  251. /* 认知任务结果显示公共样式 */
  252. .test_result {
  253. text-align: center;
  254. width: 500px;
  255. margin-top: 200px;
  256. }
  257. .test_result th {
  258. width: 50%;
  259. background: #57acbb;
  260. color: #ffffff;
  261. border: 1px solid #57acbb;
  262. font-size: 16px;
  263. line-height: 48px;
  264. }
  265. .test_result td {
  266. width: 50%;
  267. border: 1px solid #cccccc;
  268. font-size: 16px;
  269. line-height: 48px;
  270. }
  271. /* 表头样式统一处理 */
  272. .el-table th {
  273. background: rgba(0, 0, 0, 0.01);
  274. font-family: PingFang SC;
  275. color: #101010;
  276. }
  277. .modelName {
  278. font-size: 24px;
  279. color: #222222;
  280. margin: 20px 0 0 20px;
  281. }
  282. .display-row {
  283. display: flex;
  284. flex-direction: row;
  285. align-items: center;
  286. }
  287. .w100 {
  288. width: 100%;
  289. }
  290. .bgC {
  291. background-color: #57acbb;
  292. }
  293. .bdc {
  294. border-color: #57acbb;
  295. }
  296. .color_b {
  297. color: #57acbb;
  298. }
  299. .main_progress .el-progress-bar__inner {
  300. position: absolute;
  301. left: 0;
  302. top: 0;
  303. height: 100%;
  304. background-color: #ff3c3c !important;
  305. text-align: right;
  306. border-radius: 100px;
  307. line-height: 1;
  308. white-space: nowrap;
  309. transition: width 0.6s ease;
  310. background-image: linear-gradient(to right, #ffd650, #ff8431) !important;
  311. }
  312. .el-input__inner {
  313. background-color: #FFF;
  314. background-image: none;
  315. border-radius: 30px;
  316. border: 1px solid #DCDFE6;
  317. box-sizing: border-box;
  318. color: #606266;
  319. display: inline-block;
  320. height: 40px;
  321. line-height: 40px;
  322. outline: 0;
  323. padding: 0 15px;
  324. -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
  325. transition: border-color .2s cubic-bezier(.645,.045,.355,1);
  326. width: 200px;
  327. }
  328. .el-color-picker__icon, .el-input, .el-textarea {
  329. display: inline-block;
  330. width:200px;
  331. }
  332. /*修改计数器的圆角 */
  333. .el-input-number__decrease {
  334. left: 1px;
  335. /* border-radius: 4px 0 0 4px; */
  336. border-right: 1px solid #DCDFE6;
  337. border-radius: 30px;
  338. }
  339. .el-input-number__increase {
  340. right: 1px;
  341. border-radius: 30px;
  342. border-left: 1px solid #DCDFE6;
  343. }
  344. .add_class{
  345. margin-left: auto !important;
  346. }
  347. /* 单选框样式 */
  348. .el-radio__input.is-checked .el-radio__inner {
  349. border-color: #00BF78;
  350. background: #00BF78;
  351. }
  352. .el-radio__input.is-checked+.el-radio__label {
  353. color: #000000;
  354. }
  355. /* 分页样式 */
  356. .el-pagination.is-background .el-pager li:not(.disabled).active {
  357. background-color: #00BF78;
  358. color: #FFF;
  359. }
  360. .pag_class{
  361. text-align: end;
  362. }
  363. .el-table tr {
  364. background-color: #FFF;
  365. height: 50px !important;
  366. }