450 lines
7.7 KiB
CSS
450 lines
7.7 KiB
CSS
.salaryaidListModal-width {
|
|
max-width: 900px;
|
|
}
|
|
|
|
.scroll-container-amount {
|
|
font-size: 12px;
|
|
color: #4f4f4f;
|
|
white-space: nowrap;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
cursor: grab;
|
|
user-select: none;
|
|
}
|
|
|
|
.scroll-container-amount:active {
|
|
cursor: grabbing;
|
|
}
|
|
|
|
.errored {
|
|
animation: shake 300ms;
|
|
color: #eb3434 !important;
|
|
background-color: #fef2f2 !important;
|
|
border: 1px solid #eb3434 !important;
|
|
}
|
|
|
|
|
|
.boxInfo {
|
|
background: #FFFFFF;
|
|
border: 1px solid #ECECEC;
|
|
box-shadow: 0 4px 7px rgba(0, 0, 0, 0.1);
|
|
border-radius: 7px;
|
|
padding: 5px;
|
|
}
|
|
|
|
.boxInfo svg {
|
|
width: 40px;
|
|
height: 40px
|
|
}
|
|
|
|
|
|
.infoTxt {
|
|
text-align: justify;
|
|
color: #2D2D2D;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.btnExportTitle {
|
|
background: #FFFFFF;
|
|
border: 1px solid #DADADA;
|
|
border-radius: 7px;
|
|
padding: 12px;
|
|
cursor: pointer;
|
|
transition: all ease-in-out .3s;
|
|
}
|
|
|
|
.btnExportTitle:hover {
|
|
border: 1px solid #0B9999;
|
|
}
|
|
|
|
.btnExportTitle img {
|
|
width: 50px;
|
|
}
|
|
|
|
.btnExportTitle .titleBtn {
|
|
color: #575757;
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.exportOutputContainer {
|
|
background: #F0F0F0;
|
|
border: 1px solid #DADADA;
|
|
color: #575757;
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
border-radius: 7px;
|
|
height: 300px;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.btnExportOutput {
|
|
color: #ffffff;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
background-color: #84CC16;
|
|
border-radius: 7px;
|
|
padding: 6px 18px;
|
|
}
|
|
|
|
.errorMessageOfExcel ul li {
|
|
color: red;
|
|
}
|
|
|
|
|
|
.btnExportOutput:hover {
|
|
background-color: #5f9213;
|
|
}
|
|
|
|
.errorMessageOfExcel {
|
|
position: absolute;
|
|
top: 12px;
|
|
right: 12px;
|
|
}
|
|
|
|
.btnCreateNew {
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
background-color: #84CC16;
|
|
color: #FFFFFF;
|
|
border-radius: 7px;
|
|
padding: 10px 0;
|
|
}
|
|
|
|
.btnCreateNew:hover {
|
|
background-color: #5f9213;
|
|
}
|
|
|
|
.btnCreateNew,
|
|
.btn-cancel2 {
|
|
width: 180px !important;
|
|
border-radius: 7px;
|
|
}
|
|
|
|
|
|
|
|
.error-header {
|
|
background: none !important;
|
|
background-color: #F87171 !important;
|
|
font-weight: bold !important;
|
|
color: white !important;
|
|
}
|
|
.error-row {
|
|
background-color: #FEE2E2 !important;
|
|
font-weight: bold !important;
|
|
color: #000000 !important;
|
|
font-size: 12px;
|
|
border: 1px solid #EAEAEA !important;
|
|
}
|
|
|
|
.lineHead {
|
|
background-color: #EE0000 !important;
|
|
height: 1px;
|
|
}
|
|
|
|
|
|
.lineHeadValid {
|
|
background-color: #009898 !important;
|
|
height: 1px;
|
|
}
|
|
|
|
.error-column {
|
|
background-color: #FE9C9C;
|
|
height: 100%;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.error-row .Rtable-cell .prevent-select span {
|
|
border-radius: 5px;
|
|
background: #FCA5A5 !important;
|
|
width: 32px;
|
|
height: 32px;
|
|
display: inline-block;
|
|
padding: 6px;
|
|
}
|
|
.excelTable .widthNone1 {
|
|
width: 10% !important;
|
|
}
|
|
|
|
.excelTable .widthNone2 {
|
|
width: 85% !important;
|
|
}
|
|
|
|
.excelTable .width1 {
|
|
width: 5% !important;
|
|
}
|
|
.excelTable .width2 {
|
|
width: 10% !important;
|
|
}
|
|
.excelTable .width3 {
|
|
width: 25% !important;
|
|
}
|
|
.excelTable .width4 {
|
|
width: 20% !important;
|
|
}
|
|
.excelTable .width5 {
|
|
width: 20% !important;
|
|
}
|
|
.excelTable .width6 {
|
|
width: 20% !important;
|
|
}
|
|
.excelTable .width7 {
|
|
width: 10% !important;
|
|
}
|
|
|
|
|
|
.excelValidTable .width1 {
|
|
width: 5% !important;
|
|
}
|
|
|
|
.excelValidTable .width2 {
|
|
width: 30% !important;
|
|
}
|
|
|
|
.excelValidTable .width3 {
|
|
width: 15% !important;
|
|
}
|
|
|
|
.excelValidTable .width4 {
|
|
width: 15% !important;
|
|
}
|
|
|
|
.excelValidTable .width5 {
|
|
width: 15% !important;
|
|
}
|
|
|
|
.excelValidTable .width6 {
|
|
width: 20% !important;
|
|
}
|
|
|
|
.excelValidTable .width7 {
|
|
width: 10% !important;
|
|
}
|
|
|
|
|
|
.radio-group {
|
|
display: flex;
|
|
gap: 10px;
|
|
}
|
|
|
|
.radio-input {
|
|
display: none;
|
|
}
|
|
|
|
.btnRadioAll,
|
|
.btnRadio {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
gap: 1px;
|
|
padding: 5px;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
width: 78px;
|
|
border-radius: 7px;
|
|
color: #ffffff;
|
|
cursor: pointer;
|
|
transition: background-color 0.3s ease-in-out, border 0.2s;
|
|
}
|
|
|
|
.btnAcceptAll {
|
|
background-color: #84CC16;
|
|
border: 1px solid #ffffff;
|
|
}
|
|
|
|
.btnAccept {
|
|
background-color: #84CC16;
|
|
}
|
|
|
|
.btnAcceptAll:hover,
|
|
.btnAccept:hover {
|
|
background-color: #67971d;
|
|
}
|
|
|
|
.btnRejectAll {
|
|
background-color: #FF9595;
|
|
border: 1px solid #ffffff;
|
|
}
|
|
|
|
.btnReject {
|
|
background-color: #FF9595;
|
|
}
|
|
|
|
.btnRejectAll:hover,
|
|
.btnReject:hover {
|
|
background-color: #dd8080;
|
|
}
|
|
|
|
.radio-input:checked + .btnAcceptAll,
|
|
.radio-input:checked + .btnAccept {
|
|
background-color: #8D8D8D;
|
|
}
|
|
|
|
.radio-input:checked + .btnRejectAll,
|
|
.radio-input:checked + .btnReject {
|
|
background-color: #8D8D8D;
|
|
}
|
|
|
|
.rowDuplicated {
|
|
background-color: #F3E38B !important;
|
|
}
|
|
|
|
.rowRejected {
|
|
background-color: #B1C3C3 !important;
|
|
}
|
|
|
|
|
|
.tooltipfull-container {
|
|
cursor: pointer;
|
|
position: relative;
|
|
}
|
|
|
|
.sticky {
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 20;
|
|
}
|
|
|
|
.tooltipfull {
|
|
opacity: 0;
|
|
z-index: 99;
|
|
color: #fff !important;
|
|
display: grid;
|
|
font-size: 12px;
|
|
padding: 5px 10px;
|
|
border-radius: 8px;
|
|
background: #23a8a8;
|
|
border: 1px solid #23a8a8;
|
|
-webkit-transition: all .2s ease-in-out;
|
|
-moz-transition: all .2s ease-in-out;
|
|
-o-transition: all .2s ease-in-out;
|
|
transition: all .2s ease-in-out;
|
|
-webkit-transform: scale(0);
|
|
-moz-transform: scale(0);
|
|
-o-transform: scale(0);
|
|
-ms-transform: scale(0);
|
|
transform: scale(0);
|
|
position: absolute;
|
|
right: -22px;
|
|
bottom: 39px;
|
|
/* white-space: nowrap; */
|
|
width: 180px;
|
|
text-align: justify;
|
|
}
|
|
|
|
.tooltipfull-container:hover .tooltipfull, a:hover .tooltipfull {
|
|
opacity: 1;
|
|
-webkit-transform: scale(1);
|
|
-moz-transform: scale(1);
|
|
-o-transform: scale(1);
|
|
-ms-transform: scale(1);
|
|
transform: scale(1);
|
|
}
|
|
|
|
.tooltipfull:before, .tooltipfull:after {
|
|
content: '';
|
|
border-left: 10px solid transparent;
|
|
border-right: 10px solid transparent;
|
|
border-top: 10px solid #23a8a8;
|
|
position: absolute;
|
|
bottom: -10px;
|
|
right: 20px;
|
|
}
|
|
|
|
|
|
.ellipsed {
|
|
display: block;
|
|
width: 100%;
|
|
text-overflow: ellipsis;
|
|
overflow-x: clip;
|
|
white-space: nowrap;
|
|
text-align: start
|
|
}
|
|
|
|
@media (max-width:1366px) {
|
|
.infoTxt {
|
|
font-size: 12px;
|
|
}
|
|
.btnExportTitle .titleBtn {
|
|
font-size: 13px;
|
|
}
|
|
}
|
|
|
|
@media (max-width:768px) {
|
|
.Rtable--collapse.ErrorCustom .Rtable-row .Rtable-cell .Rtable-cell--content {
|
|
text-align: start !important;
|
|
}
|
|
.Rtable--collapse.rowCustom .Rtable-row {
|
|
padding: 0.5em;
|
|
margin: 4px 0px 0;
|
|
}
|
|
.Rtable .Rtable-row .Rtable-cell.column-heading.rowHeaderCustom {
|
|
margin: 0.6em 0 !important;
|
|
}
|
|
.excelTable .width1 {
|
|
width: 15% !important;
|
|
}
|
|
|
|
.excelTable .widthNone1 {
|
|
width: 20% !important;
|
|
}
|
|
|
|
.excelTable .widthNone2 {
|
|
width: 57% !important;
|
|
}
|
|
|
|
.excelTable .width2 {
|
|
width: 20% !important;
|
|
}
|
|
|
|
.excelTable .width3 {
|
|
width: 55% !important;
|
|
}
|
|
|
|
.excelValidTable .width2 {
|
|
width: 35% !important;
|
|
}
|
|
|
|
.excelValidTable .width6 {
|
|
width: 40% !important;
|
|
}
|
|
|
|
.salaryaidListModal-width {
|
|
max-width: max-content;
|
|
}
|
|
|
|
.form-control {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.boxInfo svg {
|
|
width: 60px;
|
|
height: 60px
|
|
}
|
|
.btnExportTitle img {
|
|
width: 43px;
|
|
}
|
|
|
|
.infoTxt {
|
|
font-size: 11px;
|
|
}
|
|
|
|
.btnExportTitle .titleBtn {
|
|
font-size: 11px;
|
|
}
|
|
}
|
|
|
|
@media (max-width:576px) {
|
|
.btnRadio {
|
|
width: 66px;
|
|
}
|
|
|
|
.btnCreateNew, .btn-cancel2 {
|
|
width: 100% !important;
|
|
padding: 10px 40px;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
} |