itsm-pc-handle/assets/views/pages_invoice.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 -->