You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
161 lines
3.4 KiB
161 lines
3.4 KiB
// ================================================================================================ |
|
// File Name: app-invoice.scss |
|
// Description: Invoice Layout page layouts SCSS. |
|
// ---------------------------------------------------------------------------------------------- |
|
// Item Name: Vuexy HTML Admin Template |
|
// Version: 1.0 |
|
// Author: PIXINVENT |
|
// Author URL: http://www.themeforest.net/user/pixinvent |
|
// ================================================================================================ |
|
|
|
@import '../bootstrap-extended/include'; // Bootstrap includes |
|
@import '../components/include'; // Components includes |
|
|
|
$product-details-bg: #fcfcfc; |
|
$invoice-spacing: 1.45rem 0; |
|
$invoice-card-body-padding: 2.5rem; |
|
|
|
// Invoice Preview, Edit & Add |
|
.invoice-preview, |
|
.invoice-edit, |
|
.invoice-add { |
|
.invoice-padding { |
|
padding-left: $invoice-card-body-padding; |
|
padding-right: $invoice-card-body-padding; |
|
} |
|
.table { |
|
th:first-child, |
|
td:first-child { |
|
padding-left: 2.5rem; |
|
} |
|
} |
|
.logo-wrapper { |
|
display: flex; |
|
align-items: center; |
|
margin-bottom: 1.9rem; |
|
.invoice-logo { |
|
font-size: 2.142rem; |
|
font-weight: bold; |
|
letter-spacing: -0.54px; |
|
margin-left: 1rem; |
|
margin-bottom: 0; |
|
} |
|
} |
|
.invoice-title { |
|
font-size: 1.285rem; |
|
margin-bottom: 1rem; |
|
.invoice-number { |
|
font-weight: 600; |
|
} |
|
} |
|
.invoice-date-wrapper { |
|
display: flex; |
|
align-items: center; |
|
|
|
&:not(:last-of-type) { |
|
margin-bottom: 0.5rem; |
|
} |
|
|
|
.invoice-date-title { |
|
width: 7rem; |
|
margin-bottom: 0; |
|
} |
|
.invoice-date { |
|
margin-left: 0.5rem; |
|
font-weight: 600; |
|
margin-bottom: 0; |
|
} |
|
} |
|
.invoice-spacing { |
|
margin: $invoice-spacing; |
|
} |
|
.invoice-number-date { |
|
.title { |
|
width: 115px; |
|
} |
|
} |
|
.invoice-total-wrapper { |
|
width: 100%; |
|
max-width: 12rem; |
|
.invoice-total-item { |
|
display: flex; |
|
align-items: center; |
|
justify-content: space-between; |
|
.invoice-total-title { |
|
margin-bottom: 0.35rem; |
|
} |
|
.invoice-total-amount { |
|
margin-bottom: 0.35rem; |
|
font-weight: 600; |
|
} |
|
} |
|
} |
|
|
|
@media (min-width: 768px) { |
|
.invoice-title { |
|
text-align: right; |
|
margin-bottom: 3rem; |
|
} |
|
} |
|
} |
|
|
|
// Invoice Edit & Add |
|
.invoice-edit, |
|
.invoice-add { |
|
.invoice-preview-card { |
|
.invoice-title { |
|
text-align: left; |
|
margin-right: 3.5rem; |
|
margin-bottom: 0; |
|
} |
|
.invoice-edit-input, |
|
.invoice-edit-input-group { |
|
max-width: 11.21rem; |
|
} |
|
.invoice-product-details { |
|
background-color: $product-details-bg; |
|
padding: 3.75rem 3.45rem 2.3rem 3.45rem; |
|
.product-details-border { |
|
border: 1px solid $border-color; |
|
border-radius: $border-radius; |
|
} |
|
} |
|
.invoice-to-title { |
|
margin-bottom: 1.9rem; |
|
} |
|
.col-title { |
|
position: absolute; |
|
top: -1.75rem; |
|
} |
|
.item-options-menu { |
|
min-width: 20rem; |
|
} |
|
.repeater-wrapper { |
|
&:not(:last-child) { |
|
margin-bottom: 3rem; |
|
} |
|
} |
|
.invoice-calculations { |
|
.total-amt-title { |
|
width: 100px; |
|
} |
|
} |
|
} |
|
@media (max-width: 769px) { |
|
.invoice-preview-card { |
|
.invoice-title { |
|
margin-right: 0; |
|
width: 115px; |
|
} |
|
.invoice-edit-input { |
|
max-width: 100%; |
|
} |
|
} |
|
} |
|
@media (max-width: 992px) { |
|
.col-title { |
|
position: unset !important; |
|
top: -1.5rem !important; |
|
} |
|
} |
|
}
|
|
|