관리-도구
편집 파일: data-list-view.css
.data-list-view-header .table-responsive .top,.data-thumb-view-header .table-responsive .top{display:flex;justify-content:space-between;margin-bottom:1rem;padding:0 1rem}.data-list-view-header .table-responsive .top .dataTables_length,.data-thumb-view-header .table-responsive .top .dataTables_length{display:inline-block}.data-list-view-header .table-responsive .top .dataTables_length .custom-select,.data-thumb-view-header .table-responsive .top .dataTables_length .custom-select{background-position:calc(100% - 12px) 13px,calc(100% - 20px) 13px,100% 0;border:1px solid #dee2e6;border-radius:1.428rem;font-size:1rem;height:3rem;width:8.714rem}.data-list-view-header .table-responsive .top .dataTables_length .custom-select:focus,.data-thumb-view-header .table-responsive .top .dataTables_length .custom-select:focus{box-shadow:none}.data-list-view-header .table-responsive .top .dataTables_filter,.data-thumb-view-header .table-responsive .top .dataTables_filter{display:inline-block}.data-list-view-header .table-responsive .top .dataTables_filter .form-control,.data-thumb-view-header .table-responsive .top .dataTables_filter .form-control{border:1px solid #dee2e6;border-radius:1.428rem}.data-list-view-header .table-responsive .top .dataTables_filter label,.data-thumb-view-header .table-responsive .top .dataTables_filter label{position:relative}.data-list-view-header .table-responsive .top .dataTables_filter label:after,.data-thumb-view-header .table-responsive .top .dataTables_filter label:after{content:url(https://api.iconify.design/feather/search.svg);font-family:feather,sans-serif;left:1.428rem;position:absolute;top:.928rem}table.data-list-view.dataTable,table.data-thumb-view.dataTable{border-spacing:0 1.3rem;padding:0 .7rem}table.data-list-view.dataTable thead th,table.data-thumb-view.dataTable thead th{font-weight:600;padding:.714rem 1.785rem}table.data-list-view.dataTable thead th input:focus,table.data-thumb-view.dataTable thead th input:focus{outline:0}table.data-list-view.dataTable thead th:first-child,table.data-thumb-view.dataTable thead th:first-child{padding-left:0}table.data-list-view.dataTable thead .sorting,table.data-list-view.dataTable thead .sorting_asc,table.data-list-view.dataTable thead .sorting_desc,table.data-thumb-view.dataTable thead .sorting,table.data-thumb-view.dataTable thead .sorting_asc,table.data-thumb-view.dataTable thead .sorting_desc{padding-right:inherit}table.data-list-view.dataTable thead .sorting:before,table.data-list-view.dataTable thead .sorting_asc:before,table.data-list-view.dataTable thead .sorting_desc:before,table.data-thumb-view.dataTable thead .sorting:before,table.data-thumb-view.dataTable thead .sorting_asc:before,table.data-thumb-view.dataTable thead .sorting_desc:before{font-size:.7rem;left:.857rem;top:.642rem}table.data-list-view.dataTable thead .sorting:after,table.data-list-view.dataTable thead .sorting_asc:after,table.data-list-view.dataTable thead .sorting_desc:after,table.data-thumb-view.dataTable thead .sorting:after,table.data-thumb-view.dataTable thead .sorting_asc:after,table.data-thumb-view.dataTable thead .sorting_desc:after{font-size:.7rem;left:.857rem;top:1.071rem}table.data-list-view.dataTable thead .sorting th:first-child,table.data-list-view.dataTable thead .sorting_asc,table.data-list-view.dataTable thead .sorting_desc,table.data-thumb-view.dataTable thead .sorting th:first-child,table.data-thumb-view.dataTable thead .sorting_asc,table.data-thumb-view.dataTable thead .sorting_desc{padding-right:inherit}table.data-list-view.dataTable thead .sorting th:first-child:after,table.data-list-view.dataTable thead .sorting th:first-child:before,table.data-list-view.dataTable thead .sorting_asc:after,table.data-list-view.dataTable thead .sorting_asc:before,table.data-list-view.dataTable thead .sorting_desc:after,table.data-list-view.dataTable thead .sorting_desc:before,table.data-thumb-view.dataTable thead .sorting th:first-child:after,table.data-thumb-view.dataTable thead .sorting th:first-child:before,table.data-thumb-view.dataTable thead .sorting_asc:after,table.data-thumb-view.dataTable thead .sorting_asc:before,table.data-thumb-view.dataTable thead .sorting_desc:after,table.data-thumb-view.dataTable thead .sorting_desc:before{display:none}table.data-list-view.dataTable tbody tr,table.data-thumb-view.dataTable tbody tr{background-color:#fff;border-radius:.5rem;box-shadow:0 4px 20px 0 rgba(0,0,0,.05);cursor:pointer;transition:all .3s ease}table.data-list-view.dataTable tbody tr:hover,table.data-thumb-view.dataTable tbody tr:hover{transform:translateY(-4px);transition:all .3s ease}table.data-list-view.dataTable tbody tr td:first-child,table.data-thumb-view.dataTable tbody tr td:first-child{border-bottom-left-radius:.5rem;border-top-left-radius:.5rem;padding-left:1rem}table.data-list-view.dataTable tbody tr td:last-child,table.data-thumb-view.dataTable tbody tr td:last-child{border-bottom-right-radius:.5rem;border-top-right-radius:.5rem}table.data-list-view.dataTable tbody tr.selected td,table.data-thumb-view.dataTable tbody tr.selected td{border-radius:0}table.data-list-view.dataTable tbody td,table.data-thumb-view.dataTable tbody td{border:none;padding:1.357rem;vertical-align:middle}table.data-list-view.dataTable tbody td input:focus,table.data-thumb-view.dataTable tbody td input:focus{outline:0}table.data-list-view.dataTable tbody td.product-name,table.data-thumb-view.dataTable tbody td.product-name{font-weight:500}table.data-list-view.dataTable tbody td:focus,table.data-thumb-view.dataTable tbody td:focus{outline:0}table.data-list-view.dataTable tbody td .progress,table.data-thumb-view.dataTable tbody td .progress{box-shadow:0 4px 8px 0 rgba(0,0,0,.12),0 2px 4px 0 rgba(0,0,0,.08);margin-bottom:0}@media(max-width:768px){#data-list-view .table-responsive .top,#data-thumb-view .table-responsive .top{flex-direction:column}#data-list-view .table-responsive .dt-buttons,#data-thumb-view .table-responsive .dt-buttons{text-align:left;width:auto}#data-list-view .table-responsive .dataTables_filter,#data-list-view .table-responsive .dataTables_length,#data-thumb-view .table-responsive .dataTables_filter,#data-thumb-view .table-responsive .dataTables_length{text-align:right}}@media (-ms-high-contrast:none),screen and (-ms-high-contrast:active){#data-list-view .table-responsive .top .dataTables_filter .form-control,#data-thumb-view .table-responsive .top .dataTables_filter .form-control{height:3rem!important;padding:0 1rem!important}#data-list-view .table-responsive .top .dataTables_filter label:after,#data-thumb-view .table-responsive .top .dataTables_filter label:after{display:none}}