*{ margin:0; padding:0; box-sizing: border-box; } body{ background-color:rgb(255, 255, 255); } /* 滚动条凹槽的颜色,还可以设置边框属性 */ ::-webkit-scrollbar-track-piece { background-color: #f8f8f8; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } /* 滚动条的宽度 */ ::-webkit-scrollbar { width: 6px; height: 6px; } /* 滚动条的设置 */ ::-webkit-scrollbar-thumb { background-color: #ddd; background-clip: padding-box; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } /* 滚动条鼠标移上去 */ ::-webkit-scrollbar-thumb:hover { background-color: #bbb; } .hc-layout-box{ position: relative; height: 100vh; width: 100%; padding: 24px; } .main_box{ height: 100%; position: relative; --el-card-padding: 24px; --el-card-bg-color: #f1f5f8; --el-card-border-radius: 10px; --el-text-color-primary: #1A1A1A; box-shadow: -2px 0 10px #20253208, 0 10px 21px 20px #20253208; border: 1px solid #e9e9e9;; } .main_nox_header{ height: 70px; padding: 14px 24px; border-bottom: 1px solid #e9e9e9; overflow-x: auto; overflow-y: hidden; text-align: center; font-size: 36px; background: #f1f5f8; } .maininfo{ display: flex; height:calc(100vh - 120px); padding: 10px; background: #f1f5f8; } .leftbox{ /* background: rgb(255, 255, 255); box-shadow: -2px 0 10px #20253208, 0 10px 21px 20px #20253208; width: 382px; height: 99.9%; border: 1px solid #e9e9e9; border-style: solid; padding: 10px; */ /* width: 382px; */ /* background-color: #fff; padding: 14px; border-radius: 4px; -webkit-box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); */ border: 1px solid #e9e9e9; border-radius: 4px; overflow: auto; margin-right: 20px; position: relative; background: #f1f5f8; border-radius: 10px; margin-right: 24px; box-shadow: -2px 0 10px 0 rgb(32 37 50 / 3%), 0 10px 21px 20px rgb(32 37 50 / 3%); padding: 10px; } .treebox{ /* padding: 10px; */ } .contentbox{ flex: 1; background: #f1f5f8; /* border-radius: 10px; */ border-radius: 4px; -webkit-box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); box-shadow: 0 2px 12px 0 rgba(0,0,0,.2); padding: 0 20px 40px 20px; height: 100%; } .contentbox_head{ width: 100%; height: 60px; border-style: none; border-color: unset; /* box-shadow: rgb(164 163 163 / 24%) 0px 0px 8px 0px; */ color: rgb(186, 186, 186); border-radius: 0px; font-size: 14px; padding: 0px; text-align: left; line-height: 20px; font-weight: normal; font-style: normal; background-color: transparent; /* background: rgb(254, 254, 254); */ /* border: 1px solid #e9e9e9; */ line-height: 60px; } .contentbox_table{ margin-top: 10px; width: 100%; height:85%; display: inline-grid; border: 1px solid #e9e9e9; } .contentbox_table1{ margin-top: 10px; width: 100%; /* padding: 10px; */ height: 80%; display: inline-grid; border: 1px solid #e9e9e9; } .contentbox_head{ display: flex; justify-content: space-between; } .serachbox{ display: flex; width: 80%; position: relative; } .serachbox_info{ position: absolute; width: 100%; /* height: 380px; */ right:0 ; top:50px; z-index: 1000; border-style: none; border-color: unset; box-shadow: rgba(203, 201, 201, 0.4) 0px 2px 6px 0px; font-size: 14px; padding: 0px; text-align: center; line-height: 20px; background: #f1f5f8; padding: 10px; } .mask{ animation: animate 0.5s ease ; animation-iteration-count: 1; overflow: hidden; } .mask1{ animation: animate1 0.5s ease ; animation-iteration-count: 1; overflow: hidden; } @keyframes animate{ from { height: 0px; } to { height: 380px; } } @keyframes animate1{ from { height: 0px; } to { height: 450px; } } .form_box{ margin:10px 0px 10px 60px; } .mp20{ margin-top: 80px; } .form_box_btn{ text-align: right; } .page_box{ float: right; margin-top: 20px; display: flex; align-items: center; } .page_box1{ /* float: right; */ margin-top: 20px; text-align: right; /* align-items: center; */ } .sizeicon{ font-size: 24px; cursor: pointer; } .coursor{ cursor: pointer; } .ManualSorting { width: 100%; height: 100%; } .flexEnd { display: flex; justify-content: flex-end; } .flexBetween { display: flex; justify-content: space-between; } .flexItemsC { display: flex; align-items: center; } .marleft10 { margin-left: 10px; } .marright20{ margin-right: 20px; } .dialog-title_box{ display: flex; align-items: center; font-weight: bold; } .title-textsmall{ font-size: smaller; margin-left: 5px; } .button-right{ margin-left: 5px; } .fontoringe{ color: orange; } .bulefont{ color: #409eff; } .hc-csc-meta-table-data { position: relative; height:480px; overflow: auto; } .hc-csc-meta-table { border-spacing: 0; border: 1px solid #E9E9E9; border-collapse: collapse; width: 100%; } .hc-csc-meta-table-tr { position: relative; background: #f1f5f8; color: #50545e; transition: background-color .25s ease; } .hc-csc-meta-table-tr1 { position: relative; background:#dae8f3; color: #50545e; transition: background-color .25s ease; } .hc-csc-meta-table-tr:hover { background: #e6f2ff; } .hc-csc-meta-table-td { text-align: left; padding: 10px 12px; font-size: 14px; border: 1px solid #E9E9E9; } .hc-csc-meta-table-td .name{ width: 150px; } .hc-csc-meta-table-td .title{ color: #1a1a1a; text-align: center; background-color: #dae8f3; } .pdfbox{ width: 100%; display: flex; justify-content: space-between; padding-left: 20px; padding-right: 20px; } .pdfiframe{ width: 75%; height:calc(100vh - 100px); border: 1px solid #E9E9E9; } .pdfiframe1{ width: 100%; height:calc(100vh - 100px); /* height: 800px; */ border: 1px solid #E9E9E9; } .pdftitle{ width: 25%; height:calc(100vh - 100px); border: 1px solid #E9E9E9; } .pdftitlename{ text-align: center; font-weight: bold; font-size: 18px; align-items: center; height: 46px; background-color:lightsteelblue; } .mlft{ margin-left: 5px; }