174 lines
3.3 KiB
SCSS
174 lines
3.3 KiB
SCSS
.invoice_logo {
|
|
max-width: 125px;
|
|
}
|
|
|
|
.invoice_details {
|
|
padding-top: 24px;
|
|
.item {
|
|
.sub-title,
|
|
.title {
|
|
font-size: 16px;
|
|
color: $eColor_Blackish;
|
|
}
|
|
.title {
|
|
font-weight: $fw_SemiBold;
|
|
color: $eColor_Blueish !important;
|
|
}
|
|
}
|
|
}
|
|
.invoice_title {
|
|
font-size: 24px;
|
|
font-weight: $fw_SemiBold;
|
|
line-height: 35px;
|
|
color: $eColor_Blueish;
|
|
}
|
|
.invoice_summary {
|
|
padding-top: 38px;
|
|
gap: 27px;
|
|
margin-bottom: 60px;
|
|
}
|
|
|
|
.invoice_summary_item {
|
|
.summary_title {
|
|
gap: 8px;
|
|
padding-bottom: 20px;
|
|
border-bottom: 1px solid $eColor_Seperate;
|
|
.summary_title_icon {
|
|
display: inline-block;
|
|
width: 16px;
|
|
height: 16px;
|
|
border: 3px solid $eColor_Blackish;
|
|
border-radius: 50%;
|
|
&.allowance_icon {
|
|
border-color: $eColor_Blue;
|
|
}
|
|
&.deduction_icon {
|
|
border-color: $eColor_Green;
|
|
}
|
|
&.payslip_icon {
|
|
border-color: $absent;
|
|
}
|
|
}
|
|
h4 {
|
|
font-size: 16px;
|
|
font-weight: $fw_SemiBold;
|
|
line-height: 25px;
|
|
color: $eColor_Blueish;
|
|
}
|
|
}
|
|
}
|
|
|
|
.summary_table {
|
|
.summary_thead {
|
|
padding-top: 15px;
|
|
padding-bottom: 14px;
|
|
border-bottom: 1px solid $eColor_Seperate;
|
|
margin-bottom: 17px;
|
|
h4 {
|
|
font-size: 14px;
|
|
font-weight: $fw_Medium;
|
|
line-height: 21px;
|
|
color: $eColor_Blackish;
|
|
}
|
|
}
|
|
.summary_tbody {
|
|
.amount {
|
|
font-size: 16px;
|
|
font-weight: $fw_Medium;
|
|
line-height: 25px;
|
|
color: $eColor_Blueish;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Payslip Modal
|
|
.payslip_modal_content {
|
|
border: none;
|
|
border-radius: 5px;
|
|
box-shadow: 0 10px 25px rgba($eColor_Blackish, 0.25);
|
|
.modal-header {
|
|
padding: 20px;
|
|
border-bottom: 1px solid $eColor_Seperate;
|
|
.modal-title {
|
|
font-size: 18px;
|
|
font-weight: $fw_SemiBold;
|
|
line-height: 27px;
|
|
color: $eColor_Blueish;
|
|
}
|
|
button.btn-close {
|
|
background: transparent url(../images/close-2.svg) center/1em auto
|
|
no-repeat;
|
|
}
|
|
}
|
|
.payslip_modal_body {
|
|
padding-bottom: 0;
|
|
}
|
|
}
|
|
.payslip_user_summary {
|
|
background: rgb(255, 255, 255);
|
|
background: linear-gradient(
|
|
0deg,
|
|
rgba(255, 255, 255, 1) 0%,
|
|
rgba(236, 236, 241, 1) 85%,
|
|
rgba(237, 237, 242, 1) 100%
|
|
);
|
|
height: 131px;
|
|
padding: 23px 0;
|
|
border-radius: 10px;
|
|
margin-top: 4px;
|
|
.item {
|
|
font-size: 15px;
|
|
font-weight: $fw_SemiBold;
|
|
line-height: 23px;
|
|
color: $eColor_Blackish;
|
|
padding-bottom: 8px;
|
|
&:last-child {
|
|
padding-bottom: 0;
|
|
}
|
|
.inner-item {
|
|
color: $eColor_Blueish;
|
|
}
|
|
}
|
|
}
|
|
.payslip_modal_body_content {
|
|
gap: 17px;
|
|
padding-top: 14px;
|
|
border-top: 1px solid $eColor_Seperate;
|
|
margin-bottom: 0;
|
|
.summary_title {
|
|
padding-bottom: 8px;
|
|
}
|
|
.summary_thead {
|
|
padding: 5px 0 4px;
|
|
border-bottom-style: dashed;
|
|
margin-bottom: 8px;
|
|
h4 {
|
|
font-size: 13px;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
.salary_table {
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
.salary_table {
|
|
max-width: 360px;
|
|
margin-left: auto;
|
|
@media screen and (max-width: 767px) {
|
|
max-width: 100%;
|
|
margin: 0 auto;
|
|
}
|
|
.eTable-2 {
|
|
margin-bottom: 0 !important;
|
|
tbody tr td {
|
|
&:last-child {
|
|
padding-right: 0 !important;
|
|
div {
|
|
text-align: right;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|