apollo_developers/assets/views/pages_invoice.html
2018-04-19 11:48:46 +05:30

160 lines
4.5 KiB
HTML

<!-- start: PAGE TITLE -->
<section id="page-title">
<div class="row">
<div class="col-sm-8">
<h1 class="mainTitle" translate="sidebar.nav.pages.INVOICE">{{ mainTitle }}</h1>
<span class="mainDescription">Beautifully simple invoicing and payments. Give clients attractive invoices, estimates, and receipts.</span>
</div>
<div ncy-breadcrumb></div>
</div>
</section>
<!-- end: PAGE TITLE -->
<!-- start: INVOICE -->
<div class="container-fluid container-fullw bg-white">
<div class="row">
<div class="col-md-12">
<div class="invoice">
<div class="row invoice-logo">
<div class="col-sm-6">
<img alt="" src="assets/images/your-logo-here.png">
</div>
<div class="col-sm-6">
<p class="text-dark">
#1233219 / 01 Jan 2014 <small class="text-light"> Lorem ipsum dolor sit amet </small>
</p>
</div>
</div>
<hr>
<div class="row">
<div class="col-sm-4">
<h4>Client:</h4>
<div class="well">
<address>
<strong class="text-dark">Customer Company, Inc.</strong>
<br>
1 Infinite Loop
<br>
Cupertino, CA 95014
<br>
<abbr title="Phone">P:</abbr> (123) 456-7890
</address>
<address>
<strong class="text-dark">E-mail:</strong>
<a href="mailto:#">
info@customer.com
</a>
</address>
</div>
</div>
<div class="col-sm-4">
<h4>We appreciate your business.</h4>
<div class="padding-bottom-30 padding-top-10 text-dark">
Thanks for being a customer.
A detailed summary of your invoice is below.
<br>
If you have questions, we're happy to help.
<br>
Email support@cliptheme.com or contact us through other support channels.
</div>
</div>
<div class="col-sm-4 pull-right">
<h4>Payment Details:</h4>
<ul class="list-unstyled invoice-details padding-bottom-30 padding-top-10 text-dark">
<li>
<strong>V.A.T Reg #:</strong> 233243444
</li>
<li>
<strong>Account Name:</strong> Company Ltd
</li>
<li>
<strong>SWIFT code:</strong> 1233F4343ABCDEW
</li>
<li>
<strong>DATE:</strong> 01/01/2014
</li>
<li>
<strong>DUE:</strong> 11/02/2014
</li>
</ul>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<table class="table table-striped">
<thead>
<tr>
<th> # </th>
<th> Item </th>
<th class="hidden-480"> Description </th>
<th class="hidden-480"> Quantity </th>
<th class="hidden-480"> Unit Cost </th>
<th> Total </th>
</tr>
</thead>
<tbody>
<tr>
<td> 1 </td>
<td> Lorem </td>
<td class="hidden-480"> Drem psum dolor </td>
<td class="hidden-480"> 12 </td>
<td class="hidden-480"> $35 </td>
<td> $1152 </td>
</tr>
<tr>
<td> 2 </td>
<td> Ipsum </td>
<td class="hidden-480"> Consectetuer adipiscing elit </td>
<td class="hidden-480"> 21 </td>
<td class="hidden-480"> $469 </td>
<td> $6159 </td>
</tr>
<tr>
<td> 3 </td>
<td> Dolor </td>
<td class="hidden-480"> Olor sit amet adipiscing eli </td>
<td class="hidden-480"> 24 </td>
<td class="hidden-480"> $144 </td>
<td> $8270 </td>
</tr>
<tr>
<td> 4 </td>
<td> Sit </td>
<td class="hidden-480"> Laoreet dolore magna </td>
<td class="hidden-480"> 194 </td>
<td class="hidden-480"> $317 </td>
<td> $966 </td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row">
<div class="col-sm-12 invoice-block">
<ul class="list-unstyled amounts text-small">
<li>
<strong>Sub-Total:</strong> $12,876
</li>
<li>
<strong>Discount:</strong> 9.9%
</li>
<li>
<strong>VAT:</strong> 22%
</li>
<li class="text-extra-large text-dark margin-top-15">
<strong >Total:</strong> $11,400
</li>
</ul>
<br>
<a onclick="javascript:window.print();" class="btn btn-lg btn-primary hidden-print">
Print <i class="fa fa-print"></i>
</a>
<a class="btn btn-lg btn-primary btn-o hidden-print">
Submit Your Invoice <i class="fa fa-check"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- end: INVOICE -->