whoami7 - Manager
:
/
home
/
qbizpnmr
/
arif.umairtax.com
/
resources
/
views
/
pdf-designs
/
Upload File:
files >> //home/qbizpnmr/arif.umairtax.com/resources/views/pdf-designs/business.html
<style id="style"> @import url($font_url); :root { --primary-color: $primary_color; --secondary-color: $secondary_color; --line-height: 1.6; } html { width: 210mm; height: 200mm; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: $font_name, Helvetica, sans-serif; font-size: $font_size !important; zoom: 80%; } table tr td, table tr, th { font-size: $font_size !important; } @page { margin-left: $global_margin; margin-right: $global_margin; margin-top: 0; margin-bottom: 0; size: $page_size $page_layout; } p { margin: 0; padding: 0; } .header-container { display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; gap: 1rem; width: 100%; margin-bottom: 2rem; } .company-logo-container { justify-self: start; align-self: start; } .company-logo { max-width: $company_logo_size; } .header-container>span { display: block; } #company-details { justify-self: center; align-self: start; display: flex; flex-direction: column; color: #AAA9A9; line-height: var(--line-height); } #company-address { justify-self: end; align-self: start; display: flex; flex-direction: column; color: #b1b1b1; line-height: var(--line-height); } .entity-issued-to { /* margin-top: 2rem; */ font-weight: bold; } .entity-issued-to:not(:empty)::after { content: ":"; } .client-and-entity-wrapper { display: flex; justify-content: space-between; margin-bottom: 2rem; } #client-details { display: flex; flex-direction: column; line-height: var(--line-height); vertical-align: top; } #client-details>p:nth-child(2) { color: var(--primary-color); font-size: 120%; } #shipping-details { display: $show_shipping_address; flex-direction: column; line-height: var(--line-height); } #entity-details { background-color: var(--primary-color); padding: 1.2rem; border-radius: 1rem; width: 100%; color: white; text-align: left; } #entity-details p { margin-right: 20px; } #entity-details th { font-weight: normal; padding-bottom: .5rem; } #entity-details>tbody>tr>th:nth-child(2) { text-align: right; padding-left: 10px; } [data-ref="table"] { margin-top: 0.5rem; margin-bottom: 5px; min-width: 100%; table-layout: fixed; overflow-wrap: break-word; } .task-time-details { display: block; margin-top: 5px; color: grey; } [data-ref="table"]>thead { text-align: left; background: var(--secondary-color); } [data-ref="table"]>thead>tr>th { padding: 1rem; color: white; font-weight: semibold; } th.left-radius { border-top-left-radius: 10px; } th.right-radius { border-top-right-radius: 10px; text-align: right; } td.right-radius { text-align: right; } [data-ref="table"]>tbody>tr>td { padding: 1rem; } [data-ref="table"]>tbody>tr:nth-child(odd)>td { background: #F7F7F7; } [data-ref="table"]>tbody>tr:nth-child(even)>td { background: #f7f7f7; } #table-totals>*:last-child { border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem; } #table-totals { margin-top: 0rem; display: grid; grid-template-columns: 2fr 1fr; gap: 80px; padding-top: 0.5rem; padding-bottom: 0.8rem; /*page-break-inside:auto; this may cause weird breaking*/ overflow: visible !important; } #table-totals .totals-table-right-side>* { display: grid; grid-template-columns: 1fr 1fr; } #table-totals>.totals-table-right-side>*> :nth-child(1) { text-align: $dir_text_align; margin-top: .75rem; padding-left: 7px; } #table-totals>.totals-table-right-side>*> :not([hidden])~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(.75rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(.75rem * var(--tw-space-y-reverse)); } #table-totals>.totals-table-right-side>*> :nth-child(2) { text-align: right; padding-right: 17px; } #table-totals>*> :last-child { text-align: right; padding-right: 1rem; } #footer { margin-top: 30px; } /** Markdown-specific styles. **/ [data-ref="table"] h3 { font-size: 1rem; margin-bottom: 0; } [data-ref="totals_table-outstanding-label"] { background-color: var(--secondary-color); color: white; font-size: 120%; font-weight: bold; padding: 1rem; border-top-left-radius: 7px; border-bottom-left-radius: 7px; white-space: nowrap; } [data-ref="totals_table-outstanding"] { background-color: var(--secondary-color); color: white; font-size: 120%; font-weight: bold; padding: 1rem; border-top-right-radius: 7px; border-bottom-right-radius: 7px; white-space: nowrap; } [data-ref="statement-totals"] { margin-top: 1rem; text-align: right; margin-right: .75rem; } [data-ref*=".line_total-td"] { white-space: nowrap; } /** .repeating-header, .repeating-header-space, **/ .repeating-footer, .repeating-footer-space { height: 10px; } .repeating-header { position: fixed; top: 0; } .repeating-footer { position: fixed; bottom: 0; } [data-element='product_table-product.description-td'], td { min-width: 100%; max-width: 300px; overflow-wrap: break-word; } .stamp { transform: rotate(12deg); color: #555; font-size: 3rem; font-weight: 700; border: 0.25rem solid #555; display: inline-block; padding: 0.25rem 1rem; text-transform: uppercase; border-radius: 1rem; font-family: 'Courier'; mix-blend-mode: multiply; z-index: 200 !important; position: fixed; text-align: center; } .is-paid { color: #D23; border: 1rem double #D23; transform: rotate(-5deg); font-size: 6rem; font-family: "Open sans", Helvetica, Arial, sans-serif; border-radius: 0; padding: 0.5rem; opacity: 0.2; z-index: 200 !important; position: fixed; display: $show_paid_stamp; } .project-header { font-size: 1.2em; margin-top: 0.1em; margin-bottom: 0; padding-bottom: 0; margin-left: 0; margin-right: 0; font-weight: bold; color: #505050; } .pqrcode {} #qr-bill { width: 100% !important; } /** Useful snippets, uncomment to enable. **/ /** Hide company logo **/ /* .company-logo { display: none } */ /* Hide company details */ /* #company-details > * { display: none } */ /* Hide company address */ /* #company-address > * { display: none } */ /* Hide public notes */ /* [data-ref="total_table-public_notes"] { display: none } */ /* Hide terms label */ /* [data-ref="total_table-terms-label"] { display: none } */ /* Hide totals table */ /* #table-totals { display: none } */ /* Hide totals table left side */ /* #table-totals div:first-child > * { display: none !important } */ /* Hide totals table right side */ /* .totals-table-right-side { display: none } */ /** For more info, please check our docs: https://invoiceninja.github.io **/ /** To find out selectors on your own: https://invoiceninja.github.io/docs/custom-fields/#snippets **/ </style> <div class="repeating-header" id="header"></div> <div id="body"> <table style="min-width: 100%"> <thead> <tr> <td> <div class="repeating-header-space"> </div> </td> </tr> </thead> <tbody> <tr> <td> <div class="header-container"> <div class="company-logo-container"> <img class="company-logo" src="$company.logo" alt="$company.name logo"> </div> <div id="company-details"></div> <div id="company-address"></div> </div> <div class="client-and-entity-wrapper"> <div id="client-details"> <p class="entity-issued-to">$entity_issued_to_label</p> </div> <div id="vendor-details"></div> <div id="shipping-details"></div> <div class="entity-details-wrapper"> <table id="entity-details" cellspacing="0" dir="$dir"></table> </div> </div> <table id="product-table" cellspacing="0" data-ref="table"></table> <table id="task-table" cellspacing="0" data-ref="table"></table> <table id="delivery-note-table" cellspacing="0" data-ref="table"></table> <table id="statement-invoice-table" cellspacing="0" data-ref="table"></table> <div id="statement-invoice-table-totals" data-ref="statement-totals"></div> <table id="statement-payment-table" cellspacing="0" data-ref="table"></table> <div id="statement-payment-table-totals" data-ref="statement-totals"></div> <table id="statement-credit-table" cellspacing="0" data-ref="table"></table> <div id="statement-credit-table-totals" data-ref="statement-totals"></div> <table id="statement-aging-table" cellspacing="0" data-ref="table"></table> <div id="statement-aging-table-totals" data-ref="statement-totals"></div> <div id="table-totals" cellspacing="0">$status_logo</div> </td> </tr> <tr> <td> $entity_images </td> </tr> </tbody> <tfoot> <tr> <td> <div class="repeating-footer-space"> </div> </td> </tr> </tfoot> </table> </div> <div class="repeating-footerx" id="footer"> <p data-ref="total_table-footer">$entity_footer</p> </div>
Copyright ©2021 || Defacer Indonesia