Adding checkout/billing UI

8 years ago · 2416259498
parent 684ad0ccab
commit 2416259498
1 changed files with 74 additions and 0 deletions
--- a/src/api/templates/bill.html
+++ b/src/api/templates/bill.html
@ -0,0 +1,74 @@
 <style>
 	body{ 
 			font-family:sans-serif;
 			font-size:14px;
 			font-weight:lighter;
 	}
 	.caption {
 		font-size:22px;
 	}
 	.left { float:left}
 	.small { font-family:verdana; font-size:11px;}
 	table { border:1px solid #CAD5E0; 
 		border-radius:8px;
 		-webkit-border-radius:8px;	
 		padding:4px;	
 		width:55%;
 		margin-top:10%;
 	}
 	.action {
 		cursor:pointer;
 		padding:4px;
 		padding-left:10px;
 		padding-right:10px;
 		border-radius:8px;
 	}
 	.action:hover { background-color:#4682b4; color:white}
 	tr {font-family:sans-serif; font-size:14px;}
 	td {padding:4px; font-weight:lighter}
 </style>
 <body>
 <div>
 </div>
 <br>
 <div id="grid">
 	<table align="center">
 		<tr>
 			<td colspan="2">
 				<div align="left" class="caption"> 
 					<img src="/static/img/logo.png" style="width:48px" class="left"> The Phi Technology LLC</div>
 				<div class="small" style="text-transform:capitalize">{{ app_name }}</div>
 			</td>
 			<td class="small" valign="middle">
 				<div>Call : 615-866-0454</div>
 				<div>Email: support@the-phi.com</div>
 			</td>
 		</tr>
 		<tr style="background-color:#f3f3f3">
 			<td>Service</td>
 			<td>Price /mo (USD)</td>
 			<td>Status</td>
 		</tr>
 		{% for item in plans %}
 		<tr class="" style="font-size:11px">
 			<td> {{item.statement_descriptor}} </td>
 			<td align="right"> {{item.amount/100}} </td>
 			<td style="text-transform:capitalize"> {{item.status}} </td>
 		</tr>
 		{% endfor %}
 		<tr style="font-size:11px; ">
 			<td align="right"></td>
 			<td align="right" style="background-color:#f3f3f3;"> Amount Due <span style="font-weight:bold">$ {{ total_amount }}</span></td>
 			<td align="center">
 				<span class="action">Purchase</span>
 			</td>
 	</table>
 	<br>
 </div>
 </body>