Skip to content

Instantly share code, notes, and snippets.

@widoyo

widoyo/app.css

Forked from yogaswara/mdd.html
Last active December 11, 2015 20:08
Show Gist options
  • Save widoyo/4652694 to your computer and use it in GitHub Desktop.
Save widoyo/4652694 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
app.css
/* Artfully masterminded by ZURB */
/* --------------------------------------------------
Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/
/* -----------------------------------------
Shared Styles
----------------------------------------- */
h4 {font-size : 20px; text-align: center;}
table thead tr th, table tbody tr { text-align: center; }
img.inline {height: 60px; width: 60px;}
th.inline { width: 5px; }
@media print { * { background: transparent !important; color: black !important; box-shadow: none !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; }
ul, hr,span, footer {display: none;}
h4 {font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: 14px; }
p, label.inline,input.five {font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: 12px;}
table thead tr th, table tbody tr td { display: table-cell; font-size: 12px; line-height: 8px; text-align: center; }
p {line-height: 10px;}
@page { margin: 2cm; }
/* -----------------------------------------
Page Name 1
----------------------------------------- */
/* -----------------------------------------
Page Name 2
----------------------------------------- */
Raw
mdd.html
<!DOCTYPE html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<!-- Set the viewport width to device width for mobile -->
<meta name="viewport" content="width=device-width" />
<title>Module Delivery Document</title>
<!-- Included CSS Files (Compressed) -->
<link rel="stylesheet" href="foundation.css">
<link rel="stylesheet" href="app.css">
<!--<script src="modernizr.foundation.js"></script>-->
<!-- jQuery -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('span a').click(function() {
window.print();
return false;
});
});
</script>
</head>
<body>
<!-- Header and Nav -->
<div class="row">
<div class="three columns">
<h1><img src="huawei.png" class="inline"/></h1>
</div>
<div class="nine columns">
<ul class="nav-bar right">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Help</a></li>
</ul>
</div>
</div>
<!-- End Header and Nav -->
<!-- Main Page -->
<div class="row">
<div class="twelve columns">
<div class="ten columns"></div>
<div class="two columns right">
<span>
<a href="#print" >
<img src="icon_print.gif" title="Print this Page" /> Print This Page
</a>
</span>
</div>
<h4>MODULE DELIVERY DOCUMENT FOR<br /> REPLACEMENT MODULE REQUEST</h4><br />
<!-- MDD1 -->
<div class="row">
<div class="three columns">
<label class="inline">MDD Reference Number</label>
</div>
<div class="nine columns">
<input type="text" disabled placeholder="121203-948-24" class="five"/>
</div>
<div class="three columns">
<label class="inline">RMR Reference Number</label>
</div>
<div class="nine columns">
<input type="text" disabled placeholder="121203-T02-28" class="five" />
</div>
</div>
<!-- End MDD1 -->
<hr />
<!-- MDD2 -->
<p><strong>Requested Module : JA10Bi</strong></p>
<table class="twelve">
<thead>
<tr>
<th class="inline">Nr.</th>
<th>Type</th>
<th>Name</th>
<th>HW code/ID</th>
<th class="inline">QTY</th>
<th>Site/Remaks</th>
</tr>
</thead>
<tbody>
<tr>
<td class="inline right">1</td>
<td>3065</td>
<td>PSC6-A</td>
<td>C08953.B3B</td>
<td>1</td>
<td>MBULIANHC</td>
</tr>
<tr>
<td class="inline right">2</td>
<td>3065</td>
<td>SWCOP-A</td>
<td>C08953.B3B</td>
<td>1</td>
<td>MBULIANHC</td>
</tr>
<tr>
<td class="inline right">3</td>
<td>3065</td>
<td>ESB26</td>
<td>C108885C.01</td>
<td>1</td>
<td>MBULIANHC</td>
</tr>
</tbody>
</table>
<!-- End MDD2-->
<hr />
<!-- MDD3 -->
<p><strong>Delivery Address : JA10Bi</strong></p>
<table class="twelve">
<thead>
<tr>
<th>Customer Office</th>
<th>Address</th></th>
<th>Region</th>
<th>Requested by</th>
<th>Phone</th>
<th>Fax</th>
</tr>
</thead>
<tbody>
<tr>
<td>Robby.FH</td>
<td>Jl. Moh. Toha No.3</td>
<td>2</td>
<td>Eza</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<!-- End MDD3 -->
<hr />
<!-- MDD4 -->
<div class="row">
<div class="three columns">
<p><strong>Date and Time : </strong></p>
</div>
<div class="two columns">
<label class="inline"><input type="checkbox" id="checkbox1"> WIB</label>
</div>
<div class="two columns">
<label class="inline"><input type="checkbox" id="checkbox2"> WITA</label>
</div>
<div class="five columns">
<label class="inline"><input type="checkbox" id="checkbox3"> WIT</label>
</div>
</div>
<table class="twelve">
<thead>
<tr>
<th colspan="3">Initial Request</th>
<th colspan="3">Request Received (Minimum Period)</th>
</tr>
<tr>
<th>Date</th>
<th class="inline">Time</th>
<th>Reference</th>
<th>Date</th>
<th class="inline">Time</th>
<th>SWH Officer</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>3065</td>
<td>PSC6-A</td>
<td>C08953.B3B</td>
<td>1</td>
<td>MBULIANHC</td>
</tr>
</tbody>
</table>
<!-- End MDD4 -->
<hr />
<!-- MDD5 -->
<p><strong>Module(s) Delivery : </strong></p>
<table class="twelve">
<thead>
<tr>
<th class="inline">Nr.</th>
<th>Type</th></th>
<th>Name</th>
<th>HW code/ID</th>
<th>FR. Number</th>
<th>Serial Number</th>
</tr>
</thead>
<tbody>
<tr>
<td class="inline right">1</td>
<td>36CSCS</td>
<td>PSC6-A</td>
<td>C08953.B3B</td>
<td></td>
<td class="inline right">32043300658</td>
</tr>
<tr>
<td class="inline right">2</td>
<td>36CSCS</td>
<td>SWC0P-A</td>
<td>C08947.B36</td>
<td></td>
<td class="inline right">K6091843302</td>
</tr>
<tr>
<td class="inline right">3</td>
<td>26CSS</td>
<td>ESB26</td>
<td>C108885.C01</td>
<td></td>
<td class="inline right">D2061000439</td>
</tr>
</tbody>
</table>
<!-- End MDD5 -->
<hr />
<!-- MDD6 -->
<p>AWB Number : ______________________________________</p>
<p>Supposed to be delivered on ___________________________</p>
<p>MTTR _____________________________</p>
<p>__________________________________________________________</p>
<p>Please fill in upon Module Delivery:</p>
<p>I confirm that all modules have been delivered on __________________ at ________ to the requested office</p>
<br /><br /><br /><br />
<div class="row">
<div class="four columns">
<p>INTI : _________________________</p>
</div>
<div class="six columns">
<p>RMC : _____________________________</p>
</div>
</div>
<!-- End MDD6 -->
<hr />
<!-- End Main Page -->
<!-- Footer -->
<footer class="row">
<div class="twelve columns">
<div class="row">
<div class="six columns">
<p>&copy; Copyright 2013 Sparelog.</p>
</div>
<div class="six columns">
<ul class="link-list right">
<li><a href="#">Home</a></li>
<li><a href="#">Help</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment