Advertisement
Guest User

Untitled

a guest
Jan 19th, 2020
54
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 4.40 KB | None | 0 0
  1. <!doctype html>
  2. <html>
  3.  
  4. <head>
  5.     <meta charset="utf-8">
  6.  
  7.     <style type="text/css" media="all">
  8.         .invoice-box {
  9.             max-width: 800px;
  10.             margin: auto;
  11.             padding: 30px;
  12.             border: 1px solid #eee;
  13.             box-shadow: 0 0 10px rgba(0, 0, 0, .15);
  14.             font-size: 16px;
  15.             line-height: 24px;
  16.             font-family: 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
  17.             color: #555;
  18.         }
  19.  
  20.         .invoice-box table {
  21.             width: 100%;
  22.             line-height: inherit;
  23.             text-align: left;
  24.         }
  25.  
  26.         .invoice-box table td {
  27.             padding: 5px;
  28.             vertical-align: top;
  29.         }
  30.  
  31.         .invoice-box table tr td:nth-child(2) {
  32.             text-align: right;
  33.         }
  34.  
  35.         .invoice-box table tr.top table td {
  36.             padding-bottom: 20px;
  37.         }
  38.  
  39.         .invoice-box table tr.top table td.title {
  40.             font-size: 45px;
  41.             line-height: 45px;
  42.             color: #333;
  43.         }
  44.  
  45.         .invoice-box table tr.information table td {
  46.             padding-bottom: 40px;
  47.         }
  48.  
  49.         .invoice-box table tr.heading td {
  50.             background: #eee;
  51.             border-bottom: 1px solid #ddd;
  52.             font-weight: bold;
  53.         }
  54.  
  55.         .invoice-box table tr.details td {
  56.             padding-bottom: 20px;
  57.         }
  58.  
  59.         .invoice-box table tr.item td {
  60.             border-bottom: 1px solid #eee;
  61.         }
  62.  
  63.         .invoice-box table tr.item.last td {
  64.             border-bottom: none;
  65.         }
  66.  
  67.         .invoice-box table tr.total td:nth-child(2) {
  68.             border-top: 2px solid #eee;
  69.             font-weight: bold;
  70.         }
  71.  
  72.         @media only screen and (max-width: 600px) {
  73.             .invoice-box table tr.top table td {
  74.                 width: 100%;
  75.                 display: block;
  76.                 text-align: center;
  77.             }
  78.  
  79.             .invoice-box table tr.information table td {
  80.                 width: 100%;
  81.                 display: block;
  82.                 text-align: center;
  83.             }
  84.         }
  85.  
  86.         /** RTL **/
  87.         .rtl {
  88.             direction: rtl;
  89.             font-family: Tahoma, 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
  90.         }
  91.  
  92.         .rtl table {
  93.             text-align: right;
  94.         }
  95.  
  96.         .rtl table tr td:nth-child(2) {
  97.             text-align: left;
  98.         }
  99.     </style>
  100. </head>
  101.  
  102. <body>
  103.     <div class="invoice-box">
  104.         <table cellpadding="0" cellspacing="0">
  105.             <tr class="top">
  106.                 <td colspan="2">
  107.                     <table>
  108.                         <tr>
  109.                             <td class="title">
  110.                                 MyCommHealth
  111.                             </td>
  112.  
  113.                             <td>
  114.                                 Receipt #: {{ $campaigns[0]->b_id }}<br>
  115.                                 Date: {{ \Carbon\Carbon::parse($campaigns[0]->b_date)->format('d/m/Y') }}<br>
  116.                             </td>
  117.                         </tr>
  118.                     </table>
  119.                 </td>
  120.             </tr>
  121.  
  122.             <tr class="information">
  123.                 <td colspan="2">
  124.                     <table>
  125.                         <tr>
  126.                             <td>
  127.                                 Universiti Teknikal Malaysia Melaka<br>
  128.                                 Jalan Hang Tuah Jaya<br>
  129.                                 76100 Durian Tunggal, Melaka<br>
  130.                                 P : +606 270 1000
  131.                             </td>
  132.                         </tr>
  133.                     </table>
  134.                 </td>
  135.             </tr>
  136.             <tr class="heading">
  137.                 <td>
  138.                     Campaign Code
  139.                 </td>
  140.  
  141.                 <td>
  142.                     Price
  143.                 </td>
  144.             </tr>
  145.  
  146.             <tr class="item last">
  147.                 <td>
  148.                     {{ $campaigns[0]->c_code }} ({{ $campaigns[0]->total_month }} months)
  149.                 </td>
  150.  
  151.                 <td>
  152.                     {{ $campaigns[0]->b_fee }}
  153.                 </td>
  154.             </tr>
  155.  
  156.             <tr class="total">
  157.                 <td></td>
  158.  
  159.                 <td>
  160.                     Total: RM {{ $campaigns[0]->b_fee }}
  161.                 </td>
  162.             </tr>
  163.         </table>
  164.     </div>
  165. </body>
  166.  
  167. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement