| | |
| | | overflow-y: auto; |
| | | border: 1px solid #d8d8d8; |
| | | margin-top: 10px; |
| | | |
| | | .attach-item { |
| | | display: flex; |
| | | border-bottom: 1px solid #f1f1f1; |
| | | img { |
| | | width: 45px; |
| | | height: 45px; |
| | | padding: 9px; |
| | | margin-top: 5px; |
| | | } |
| | | .attach-msg { |
| | | flex: 1; |
| | | width: calc(100% - 95px); |
| | | padding: 5px 0px; |
| | | div { |
| | | color: #000000; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | } |
| | | } |
| | | .attach-msg + div { |
| | | width: 50px; |
| | | line-height: 45px; |
| | | margin-top: 5px; |
| | | text-align: center; |
| | | font-size: 16px; |
| | | cursor: pointer; |
| | | color: orangered; |
| | | } |
| | | } |
| | | } |
| | | .attach-selected-list::-webkit-scrollbar { |
| | | width: 7px; |
| | |
| | | background: rgba(0, 0, 0, 0); |
| | | } |
| | | } |
| | | } |
| | | .voucher-attach-add-wrap { |
| | | .ant-form { |
| | | > .ant-col { |
| | | float: none; |
| | | display: inline-block; |
| | | vertical-align: top; |
| | | } |
| | | > .ant-col-24 { |
| | | .ant-form-item-label { |
| | | width: 12.5%; |
| | | } |
| | | .ant-form-item-control-wrapper { |
| | | width: 84%; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .voucher-attach-document-wrap { |
| | | .ant-modal-body { |
| | | padding: 15px; |
| | | } |
| | | .document-wrap { |
| | | .document-title { |
| | | display: flex; |
| | | background: #e8e8e8; |
| | | line-height: 38px; |
| | | border: 1px solid #d8d8d8; |
| | | border-bottom: none; |
| | | .folder-box { |
| | | width: 200px; |
| | | text-align: center; |
| | | border-right: 1px solid #d8d8d8; |
| | | } |
| | | .folder { |
| | | flex: 1; |
| | | .square-select { |
| | | top: 3px; |
| | | margin: 0 10px; |
| | | } |
| | | } |
| | | } |
| | | .document-body { |
| | | border: 1px solid #d8d8d8; |
| | | height: 300px; |
| | | display: flex; |
| | | .doc-name { |
| | | width: 200px; |
| | | text-align: center; |
| | | border-right: 1px solid #d8d8d8; |
| | | height: 100%; |
| | | overflow-y: auto; |
| | | div { |
| | | border-bottom: 1px solid #e8e8e8; |
| | | height: 40px; |
| | | line-height: 40px; |
| | | } |
| | | .active { |
| | | background: var(--mk-sys-color1); |
| | | } |
| | | } |
| | | .file-wrap { |
| | | flex: 1; |
| | | width: calc(100% - 200px); |
| | | height: 100%; |
| | | overflow-y: auto; |
| | | .file-item { |
| | | border-bottom: 1px solid #e8e8e8; |
| | | height: 40px; |
| | | line-height: 40px; |
| | | |
| | | .square-select { |
| | | top: 4px; |
| | | margin: 0 10px; |
| | | } |
| | | img { |
| | | width: 20px; |
| | | height: 20px; |
| | | margin-top: -2px; |
| | | margin-right: 5px; |
| | | } |
| | | .file-name { |
| | | display: inline-block; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | vertical-align: top; |
| | | width: calc(100% - 90px); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .doc-name::-webkit-scrollbar, .file-wrap::-webkit-scrollbar { |
| | | width: 7px; |
| | | } |
| | | .doc-name::-webkit-scrollbar-thumb, .file-wrap::-webkit-scrollbar-thumb { |
| | | border-radius: 5px; |
| | | box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13); |
| | | background: rgba(0, 0, 0, 0.13); |
| | | } |
| | | .doc-name::-webkit-scrollbar-track, .file-wrap::-webkit-scrollbar-track { |
| | | box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05); |
| | | border-radius: 3px; |
| | | border: 1px solid rgba(0, 0, 0, 0.07); |
| | | background: rgba(0, 0, 0, 0); |
| | | } |
| | | |
| | | .square-select { |
| | | position: relative; |
| | | display: inline-block; |
| | | width: 16px; |
| | | height: 16px; |
| | | border: 1px solid #cccccc; |
| | | box-sizing: content-box; |
| | | margin: auto; |
| | | margin-right: 5px; |
| | | background-color: #ffffff; |
| | | transition: border-color 0.2s; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .square-select.active { |
| | | border-color: var(--mk-sys-color); |
| | | background: var(--mk-sys-color); |
| | | } |
| | | .square-select.half { |
| | | border-color: var(--mk-sys-color); |
| | | } |
| | | .square-select.half::before { |
| | | display: none; |
| | | } |
| | | .square-select.half::after { |
| | | position: absolute; |
| | | top: 4px; |
| | | left: 4px; |
| | | content: ' '; |
| | | display: block; |
| | | width: 8px; |
| | | height: 8px; |
| | | background: var(--mk-sys-color); |
| | | } |
| | | |
| | | .square-select::before { |
| | | position: relative; |
| | | top: 1px; |
| | | left: 6px; |
| | | content: ' '; |
| | | display: block; |
| | | width: 5px; |
| | | height: 11px; |
| | | border-style: solid; |
| | | border-width: 0 2px 2px 0; |
| | | border-color: #ffffff; |
| | | transform: rotate(45deg); |
| | | } |
| | | } |
| | | } |