forked from HANYANG/HANYANG_MES
css 폴더 위치 이동
This commit is contained in:
parent
d8f08e6365
commit
3b7134ad6b
|
|
@ -51,6 +51,7 @@ button {
|
|||
color: #828282;
|
||||
background-color: rgba(255, 255, 255, 0.973);
|
||||
}
|
||||
|
||||
.basic-btn {
|
||||
border: solid 2px transparent;
|
||||
border-radius: 5px;
|
||||
|
|
@ -78,6 +79,92 @@ button {
|
|||
font-size: 13px;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
height: 100%;
|
||||
border: solid 2px red;
|
||||
border-radius: 3px;
|
||||
color: red;
|
||||
background-color: white;
|
||||
|
||||
&:hover {
|
||||
background-color: red;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.close-btn {
|
||||
border: solid 2px #cf5b5b;
|
||||
color: white;
|
||||
background-color: #cf5b5b;
|
||||
|
||||
border-radius: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: white;
|
||||
color: #cf5b5b;
|
||||
}
|
||||
}
|
||||
.run-btn {
|
||||
border: solid 2px #5b73cf;
|
||||
color: white;
|
||||
background-color: #5b73cf;
|
||||
|
||||
border-radius: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: white;
|
||||
color: #5b73cf;
|
||||
}
|
||||
}
|
||||
.norun-btn {
|
||||
border: solid 2px #f3da8f;
|
||||
color: white;
|
||||
background-color: #f3da8f;
|
||||
|
||||
border-radius: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: white;
|
||||
color: #f3da8f;
|
||||
}
|
||||
}
|
||||
|
||||
.disabled-btn {
|
||||
background-color: rgba(255, 255, 255, 0.973);
|
||||
color: #dddddd;
|
||||
border-color: #e9e9e9;
|
||||
cursor: default;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(255, 255, 255, 0.973);
|
||||
color: #dddddd;
|
||||
border-color: #e9e9e9;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
background-color: white;
|
||||
color: black;
|
||||
border: solid 1px $gray-004;
|
||||
height: 30px;
|
||||
width: 25%;
|
||||
border-right: none;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: $gray-004;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.left-round{
|
||||
border-radius: 50px 0px 0px 50px;
|
||||
}
|
||||
|
||||
.right-round{
|
||||
border-radius: 0px 50px 50px 0px;
|
||||
border-right: solid 1px $gray-004;
|
||||
}
|
||||
|
||||
// 전체 프레임
|
||||
.have-image {
|
||||
background-repeat: no-repeat;
|
||||
|
|
@ -89,68 +176,154 @@ button {
|
|||
height: calc(100vh - 48px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.container .main-part {
|
||||
width: calc(100% - 280px);
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
.inner-container {
|
||||
padding: 20px 15px;
|
||||
|
||||
a, i {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
a:nth-of-type(3) {
|
||||
font-size: 20px;
|
||||
color: #1F2859;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// item 탭메뉴
|
||||
.sub-container {
|
||||
width: 49%;
|
||||
height: calc(100% - 25px);
|
||||
|
||||
.button-box {
|
||||
&.main-table {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&.sub-table {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-menu {
|
||||
gap: 5px;
|
||||
margin-bottom: 10px;
|
||||
border-bottom: solid 2px $blue-005;
|
||||
border-bottom: solid 2px #162788;
|
||||
|
||||
li {
|
||||
border-left: solid 2px $blue-005;
|
||||
border-right: solid 2px $blue-005;
|
||||
border-top: solid 2px $blue-005;
|
||||
border-radius: 5px 5px 0px 0px;
|
||||
padding: 10px 12px;
|
||||
color: black;
|
||||
}
|
||||
.first-tab {
|
||||
background-color: $blue-005;
|
||||
border-left: solid 2px #162788;
|
||||
border-right: solid 2px #162788;
|
||||
border-top: solid 2px #162788;
|
||||
border-radius: 5px 5px 0 0;
|
||||
padding: 7px 12px;
|
||||
background-color: white;
|
||||
color: #162788;
|
||||
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
|
||||
&:hover{
|
||||
background-color: #162788;
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.on {
|
||||
background-color: #162788;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tab-container {
|
||||
height: 98%;
|
||||
|
||||
|
||||
> div {
|
||||
display: none;
|
||||
height: calc(100vh - 320px);
|
||||
|
||||
.table-box:first-of-type, .tab-box:first-of-type {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
.table-title {
|
||||
position: absolute;
|
||||
top: -35px;
|
||||
right: 0;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.first-table-container {
|
||||
display: flex;
|
||||
height: calc(100% - 20px);
|
||||
}
|
||||
.second-table-container {
|
||||
display: none;
|
||||
height: calc(100% - 20px);
|
||||
}
|
||||
&.on {
|
||||
.first-tab {
|
||||
background-color: white;
|
||||
color: black;
|
||||
}
|
||||
.second-tab {
|
||||
background-color: $blue-005;
|
||||
color: white;
|
||||
}
|
||||
.first-table-container {
|
||||
display: none;
|
||||
}
|
||||
.second-table-container {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// item 탭메뉴
|
||||
// .sub-container {
|
||||
// width: 49%;
|
||||
// height: calc(100% - 25px);
|
||||
|
||||
// .tab-menu {
|
||||
// gap: 5px;
|
||||
// margin-bottom: 10px;
|
||||
// border-bottom: solid 2px $blue-005;
|
||||
|
||||
// li {
|
||||
// border-left: solid 2px $blue-005;
|
||||
// border-right: solid 2px $blue-005;
|
||||
// border-top: solid 2px $blue-005;
|
||||
// border-radius: 5px 5px 0px 0px;
|
||||
// padding: 10px 12px;
|
||||
// color: black;
|
||||
// }
|
||||
// .first-tab {
|
||||
// background-color: $blue-005;
|
||||
// color: white;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .first-table-container {
|
||||
// display: flex;
|
||||
// height: calc(100% - 20px);
|
||||
// }
|
||||
// .second-table-container {
|
||||
// display: none;
|
||||
// height: calc(100% - 20px);
|
||||
// }
|
||||
// &.on {
|
||||
// .first-tab {
|
||||
// background-color: white;
|
||||
// color: black;
|
||||
// }
|
||||
// .second-tab {
|
||||
// background-color: $blue-005;
|
||||
// color: white;
|
||||
// }
|
||||
// .first-table-container {
|
||||
// display: none;
|
||||
// }
|
||||
// .second-table-container {
|
||||
// display: flex;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// 메인 프레임
|
||||
.table-title {
|
||||
display: flex;
|
||||
|
|
@ -166,7 +339,7 @@ button {
|
|||
}
|
||||
|
||||
.contents-container {
|
||||
height: calc(100vh - 140px);
|
||||
height: calc(100vh - 235px);
|
||||
width: 100%;
|
||||
|
||||
&.full-height {
|
||||
|
|
@ -175,7 +348,7 @@ button {
|
|||
|
||||
.table-container {
|
||||
width: 100%;
|
||||
height: calc(100% - 40px);
|
||||
height: 98%;
|
||||
margin: 10px 0 30px 0;
|
||||
|
||||
.inner-container {
|
||||
|
|
@ -210,7 +383,9 @@ button {
|
|||
width: 100%;
|
||||
height: 98%;
|
||||
}
|
||||
.flexrow {
|
||||
.sub-table, .inner-container{
|
||||
|
||||
&.flexrow {
|
||||
width: 100%;
|
||||
> .table-box {
|
||||
width: 49%;
|
||||
|
|
@ -219,6 +394,7 @@ button {
|
|||
width: 49%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.flexcol {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
|
@ -232,3 +408,42 @@ button {
|
|||
}
|
||||
|
||||
|
||||
.tb-height-full {
|
||||
height: calc(100vh - 320px);
|
||||
}
|
||||
|
||||
.tb-height-half {
|
||||
height: calc(50vh - 205px);
|
||||
}
|
||||
|
||||
.tb-height-30 {
|
||||
height: calc(100vh - 600px);
|
||||
}
|
||||
|
||||
.label-tag{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 25px;
|
||||
width: 60px;
|
||||
border-radius: 5px;
|
||||
|
||||
span{
|
||||
width: 6px;
|
||||
height: 100%;
|
||||
margin-right: 9px;
|
||||
}
|
||||
}
|
||||
|
||||
.blue-back{
|
||||
background-color: #d2e7ff;
|
||||
}
|
||||
.green-back{
|
||||
background-color: #d2ffd5;
|
||||
}
|
||||
.orange-back{
|
||||
background-color: #ffe0d2;
|
||||
}
|
||||
.gray-back{
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
|
|
@ -1,77 +1,163 @@
|
|||
// form 관련 css
|
||||
// form.flexrow {
|
||||
// .text-container {
|
||||
// width: 100%;
|
||||
// overflow-y: auto;
|
||||
|
||||
// .row-input-box {
|
||||
// width: fit-content;
|
||||
|
||||
// input {
|
||||
// height: 15px;
|
||||
// }
|
||||
// .width-15 {
|
||||
// width: 15%;
|
||||
// min-width: 65px;
|
||||
// }
|
||||
// .width-30 {
|
||||
// width: 30%;
|
||||
// min-width: 140px;
|
||||
// }
|
||||
// label {
|
||||
// min-width: 55px;
|
||||
// width: 12%;
|
||||
// display: block;
|
||||
// padding: 5px;
|
||||
// text-wrap: nowrap;
|
||||
// text-align: end;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .img-container {
|
||||
// width: 400px;
|
||||
// border: solid 1px black;
|
||||
// }
|
||||
|
||||
// }
|
||||
|
||||
|
||||
form {
|
||||
height: 100%;
|
||||
|
||||
// 현장 작업자 실적등록 팝업
|
||||
&[name=frmWorkData]{
|
||||
width: 80vw;
|
||||
|
||||
&>div{
|
||||
width: 100%;
|
||||
|
||||
&.form-button-container{
|
||||
height: 80px;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.form-button-box{
|
||||
border-bottom: solid 2px #162788;
|
||||
width: 50%;
|
||||
|
||||
button{
|
||||
width: fit-content;
|
||||
padding: 0px 10px;
|
||||
height: 32px;
|
||||
border-radius: 5px 5px 0 0;
|
||||
background: #162788;
|
||||
color: white;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
&.form-contents{
|
||||
.info-container{
|
||||
height: fit-content;
|
||||
width: 50%;
|
||||
}
|
||||
.detail-container{
|
||||
height: 510px;
|
||||
width: 50%;
|
||||
overflow: hidden;
|
||||
|
||||
.detail-contents{
|
||||
width: 100%;
|
||||
|
||||
.form-header{
|
||||
width: 100%;
|
||||
|
||||
textarea{
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.add-btn{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.table-box{
|
||||
width: 100%;
|
||||
height: calc(100% - 70px);
|
||||
|
||||
&>div{
|
||||
width: 100%;
|
||||
}
|
||||
.tab-menu{
|
||||
width: 100%;
|
||||
}
|
||||
.table-title{
|
||||
width: 99%;
|
||||
|
||||
.button-box{
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.hy-table{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.height-full{
|
||||
height: 100% !important;
|
||||
}
|
||||
.height-89{
|
||||
height: 89% !important;
|
||||
}
|
||||
.height-half{
|
||||
height: calc(100% - 220px) !important;
|
||||
}
|
||||
.round-tab-box{
|
||||
width: calc(100% - 120px);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 설비관리 대장 팝업
|
||||
&[name=frmFacility]{
|
||||
width: 800px;
|
||||
height: 525px;
|
||||
}
|
||||
|
||||
// 거래처 등록 팝업
|
||||
&[name=frmPartner]{
|
||||
width: 800px;
|
||||
min-height: 525px;
|
||||
height: 70vh;
|
||||
}
|
||||
|
||||
.add-btn, .remove-btn {
|
||||
padding: 7px 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.form-contents {
|
||||
padding-top: 20px;
|
||||
height: auto !important;
|
||||
height: 70% !important;
|
||||
overflow: hidden;
|
||||
|
||||
.form-box {
|
||||
padding-bottom: 20px;
|
||||
border-bottom: solid 1px;
|
||||
overflow: auto;
|
||||
background: #F6F6FC;
|
||||
height: 100%;
|
||||
padding: 20px 0px;
|
||||
|
||||
.input-container {
|
||||
width: 100%;
|
||||
width: calc(100% - 10px);
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.input-box {
|
||||
width: 100%;
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
align-items: center;
|
||||
|
||||
label, .input-title {
|
||||
display: inline-block;
|
||||
text-align: justify;
|
||||
width: 100px;
|
||||
padding-right: 10px;
|
||||
margin: 0;
|
||||
|
||||
:after{
|
||||
content: "";
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
text-align: end;
|
||||
}
|
||||
input[type=button]{
|
||||
width: 80px;
|
||||
margin: 0 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
label.form_toggle, .input-title.form_toggle {
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.check-label {
|
||||
display: inline-flex;
|
||||
width: 100px;
|
||||
|
|
@ -81,13 +167,80 @@ form{
|
|||
width: auto;
|
||||
}
|
||||
}
|
||||
input[type="text"], select{
|
||||
|
||||
input[type=text], input[type=tel], input[type=datetime-local], select, textarea {
|
||||
border: solid 1px #c7c7c7;
|
||||
box-sizing: border-box;
|
||||
height: 30px;
|
||||
width: calc(100% - 120px);
|
||||
min-width: 100px;
|
||||
padding: 0px 10px;
|
||||
|
||||
&.sub-input{
|
||||
width: calc(100% - 6px);
|
||||
}
|
||||
}
|
||||
|
||||
.input-text{
|
||||
width: calc(50% - 65px) !important;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.img-container {
|
||||
padding-right: 10px;
|
||||
height: 100%;
|
||||
gap: 5%;
|
||||
|
||||
.img-box {
|
||||
height: 85%;
|
||||
width: calc(100% - 2px);
|
||||
border: solid 1px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
background-color: white;
|
||||
|
||||
.img-cover {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(8, 8, 8, 0.322);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
input {
|
||||
width: 30%;
|
||||
height: 10%;
|
||||
text-align: center;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover .img-cover {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
height: 10%;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.2em;
|
||||
|
||||
input {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -105,6 +258,7 @@ form{
|
|||
|
||||
&:hover{
|
||||
background: white;
|
||||
border: solid 2px #f38814 !important;
|
||||
color: #f38814;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,53 +2,75 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
z-index: 10;
|
||||
|
||||
.awn-popup-body {
|
||||
background: #fff;
|
||||
box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.20);
|
||||
box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 5px;
|
||||
|
||||
font-size: 14px;
|
||||
max-width: 833px;
|
||||
// max-width: 833px;
|
||||
max-width: max-content;
|
||||
min-width: 500px;
|
||||
height: 531px;
|
||||
min-height: 531px;
|
||||
// max-height: fit-content;
|
||||
// height: 80vh;
|
||||
padding: 24px;
|
||||
|
||||
position: relative;
|
||||
word-break: break-word;
|
||||
|
||||
.awn-popup-confirm{
|
||||
&>div{
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
|
||||
.awn-form{
|
||||
|
||||
.awn-popup-search{
|
||||
height: 100%;
|
||||
}
|
||||
.table-box{
|
||||
padding: 0 10px;
|
||||
width: calc(100% - 20px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.awn-popup-confirm.custom-popup {
|
||||
height: 500px;
|
||||
// overflow-y: auto;
|
||||
// overflow-x: hidden;
|
||||
overflow: hidden;
|
||||
&.free-height{
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.awn-popup-title {
|
||||
font-size: 20px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
i {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.awn-popup-search {
|
||||
|
||||
|
||||
.s_exp {
|
||||
margin: 0 0 10px 0;
|
||||
color: $blue-004;
|
||||
color: #1F2859;
|
||||
}
|
||||
|
||||
.s_fld {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
|
||||
height: 32px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
|
|
@ -57,29 +79,42 @@
|
|||
height: 100%;
|
||||
padding: 0 10px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $gray-003;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
.btn-danger{
|
||||
height: 100%;
|
||||
border: solid 2px red;
|
||||
border-radius: 3px;
|
||||
color: red;
|
||||
background-color: white;
|
||||
|
||||
&:hover{
|
||||
background-color: red;
|
||||
color: white;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.title-container{
|
||||
justify-content: space-between;
|
||||
}
|
||||
.awn-popup-content {
|
||||
max-height: 430px;
|
||||
height: 100%;
|
||||
padding: 0 10px;
|
||||
overflow: auto;
|
||||
.tabulator.hy-table{}
|
||||
|
||||
.tabulator.hy-table{
|
||||
height: 85%;;
|
||||
}
|
||||
}
|
||||
.form-contents{
|
||||
height: 90% !important;
|
||||
overflow: auto;
|
||||
|
||||
.form-box{
|
||||
height: fit-content;
|
||||
overflow: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#awn-popup-wrapper .awn-popup-body.awn-popup-confirm{
|
||||
height: auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
@ -161,5 +196,5 @@
|
|||
// }
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
// }
|
||||
// }
|
||||
|
|
@ -82,7 +82,7 @@
|
|||
.table-header .button-container{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
justify-content: flex-end;
|
||||
|
||||
}
|
||||
|
||||
|
|
@ -100,7 +100,7 @@
|
|||
|
||||
// table container
|
||||
.table-container .button-box{
|
||||
justify-content: end;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,38 +1,60 @@
|
|||
|
||||
.side-nav {
|
||||
max-width: 280px;
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
|
||||
border-right: solid 1px $gray-002;
|
||||
border-right: solid 1px #e9e9e9;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background: white;
|
||||
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.container.on {
|
||||
.side-nav {
|
||||
.container.on .side-nav {
|
||||
width: 88px;
|
||||
|
||||
.fold-btn-container {
|
||||
padding-left: 25%;
|
||||
overflow-y: visible;
|
||||
align-items: center;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container {
|
||||
position: static;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li {
|
||||
position: relative;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li span.fancytree-expander, .container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li span.fancytree-title {
|
||||
display: none;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li span.fancytree-custom-icon {
|
||||
margin: 0;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li ul {
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 56px;
|
||||
top: 0;
|
||||
width: 250px;
|
||||
background: #e9e9e9;
|
||||
z-index: 2;
|
||||
min-height: 52px;
|
||||
max-height: 294px;
|
||||
overflow: auto;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li ul li span.fancytree-title {
|
||||
color: black;
|
||||
display: block;
|
||||
}
|
||||
.container.on .side-nav .fold-btn-container {
|
||||
margin: 0 0 30px 0;
|
||||
padding-left: 0;
|
||||
width: auto;
|
||||
|
||||
.fold-btn {
|
||||
}
|
||||
.container.on .side-nav .fold-btn-container .fold-btn {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-part{
|
||||
.container.on .main-part {
|
||||
width: calc(100% - 88px);
|
||||
}
|
||||
}
|
||||
|
||||
.side-nav .fold-btn-container {
|
||||
margin-bottom: 30px;
|
||||
|
|
@ -52,126 +74,66 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.side-nav .side-menu{
|
||||
|
||||
ul.fancytree-plain.fancytree-container{
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container {
|
||||
border: none;
|
||||
padding: 0px;
|
||||
|
||||
> li > span{
|
||||
border-bottom: solid 1px $gray-002;
|
||||
}
|
||||
li {
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container > li > span {
|
||||
border-bottom: solid 1px #e9e9e9;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li {
|
||||
min-height: 72px;
|
||||
|
||||
|
||||
> span{
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span {
|
||||
height: 72px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
&:hover, &:active{
|
||||
span.fancytree-title{
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span:hover span.fancytree-title, .side-nav .side-menu ul.fancytree-plain.fancytree-container li > span:active span.fancytree-title {
|
||||
color: #3c3c3c;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
> span{
|
||||
// 글자
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span > span {
|
||||
color: #3c3c3c;
|
||||
font-size: 15px;
|
||||
|
||||
// 아이콘
|
||||
&.fancytree-custom-icon{
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span > span.fancytree-custom-icon {
|
||||
color: #98A7FA;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
// 활성화된 메뉴
|
||||
&.fancytree-node.fancytree-active{
|
||||
|
||||
span.fancytree-title{
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span.fancytree-node.fancytree-active span.fancytree-title {
|
||||
color: #3c3c3c;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
&:hover, &:active{
|
||||
span.fancytree-title{
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span.fancytree-node.fancytree-active:hover span.fancytree-title, .side-nav .side-menu ul.fancytree-plain.fancytree-container li > span.fancytree-node.fancytree-active:active span.fancytree-title {
|
||||
color: #3c3c3c;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 서브 메뉴
|
||||
ul{
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul {
|
||||
padding: 0px;
|
||||
|
||||
li{
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li {
|
||||
min-height: 48px;
|
||||
border-bottom: 1px solid $blue-003;
|
||||
|
||||
> span{
|
||||
border-bottom: 1px solid #E1E4F9;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li > span {
|
||||
height: 48px;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
padding-left: 1.5em;
|
||||
span.fancytree-title{
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li > span span.fancytree-title {
|
||||
font-size: 14px;
|
||||
color: $blue-001;
|
||||
color: #4A5ED2;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li:hover {
|
||||
background-color: #E1E4F9;
|
||||
}
|
||||
|
||||
&:hover{
|
||||
background-color: $blue-003;
|
||||
|
||||
span.fancytree-title{
|
||||
color: $blue-001;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.side-nav .side-menu {
|
||||
}
|
||||
|
||||
.side-nav .side-menu ul {
|
||||
}
|
||||
|
||||
.side-nav .side-menu ul li {
|
||||
}
|
||||
|
||||
.side-nav .side-menu ul li span {
|
||||
}
|
||||
|
||||
.side-nav .side-menu > ul {
|
||||
}
|
||||
|
||||
.side-nav .side-menu > ul li span{
|
||||
|
||||
}
|
||||
|
||||
.side-nav .side-menu > ul li.on {
|
||||
}
|
||||
|
||||
|
||||
|
||||
.side-nav .side-menu > ul > li > ul {
|
||||
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li:hover span.fancytree-title {
|
||||
color: #4A5ED2;
|
||||
}
|
||||
|
||||
.side-nav .side-menu > ul > li > ul > li {
|
||||
|
|
@ -179,7 +141,34 @@
|
|||
}
|
||||
|
||||
.side-nav .side-menu > ul > li > ul > li > span {
|
||||
color: $blue-001;
|
||||
color: #4A5ED2;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
.menu-icon.base-icon {
|
||||
background-image: url("../img/icon-shield.png");
|
||||
}
|
||||
.menu-icon.filed-icon {
|
||||
background-image: url("../img/icon-industry.png");
|
||||
}
|
||||
.menu-icon.production-icon {
|
||||
background-image: url("../img/icon-engineering.png");
|
||||
}
|
||||
.menu-icon.system-icon {
|
||||
background-image: url("../img/icon-gear.png");
|
||||
}
|
||||
.menu-icon.insp-icon {
|
||||
background-image: url("../img/icon-clipboard.svg");
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin-left: 0.6em;
|
||||
}
|
||||
.menu-icon.facility-icon {
|
||||
background-image: url("../img/icon-cone.svg");
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,7 +32,9 @@
|
|||
// 테이블 행
|
||||
.tabulator-row{
|
||||
background-color: transparent;
|
||||
border-bottom: solid 1px $gray-002;
|
||||
border: solid 0.5px $gray-002;
|
||||
border-left: solid 0.5px transparent;
|
||||
border-right: solid 0.5px transparent;
|
||||
|
||||
&:hover{
|
||||
background-color: $gray-003;
|
||||
|
|
@ -43,12 +45,27 @@
|
|||
&.remove-row{
|
||||
background-color: $red;
|
||||
}
|
||||
&.edit-row{
|
||||
background-color: #d2ddff;
|
||||
}
|
||||
&.blank-row{
|
||||
border: solid 0.5px red
|
||||
}
|
||||
|
||||
.tabulator-cell{
|
||||
border-right: solid 1px $gray-002;
|
||||
|
||||
// &.tabulator-editable{
|
||||
// background-color: transparent ;
|
||||
// &::after{
|
||||
// content: "";
|
||||
|
||||
// }
|
||||
// &:hover{
|
||||
// background-color: $gray-003;
|
||||
// }
|
||||
// }
|
||||
&.editable-cell, &.tabulator-editable{
|
||||
// background-color: rgba(221, 221, 255, 0.548) ;
|
||||
background-color: rgba(255, 253, 221, 0.548) ;
|
||||
&::after{
|
||||
content: "◥";
|
||||
|
|
@ -86,7 +103,7 @@
|
|||
|
||||
&.tabulator-col-group{
|
||||
.tabulator-col-group-cols{
|
||||
border-top: solid 1px $gray-002;
|
||||
border-top: solid 1px $gray-004;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -186,7 +203,7 @@
|
|||
}
|
||||
|
||||
.tb-height-full .cont_hfix{
|
||||
height: calc(100% - 43px);
|
||||
height: calc(100% - 44px);
|
||||
margin-top: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
@ -261,6 +278,12 @@
|
|||
&.width-200{
|
||||
width: 200px;
|
||||
}
|
||||
&.width-230{
|
||||
width: 230px;
|
||||
}
|
||||
&.width-800{
|
||||
width: 800px;
|
||||
}
|
||||
.tabulator-col-group-cols{
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -301,3 +324,26 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.status-table.vue-table{
|
||||
colgroup{
|
||||
col{}
|
||||
}
|
||||
thead{
|
||||
tr{
|
||||
th{}
|
||||
}
|
||||
}
|
||||
|
||||
tbody{
|
||||
tr{
|
||||
td{
|
||||
&.on{
|
||||
background-color: $gray-002;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -943,17 +943,24 @@ form[name=frmWorkData] > div {
|
|||
form[name=frmWorkData] > div.form-button-container {
|
||||
height: 80px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #e9e9e9;
|
||||
background: #FAFAFA;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
form[name=frmWorkData] > div.form-button-container button {
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
form[name=frmWorkData] > div.form-button-container .form-button-box {
|
||||
border-bottom: solid 2px #162788;
|
||||
width: 50%;
|
||||
}
|
||||
form[name=frmWorkData] > div.form-button-container .form-button-box button {
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
padding: 0px 10px;
|
||||
height: 32px;
|
||||
border-radius: 5px 5px 0 0;
|
||||
background: #162788;
|
||||
color: white;
|
||||
font-size: 13px;
|
||||
}
|
||||
form[name=frmWorkData] > div.form-contents .info-container {
|
||||
height: -moz-fit-content;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -15,13 +15,12 @@ include_once "{$_SERVER['DOCUMENT_ROOT']}/common.inc.php";
|
|||
<!-- form button-container -->
|
||||
<div class="form-button-container flexrow flexbetween">
|
||||
<div class="form-button-box flexrow gap06">
|
||||
<button class="form-button close-btn" type="button" @click="close">닫기</button>
|
||||
<button class="form-button point-btn" type="button" @click="showDefect">과거불량이력 조회</button>
|
||||
<button class="form-button point-btn" type="button" @click="showWrkDocs">작업표준서 조회</button>
|
||||
<button class="form-button point-btn" type="button" @click="showDraw">도면 조회</button>
|
||||
<button class="form-button" type="button" @click="showDefect">과거불량이력 조회</button>
|
||||
<button class="form-button" type="button" @click="showWrkDocs">작업표준서 조회</button>
|
||||
<button class="form-button" type="button" @click="showDraw">도면 조회</button>
|
||||
</div>
|
||||
<div class="form-button-box flexrow gap06">
|
||||
<button class="form-button point-btn" type="button" @click="showComponent('isFacltBreak')">설비 고장등록</button>
|
||||
<button class="form-button" type="button" @click="showComponent('isFacltBreak')">설비 고장등록</button>
|
||||
<button class="form-button run-btn" type="button" @click="showComponent('isRun')">가동</button>
|
||||
<button class="form-button norun-btn" type="button" @click="showComponent('isNoRun')">비가동</button>
|
||||
</div>
|
||||
|
|
|
|||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1,13 +0,0 @@
|
|||
// 컬러
|
||||
$blue-001: #4A5ED2;
|
||||
$blue-002: #CFD5FC;
|
||||
$blue-003: #E1E4F9;
|
||||
$blue-004: #1F2859;
|
||||
$blue-005: #162788;
|
||||
$blue-006: #b9c4ff;
|
||||
$gray-001: #B0B0B0;
|
||||
$gray-002: #e9e9e9;
|
||||
$gray-003: #D9D9D9;
|
||||
$gray-004: #c7c7c7;
|
||||
|
||||
$red: #FFD2D2;
|
||||
|
|
@ -1,449 +0,0 @@
|
|||
// 공통
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
* {
|
||||
font-family: "Pretendard";
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
li,
|
||||
label,
|
||||
input,
|
||||
button,
|
||||
a {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
ul,
|
||||
li,
|
||||
ol,
|
||||
a {
|
||||
list-style: none;
|
||||
text-decoration: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// 버튼 디자인
|
||||
button {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.point-btn {
|
||||
border: solid 1px #828282;
|
||||
background-color: #828282;
|
||||
color: rgba(255, 255, 255, 0.973);
|
||||
border-radius: 3px;
|
||||
padding: 8px 30px !important;
|
||||
|
||||
text-wrap: nowrap;
|
||||
font-size: 13px;
|
||||
}
|
||||
.point-btn:hover {
|
||||
color: #828282;
|
||||
background-color: rgba(255, 255, 255, 0.973);
|
||||
}
|
||||
|
||||
.basic-btn {
|
||||
border: solid 2px transparent;
|
||||
border-radius: 5px;
|
||||
background-color: $blue-005;
|
||||
color: white;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.basic-btn:hover {
|
||||
background-color: white;
|
||||
border: solid 2px $blue-005;
|
||||
color: $blue-005;
|
||||
}
|
||||
.reverse-btn:hover {
|
||||
background-color: $blue-005;
|
||||
border: solid 2px transparent;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.reverse-btn {
|
||||
background-color: white;
|
||||
border: solid 2px $blue-005;
|
||||
color: $blue-005;
|
||||
border-radius: 5px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
height: 100%;
|
||||
border: solid 2px red;
|
||||
border-radius: 3px;
|
||||
color: red;
|
||||
background-color: white;
|
||||
|
||||
&:hover {
|
||||
background-color: red;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.close-btn {
|
||||
border: solid 2px #cf5b5b;
|
||||
color: white;
|
||||
background-color: #cf5b5b;
|
||||
|
||||
border-radius: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: white;
|
||||
color: #cf5b5b;
|
||||
}
|
||||
}
|
||||
.run-btn {
|
||||
border: solid 2px #5b73cf;
|
||||
color: white;
|
||||
background-color: #5b73cf;
|
||||
|
||||
border-radius: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: white;
|
||||
color: #5b73cf;
|
||||
}
|
||||
}
|
||||
.norun-btn {
|
||||
border: solid 2px #f3da8f;
|
||||
color: white;
|
||||
background-color: #f3da8f;
|
||||
|
||||
border-radius: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: white;
|
||||
color: #f3da8f;
|
||||
}
|
||||
}
|
||||
|
||||
.disabled-btn {
|
||||
background-color: rgba(255, 255, 255, 0.973);
|
||||
color: #dddddd;
|
||||
border-color: #e9e9e9;
|
||||
cursor: default;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(255, 255, 255, 0.973);
|
||||
color: #dddddd;
|
||||
border-color: #e9e9e9;
|
||||
}
|
||||
}
|
||||
|
||||
.tab-btn {
|
||||
background-color: white;
|
||||
color: black;
|
||||
border: solid 1px $gray-004;
|
||||
height: 30px;
|
||||
width: 25%;
|
||||
border-right: none;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: $gray-004;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.left-round{
|
||||
border-radius: 50px 0px 0px 50px;
|
||||
}
|
||||
|
||||
.right-round{
|
||||
border-radius: 0px 50px 50px 0px;
|
||||
border-right: solid 1px $gray-004;
|
||||
}
|
||||
|
||||
// 전체 프레임
|
||||
.have-image {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.container {
|
||||
height: calc(100vh - 48px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.container .main-part {
|
||||
width: calc(100% - 280px);
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
.inner-container {
|
||||
padding: 20px 15px;
|
||||
|
||||
a, i {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
a:nth-of-type(3) {
|
||||
font-size: 20px;
|
||||
color: #1F2859;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-container {
|
||||
width: 49%;
|
||||
height: calc(100% - 25px);
|
||||
|
||||
.button-box {
|
||||
&.main-table {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&.sub-table {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-menu {
|
||||
gap: 5px;
|
||||
border-bottom: solid 2px #162788;
|
||||
|
||||
li {
|
||||
border-left: solid 2px #162788;
|
||||
border-right: solid 2px #162788;
|
||||
border-top: solid 2px #162788;
|
||||
border-radius: 5px 5px 0 0;
|
||||
padding: 7px 12px;
|
||||
background-color: white;
|
||||
color: #162788;
|
||||
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
|
||||
&:hover{
|
||||
background-color: #162788;
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.on {
|
||||
background-color: #162788;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tab-container {
|
||||
height: 98%;
|
||||
|
||||
|
||||
> div {
|
||||
display: none;
|
||||
height: calc(100vh - 320px);
|
||||
|
||||
.table-box:first-of-type, .tab-box:first-of-type {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
.table-title {
|
||||
position: absolute;
|
||||
top: -35px;
|
||||
right: 0;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&.on {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// item 탭메뉴
|
||||
// .sub-container {
|
||||
// width: 49%;
|
||||
// height: calc(100% - 25px);
|
||||
|
||||
// .tab-menu {
|
||||
// gap: 5px;
|
||||
// margin-bottom: 10px;
|
||||
// border-bottom: solid 2px $blue-005;
|
||||
|
||||
// li {
|
||||
// border-left: solid 2px $blue-005;
|
||||
// border-right: solid 2px $blue-005;
|
||||
// border-top: solid 2px $blue-005;
|
||||
// border-radius: 5px 5px 0px 0px;
|
||||
// padding: 10px 12px;
|
||||
// color: black;
|
||||
// }
|
||||
// .first-tab {
|
||||
// background-color: $blue-005;
|
||||
// color: white;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .first-table-container {
|
||||
// display: flex;
|
||||
// height: calc(100% - 20px);
|
||||
// }
|
||||
// .second-table-container {
|
||||
// display: none;
|
||||
// height: calc(100% - 20px);
|
||||
// }
|
||||
// &.on {
|
||||
// .first-tab {
|
||||
// background-color: white;
|
||||
// color: black;
|
||||
// }
|
||||
// .second-tab {
|
||||
// background-color: $blue-005;
|
||||
// color: white;
|
||||
// }
|
||||
// .first-table-container {
|
||||
// display: none;
|
||||
// }
|
||||
// .second-table-container {
|
||||
// display: flex;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// 메인 프레임
|
||||
.table-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: end;
|
||||
height: 32px;
|
||||
|
||||
p {
|
||||
font-size: 16px;
|
||||
margin: 0;
|
||||
text-wrap: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.contents-container {
|
||||
height: calc(100vh - 235px);
|
||||
width: 100%;
|
||||
|
||||
&.full-height {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
width: 100%;
|
||||
height: 98%;
|
||||
margin: 10px 0 30px 0;
|
||||
|
||||
.inner-container {
|
||||
width: calc(100% - 80px);
|
||||
height: calc(100% - 24px);
|
||||
border-radius: 5px;
|
||||
border: 1px solid $gray-002;
|
||||
padding: 24px 15px 0px 15px;
|
||||
|
||||
.sub-table {
|
||||
.table-box {
|
||||
width: 49%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-container {
|
||||
height: 90%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.inner-container {
|
||||
margin: 0 25px;
|
||||
padding: 0 15px;
|
||||
> .flexrow,
|
||||
> .flexcol {
|
||||
height: calc(100% - 15px);
|
||||
}
|
||||
}
|
||||
|
||||
.table-box {
|
||||
width: 100%;
|
||||
height: 98%;
|
||||
}
|
||||
.sub-table, .inner-container{
|
||||
|
||||
&.flexrow {
|
||||
width: 100%;
|
||||
> .table-box {
|
||||
width: 49%;
|
||||
}
|
||||
> .flexcol {
|
||||
width: 49%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.flexcol {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
> .table-box {
|
||||
width: 100%;
|
||||
height: 49%;
|
||||
}
|
||||
> .flexrow {
|
||||
height: 49%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.tb-height-full {
|
||||
height: calc(100vh - 320px);
|
||||
}
|
||||
|
||||
.tb-height-half {
|
||||
height: calc(50vh - 205px);
|
||||
}
|
||||
|
||||
.tb-height-30 {
|
||||
height: calc(100vh - 600px);
|
||||
}
|
||||
|
||||
.label-tag{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 25px;
|
||||
width: 60px;
|
||||
border-radius: 5px;
|
||||
|
||||
span{
|
||||
width: 6px;
|
||||
height: 100%;
|
||||
margin-right: 9px;
|
||||
}
|
||||
}
|
||||
|
||||
.blue-back{
|
||||
background-color: #d2e7ff;
|
||||
}
|
||||
.green-back{
|
||||
background-color: #d2ffd5;
|
||||
}
|
||||
.orange-back{
|
||||
background-color: #ffe0d2;
|
||||
}
|
||||
.gray-back{
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
|
|
@ -1,257 +0,0 @@
|
|||
form {
|
||||
height: 100%;
|
||||
|
||||
// 현장 작업자 실적등록 팝업
|
||||
&[name=frmWorkData]{
|
||||
width: 80vw;
|
||||
|
||||
&>div{
|
||||
width: 100%;
|
||||
|
||||
&.form-button-container{
|
||||
height: 80px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #e9e9e9;
|
||||
background: #FAFAFA;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
|
||||
button{
|
||||
width: 150px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.form-contents{
|
||||
.info-container{
|
||||
height: fit-content;
|
||||
width: 50%;
|
||||
}
|
||||
.detail-container{
|
||||
height: 510px;
|
||||
width: 50%;
|
||||
overflow: hidden;
|
||||
|
||||
.detail-contents{
|
||||
width: 100%;
|
||||
|
||||
.form-header{
|
||||
width: 100%;
|
||||
|
||||
textarea{
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.add-btn{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.table-box{
|
||||
width: 100%;
|
||||
height: calc(100% - 70px);
|
||||
|
||||
&>div{
|
||||
width: 100%;
|
||||
}
|
||||
.tab-menu{
|
||||
width: 100%;
|
||||
}
|
||||
.table-title{
|
||||
width: 99%;
|
||||
|
||||
.button-box{
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.hy-table{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.height-full{
|
||||
height: 100% !important;
|
||||
}
|
||||
.height-89{
|
||||
height: 89% !important;
|
||||
}
|
||||
.height-half{
|
||||
height: calc(100% - 220px) !important;
|
||||
}
|
||||
.round-tab-box{
|
||||
width: calc(100% - 120px);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 설비관리 대장 팝업
|
||||
&[name=frmFacility]{
|
||||
width: 800px;
|
||||
height: 525px;
|
||||
}
|
||||
|
||||
// 거래처 등록 팝업
|
||||
&[name=frmPartner]{
|
||||
width: 800px;
|
||||
min-height: 525px;
|
||||
height: 70vh;
|
||||
}
|
||||
|
||||
.add-btn, .remove-btn {
|
||||
padding: 7px 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.form-contents {
|
||||
height: 70% !important;
|
||||
overflow: hidden;
|
||||
|
||||
.form-box {
|
||||
overflow: auto;
|
||||
background: #F6F6FC;
|
||||
height: 100%;
|
||||
padding: 20px 0px;
|
||||
|
||||
.input-container {
|
||||
width: calc(100% - 10px);
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.input-box {
|
||||
width: 100%;
|
||||
height: -moz-fit-content;
|
||||
height: fit-content;
|
||||
align-items: center;
|
||||
|
||||
label, .input-title {
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
padding-right: 10px;
|
||||
margin: 0;
|
||||
text-align: end;
|
||||
}
|
||||
input[type=button]{
|
||||
width: 80px;
|
||||
margin: 0 15px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
label.form_toggle, .input-title.form_toggle {
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.check-label {
|
||||
display: inline-flex;
|
||||
width: 100px;
|
||||
align-items: center;
|
||||
|
||||
label {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
input[type=text], input[type=tel], input[type=datetime-local], select, textarea {
|
||||
border: solid 1px #c7c7c7;
|
||||
box-sizing: border-box;
|
||||
height: 30px;
|
||||
width: calc(100% - 120px);
|
||||
min-width: 100px;
|
||||
padding: 0px 10px;
|
||||
|
||||
&.sub-input{
|
||||
width: calc(100% - 6px);
|
||||
}
|
||||
}
|
||||
|
||||
.input-text{
|
||||
width: calc(50% - 65px) !important;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.img-container {
|
||||
padding-right: 10px;
|
||||
height: 100%;
|
||||
gap: 5%;
|
||||
|
||||
.img-box {
|
||||
height: 85%;
|
||||
width: calc(100% - 2px);
|
||||
border: solid 1px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
background-color: white;
|
||||
|
||||
.img-cover {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(8, 8, 8, 0.322);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
input {
|
||||
width: 30%;
|
||||
height: 10%;
|
||||
text-align: center;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover .img-cover {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
height: 10%;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.2em;
|
||||
|
||||
input {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-box{
|
||||
width: 98%;
|
||||
}
|
||||
|
||||
.btnFindAddr{
|
||||
height: 98%;
|
||||
border-radius: 5px;
|
||||
border: solid 2px #f38814;
|
||||
background-color: #f38814;
|
||||
color: white;
|
||||
|
||||
&:hover{
|
||||
background: white;
|
||||
border: solid 2px #f38814 !important;
|
||||
color: #f38814;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
header {
|
||||
background: $blue-004;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 48px;
|
||||
padding: 0px 25px;
|
||||
}
|
||||
|
||||
header .logo-container {
|
||||
margin-left: 50px;
|
||||
}
|
||||
|
||||
header .logo-container .logo-box {
|
||||
background: url(../img/logo.png);
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
height: 36px;
|
||||
width: 166px;
|
||||
}
|
||||
|
||||
header .status-menu {}
|
||||
|
||||
header .status-menu ul {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
header .status-menu ul li:not(:last-child) {
|
||||
padding: 0 10px;
|
||||
border-right: solid 2px $blue-002;
|
||||
}
|
||||
|
||||
header .status-menu ul li a {
|
||||
text-decoration: none;
|
||||
color: $blue-002;
|
||||
}
|
||||
|
|
@ -1,200 +0,0 @@
|
|||
#awn-popup-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
z-index: 10;
|
||||
|
||||
.awn-popup-body {
|
||||
background: #fff;
|
||||
box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 5px;
|
||||
font-size: 14px;
|
||||
// max-width: 833px;
|
||||
max-width: max-content;
|
||||
min-width: 500px;
|
||||
min-height: 531px;
|
||||
// max-height: fit-content;
|
||||
// height: 80vh;
|
||||
padding: 24px;
|
||||
position: relative;
|
||||
word-break: break-word;
|
||||
|
||||
&>div{
|
||||
height: 100%;
|
||||
|
||||
.awn-form{
|
||||
|
||||
.awn-popup-search{
|
||||
height: 100%;
|
||||
}
|
||||
.table-box{
|
||||
padding: 0 10px;
|
||||
width: calc(100% - 20px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.awn-popup-confirm.custom-popup {
|
||||
height: 500px;
|
||||
// overflow-y: auto;
|
||||
// overflow-x: hidden;
|
||||
overflow: hidden;
|
||||
&.free-height{
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.awn-popup-title {
|
||||
font-size: 20px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
i {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.awn-popup-search {
|
||||
|
||||
|
||||
.s_exp {
|
||||
margin: 0 0 10px 0;
|
||||
color: #1F2859;
|
||||
}
|
||||
|
||||
.s_fld {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
height: 32px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
select, input {
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
padding: 0 10px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.title-container{
|
||||
justify-content: space-between;
|
||||
}
|
||||
.awn-popup-content {
|
||||
max-height: 430px;
|
||||
height: 100%;
|
||||
padding: 0 10px;
|
||||
overflow: auto;
|
||||
|
||||
.tabulator.hy-table{
|
||||
height: 85%;;
|
||||
}
|
||||
}
|
||||
.form-contents{
|
||||
height: 90% !important;
|
||||
overflow: auto;
|
||||
|
||||
.form-box{
|
||||
height: fit-content;
|
||||
overflow: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#awn-popup-wrapper .awn-popup-body.awn-popup-confirm{
|
||||
height: auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// form{
|
||||
// .add-btn, .remove-btn{
|
||||
// padding: 7px 12px;
|
||||
// cursor: pointer;
|
||||
// }
|
||||
// .title-container{
|
||||
// align-items: center;
|
||||
// justify-content: space-between;
|
||||
// padding-bottom: 10px;
|
||||
// border-bottom: 1px solid;
|
||||
|
||||
// .awn-popup-title{
|
||||
// margin: 0;
|
||||
// }
|
||||
// .button-box{
|
||||
// justify-content: flex-end;
|
||||
|
||||
// button{
|
||||
// margin-right: 20px;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .form-contents{
|
||||
// padding-top: 20px;
|
||||
|
||||
// .form-box{
|
||||
// padding-bottom: 20px;
|
||||
// border-bottom: solid 1px;
|
||||
|
||||
// .input-container{
|
||||
// width: 100%;
|
||||
|
||||
// .input-box{
|
||||
// width: 100%;
|
||||
|
||||
// label, .input-title{
|
||||
// display: inline-block;
|
||||
// width: 100px;
|
||||
// margin: 0;
|
||||
|
||||
// }
|
||||
// .check-label{
|
||||
// display: inline-flex;
|
||||
// width: 100px;
|
||||
// align-items: center;
|
||||
|
||||
// label{
|
||||
// width: auto;
|
||||
// }
|
||||
// }
|
||||
// input[type="text"], select{
|
||||
// box-sizing: border-box;
|
||||
// height: 30px;
|
||||
// width: calc(100% - 120px);
|
||||
// padding: 0px 10px;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// .table-box{
|
||||
// width: 98%;
|
||||
// }
|
||||
|
||||
// .btnFindAddr{
|
||||
// height: 98%;
|
||||
// border-radius: 5px;
|
||||
// border: solid 2px #f38814;
|
||||
// background-color: #f38814;
|
||||
// color: white;
|
||||
|
||||
// &:hover{
|
||||
// background: white;
|
||||
// color: #f38814;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
::-webkit-scrollbar {
|
||||
height: 5px;
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
/* 스크롤바 트랙 (바탕) 스타일 */
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f1f1; /* 트랙의 배경 색상 */
|
||||
}
|
||||
|
||||
/* 스크롤바 핸들 (움직이는 부분) 스타일 */
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: $gray-001; /* 핸들의 배경 색상 */
|
||||
}
|
||||
|
||||
/* 스크롤바 핸들:hover 스타일 */
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #7e7e7e; /* 핸들의 배경 색상(마우스 오버 시) */
|
||||
}
|
||||
|
|
@ -1,106 +0,0 @@
|
|||
.table-header{
|
||||
width: 100%;
|
||||
margin-top: 25px;
|
||||
|
||||
&>div{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 100px;
|
||||
|
||||
height: 84px;
|
||||
overflow-x: auto;
|
||||
|
||||
border-radius: 5px;
|
||||
border: 1px solid $gray-002;
|
||||
background: #FAFAFA;
|
||||
}
|
||||
.search-container{
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
gap: 20px;
|
||||
font-size: 13px;
|
||||
|
||||
.input-container{
|
||||
|
||||
&.checkbox-container{
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
|
||||
label{
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
}
|
||||
.input-box{
|
||||
justify-content: center;
|
||||
height: 32px;
|
||||
align-items: center;
|
||||
|
||||
input{
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&>div{
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
}
|
||||
}
|
||||
.input-box{
|
||||
position:relative;
|
||||
|
||||
svg{
|
||||
position: absolute;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
color: $blue-005;
|
||||
cursor: pointer;
|
||||
}
|
||||
input, select{
|
||||
border-radius: 3px;
|
||||
border: 1px solid $gray-003;
|
||||
background: #FFF;
|
||||
height: 32px;
|
||||
width: 140px;
|
||||
padding: 0 10px;
|
||||
box-sizing: border-box;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.table-header .button-container{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
}
|
||||
|
||||
.button-box{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
|
||||
button{
|
||||
padding: 7px 12px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// table container
|
||||
.table-container .button-box{
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -1,174 +0,0 @@
|
|||
|
||||
.side-nav {
|
||||
max-width: 280px;
|
||||
width: 100%;
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
border-right: solid 1px #e9e9e9;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.container.on .side-nav {
|
||||
width: 88px;
|
||||
overflow-y: visible;
|
||||
align-items: center;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container {
|
||||
position: static;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li {
|
||||
position: relative;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li span.fancytree-expander, .container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li span.fancytree-title {
|
||||
display: none;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li span.fancytree-custom-icon {
|
||||
margin: 0;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li ul {
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 56px;
|
||||
top: 0;
|
||||
width: 250px;
|
||||
background: #e9e9e9;
|
||||
z-index: 2;
|
||||
min-height: 52px;
|
||||
max-height: 294px;
|
||||
overflow: auto;
|
||||
}
|
||||
.container.on .side-nav .side-menu ul.fancytree-plain.fancytree-container > li ul li span.fancytree-title {
|
||||
color: black;
|
||||
display: block;
|
||||
}
|
||||
.container.on .side-nav .fold-btn-container {
|
||||
margin: 0 0 30px 0;
|
||||
padding-left: 0;
|
||||
width: auto;
|
||||
}
|
||||
.container.on .side-nav .fold-btn-container .fold-btn {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.container.on .main-part {
|
||||
width: calc(100% - 88px);
|
||||
}
|
||||
|
||||
.side-nav .fold-btn-container {
|
||||
margin-bottom: 30px;
|
||||
margin-top: 50px;
|
||||
padding-left: 10%;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.side-nav .fold-btn-container .fold-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-image: url(../img/foldIcon.svg);
|
||||
background-size: 17px 19.5px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #e0e0e0;
|
||||
background-color: #fafafa;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container {
|
||||
border: none;
|
||||
padding: 0px;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container > li > span {
|
||||
border-bottom: solid 1px #e9e9e9;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li {
|
||||
min-height: 72px;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span {
|
||||
height: 72px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span:hover span.fancytree-title, .side-nav .side-menu ul.fancytree-plain.fancytree-container li > span:active span.fancytree-title {
|
||||
color: #3c3c3c;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span > span {
|
||||
color: #3c3c3c;
|
||||
font-size: 15px;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span > span.fancytree-custom-icon {
|
||||
color: #98A7FA;
|
||||
font-size: 24px;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span.fancytree-node.fancytree-active span.fancytree-title {
|
||||
color: #3c3c3c;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li > span.fancytree-node.fancytree-active:hover span.fancytree-title, .side-nav .side-menu ul.fancytree-plain.fancytree-container li > span.fancytree-node.fancytree-active:active span.fancytree-title {
|
||||
color: #3c3c3c;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul {
|
||||
padding: 0px;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li {
|
||||
min-height: 48px;
|
||||
border-bottom: 1px solid #E1E4F9;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li > span {
|
||||
height: 48px;
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li > span span.fancytree-title {
|
||||
font-size: 14px;
|
||||
color: #4A5ED2;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li:hover {
|
||||
background-color: #E1E4F9;
|
||||
}
|
||||
.side-nav .side-menu ul.fancytree-plain.fancytree-container li ul li:hover span.fancytree-title {
|
||||
color: #4A5ED2;
|
||||
}
|
||||
|
||||
.side-nav .side-menu > ul > li > ul > li {
|
||||
height: 47px;
|
||||
}
|
||||
|
||||
.side-nav .side-menu > ul > li > ul > li > span {
|
||||
color: #4A5ED2;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
.menu-icon.base-icon {
|
||||
background-image: url("../img/icon-shield.png");
|
||||
}
|
||||
.menu-icon.filed-icon {
|
||||
background-image: url("../img/icon-industry.png");
|
||||
}
|
||||
.menu-icon.production-icon {
|
||||
background-image: url("../img/icon-engineering.png");
|
||||
}
|
||||
.menu-icon.system-icon {
|
||||
background-image: url("../img/icon-gear.png");
|
||||
}
|
||||
.menu-icon.insp-icon {
|
||||
background-image: url("../img/icon-clipboard.svg");
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin-left: 0.6em;
|
||||
}
|
||||
.menu-icon.facility-icon {
|
||||
background-image: url("../img/icon-cone.svg");
|
||||
}
|
||||
|
|
@ -1,349 +0,0 @@
|
|||
.tabulator.hy-table{
|
||||
background-color: white;
|
||||
border: none;
|
||||
margin-top: 10px;
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
|
||||
&.no-margin{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
// 테이블 헤더
|
||||
.tabulator-header{
|
||||
border-top: solid 1px $gray-004;
|
||||
border-bottom: solid 1px $gray-004;
|
||||
background-color: #F6F6FC;
|
||||
|
||||
.tabulator-col{
|
||||
background-color: #F6F6FC;
|
||||
border-right: solid 1px $gray-004;
|
||||
height: 32px;
|
||||
justify-content: center;
|
||||
|
||||
.tabulator-col-content .tabulator-col-title{
|
||||
font-weight: 500;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 테이블 행
|
||||
.tabulator-row{
|
||||
background-color: transparent;
|
||||
border: solid 0.5px $gray-002;
|
||||
border-left: solid 0.5px transparent;
|
||||
border-right: solid 0.5px transparent;
|
||||
|
||||
&:hover{
|
||||
background-color: $gray-003;
|
||||
}
|
||||
&.tabulator-selected{
|
||||
background-color: $gray-002;
|
||||
}
|
||||
&.remove-row{
|
||||
background-color: $red;
|
||||
}
|
||||
&.edit-row{
|
||||
background-color: #d2ddff;
|
||||
}
|
||||
&.blank-row{
|
||||
border: solid 0.5px red
|
||||
}
|
||||
|
||||
.tabulator-cell{
|
||||
border-right: solid 1px $gray-002;
|
||||
|
||||
// &.tabulator-editable{
|
||||
// background-color: transparent ;
|
||||
// &::after{
|
||||
// content: "";
|
||||
|
||||
// }
|
||||
// &:hover{
|
||||
// background-color: $gray-003;
|
||||
// }
|
||||
// }
|
||||
&.editable-cell, &.tabulator-editable{
|
||||
background-color: rgba(255, 253, 221, 0.548) ;
|
||||
&::after{
|
||||
content: "◥";
|
||||
color: $blue-004;
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
right: -1px;
|
||||
line-height: 7px;
|
||||
font-size: 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 테이블 푸터
|
||||
.tabulator-footer{
|
||||
border: none;
|
||||
|
||||
.tabulator-calcs-holder{
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 컬럼 그룹화 된 테이블
|
||||
.tabulator.group-table{
|
||||
|
||||
// 테이블 헤더
|
||||
.tabulator-header{
|
||||
|
||||
.tabulator-col{
|
||||
height: 50px;
|
||||
align-items: center;
|
||||
|
||||
&.tabulator-col-group{
|
||||
.tabulator-col-group-cols{
|
||||
border-top: solid 1px $gray-004;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.tabulator.groupby{
|
||||
.tabulator-row{
|
||||
|
||||
&.tabulator-group {
|
||||
border-bottom: solid 2px $gray-002;
|
||||
border-top: none;
|
||||
border-right: solid 1px $gray-002;
|
||||
|
||||
&.select{
|
||||
background-color: $gray-004;
|
||||
}
|
||||
|
||||
&.tabulator-group-visible{
|
||||
|
||||
// .tabulator-group-toggle{
|
||||
// &::before{
|
||||
// content:"▼\00a0";
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .tabulator-group-toggle{
|
||||
// &::before{
|
||||
// content:"▶\00a0";
|
||||
// font-weight: 500;
|
||||
// font-size: 11px;
|
||||
// }
|
||||
|
||||
.tabulator-arrow{
|
||||
// display: none;
|
||||
}
|
||||
}
|
||||
|
||||
span{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 작업자 메인화면 2 그룹화 테이블
|
||||
.tabulator.group-table-style{
|
||||
.tabulator-header .tabulator-col{
|
||||
|
||||
&.tabulator-col-group{
|
||||
|
||||
.tabulator-col-content{
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.tabulator-col-group-cols{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabulator-row{
|
||||
border-bottom: none;
|
||||
.tabulator-cell{
|
||||
border-bottom: solid 1px $gray-002;
|
||||
}
|
||||
.tabulator-cell:nth-of-type(-n+6){
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
.tabulator-row:nth-of-type(5n+1), .tabulator-row:nth-of-type(5n+4){
|
||||
|
||||
.tabulator-cell:nth-of-type(2n+7){
|
||||
width: 200px !important;
|
||||
}
|
||||
.tabulator-cell:nth-of-type(2n+8){
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.tabulator-row:nth-of-type(5n+5){
|
||||
border-bottom: solid 1px $gray-002;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// basecode vue 테이블
|
||||
/* 기본테이블 */
|
||||
|
||||
.bg-light{
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
.font-weight-bold td{
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tb-height-full .cont_hfix{
|
||||
height: calc(100% - 44px);
|
||||
margin-top: 10px;
|
||||
overflow: auto;
|
||||
}
|
||||
.basetable, .vue-table {
|
||||
min-width: 100%;
|
||||
border-collapse: separate;
|
||||
border-bottom: 1px solid $gray-002;
|
||||
border-top: 1px solid $gray-002;
|
||||
|
||||
th {
|
||||
text-align: center;
|
||||
background-color: #f6f6fc;
|
||||
|
||||
font-weight: 500;
|
||||
color:#555;
|
||||
height: 30px;
|
||||
min-width: 100px;
|
||||
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
border-top: solid 1px $gray-004;
|
||||
border-bottom: solid 1px $gray-004;
|
||||
|
||||
&:not(:first-child) {
|
||||
border-left: 1px solid $gray-004;
|
||||
}
|
||||
}
|
||||
|
||||
td {
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
border-bottom: 1px solid $gray-002;
|
||||
height: 31px;
|
||||
|
||||
&:not(:last-child:first-child) {
|
||||
border-left: 1px solid $gray-002;
|
||||
}
|
||||
&:last-child:first-child {
|
||||
border-right: 1px solid $gray-002;
|
||||
}
|
||||
}
|
||||
|
||||
thead.top_sticky, .basetable thead.top_sticky th {
|
||||
position: sticky;
|
||||
top:0;
|
||||
left:0;
|
||||
}
|
||||
}
|
||||
.vue-table {
|
||||
width: 3000px;
|
||||
|
||||
th{
|
||||
min-width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
// 품목코드등록-라우팅 테이블
|
||||
.tabulator.hy-table.hide-sub-column{
|
||||
.tabulator-header{
|
||||
|
||||
.tabulator-col.tabulator-col-group{
|
||||
&.width-150{
|
||||
width: 150px;
|
||||
}
|
||||
&.width-160{
|
||||
width: 160px;
|
||||
}
|
||||
&.width-180{
|
||||
width: 180px;
|
||||
}
|
||||
&.width-200{
|
||||
width: 200px;
|
||||
}
|
||||
&.width-230{
|
||||
width: 230px;
|
||||
}
|
||||
&.width-800{
|
||||
width: 800px;
|
||||
}
|
||||
.tabulator-col-group-cols{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 테이블 소계 및 합계 css
|
||||
|
||||
.tabulator.hy-table{
|
||||
|
||||
.tabulator-calcs{
|
||||
position: relative;
|
||||
.tabulator-cell:nth-of-type(1){
|
||||
position: sticky;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border-right: solid 2px $gray-004;
|
||||
|
||||
&::after {
|
||||
content: "소계";
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
// .tabulator-cell:nth-of-type(2){
|
||||
// width: 150px !important;
|
||||
// }
|
||||
}
|
||||
|
||||
.tabulator-footer{
|
||||
|
||||
.tabulator-calcs{
|
||||
.tabulator-cell:nth-of-type(1)::after {
|
||||
content: "합계";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.status-table.vue-table{
|
||||
colgroup{
|
||||
col{}
|
||||
}
|
||||
thead{
|
||||
tr{
|
||||
th{}
|
||||
}
|
||||
}
|
||||
|
||||
tbody{
|
||||
tr{
|
||||
td{
|
||||
&.on{
|
||||
background-color: $gray-002;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue