subsurface/printing_templates/One Dive.html

252 lines
4.9 KiB
HTML
Raw Normal View History

<html>
<head>
<style>
body {
{{ print_options.grayscale }};
padding: 0;
margin: 0 0 0 6%; <!-- Provide LH margin for binding the page -->
font-size: {{ template_options.font_size }}vw;
line-height: {{ template_options.line_spacing }};
font-family: {{ template_options.font }};
}
h1 {
font-size: {{ template_options.font_size }}vw;
}
p {
font-size: {{ template_options.font_size }}vw;
}
table {
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-width: {{ template_options.borderwidth }}px;
border-style:solid;
border-color: {{ template_options.color6 }};
border-collapse: separate;
}
tr {
height: 4vh;
}
td {
padding: 0;
margin: 0;
padding-left: 1%;
}
#body_div {
background-color: {{ template_options.color1 }};
}
.mainContainer {
width: 97%;
height: 100%;
margin-left: 0%;
margin-right: 1%;
margin-top: 0%;
margin-bottom: 0%;
border-width: 1px;
page-break-inside: avoid;
}
.innerContainer {
width: 99%;
height: 99%;
padding-top: 0%;
}
.diveDetails {
width: 100%;
margin: 0.0%;
}
.dataSection {
width: 100%;
margin: 0.0% 0% 0% 0%;
}
.diveProfile {
width: 99.5%;
height: 45%;
margin: 0.2% 0% 0.5% 0.5%;
}
.notesSection {
width: 100%;
margin: 0.0%;
min-height: 35%;
}
.fieldTitle {
background-color: {{ template_options.color2 }};
overflow: hidden;
color: {{ template_options.color4 }};
width: 7%;
padding-left:5px;
}
.fieldData {
background-color: {{ template_options.color3 }};
color: {{ template_options.color5 }};
width: 13%;
padding: o$ 1% 0% 1%;
}
.table_class {
margin: 0%;
width: 100%;
}
td.insert_column_inner {
border-left-style:solid;
border-left-color: {{ template_options.color6 }};
background-color: {{ template_options.color2 }};
color: {{ template_options.color4 }};
border: 5px solid black;
}
td.insert_column_outer {
background-color: {{ template_options.color2 }};
color: {{ template_options.color4 }};
}
.notes_table_class {
overflow: hidden;
width: 100%;
margin: 0.0% 0% 0% 0%;
max-height: 35%;
}
.notes_table_class td.fieldTitle {
max-height: 0.15vh;
}
.textArea {
line-height: {{ template_options.line_spacing }};
color: {{ template_options.color5 }};
font-size: {{ template_options.font_size }}vw;
padding: 1%;
}
td.fieldTitle b {
font-size: {{ template_options.font_size }}vw;
}
.hidden_div {
display: none;
}
</style>
</head>
<body data-numberofdives = 1>
<div id="body_div">
{% block main_rows %}
{% for dive in dives %}
<div class="mainContainer">
<div class="innerContainer">
<div class="dataSection">
<table class="table_class">
<tr>
<td class="fieldTitle">
<b> Date </b>
</td>
<td class="fieldData">
<p> {{ dive.date }} </p>
</td>
<td class="fieldTitle">
<b> Dive No. </b>
</td>
<td class="fieldData">
<p> {{ dive.number }} </p>
</td>
</tr>
<tr>
<td class="fieldTitle">
<b> Time </b>
</td>
<td class="fieldData">
<p> {{ dive.time }} </p>
</td>
<td class="fieldTitle">
<b> Gases </b>
</td>
<td class="fieldData">
<p> {{ dive.gas }} </p>
</td>
</tr>
<tr>
<td class="fieldTitle">
<b> Location </b>
</td>
<td class="fieldData">
<p> {{ dive.location }} </p>
</td>
<td class="fieldTitle">
<b> Water Temp. </b>
</td>
<td class="fieldData">
<p> {{ dive.waterTemp }} </p>
</td>
</tr>
<tr>
<td class="fieldTitle">
<b> Max Depth </b>
</td>
<td class="fieldData">
<p> {{ dive.depth }} </p>
</td>
<td class="fieldTitle">
<b> Buddy </b>
</td>
<td class="fieldData">
<p> {{ dive.buddy }} </p>
</td>
</tr>
<tr>
<td class="fieldTitle">
<b> Duration </b>
</td>
<td class="fieldData">
<p> {{ dive.duration }} </p>
</td>
<td class="fieldTitle">
<b> Dive Guide </b>
</td>
<td class="fieldData">
<p> {{ dive.divemaster }} </p>
</td>
</tr>
</table>
</div>
<div class="diveProfile" id="dive_{{ dive.id }}">
</div>
<div class="notesSection">
<table class="notes_table_class">
<tbody>
<tr>
<td class="fieldTitle">
<b> Notes </b>
</td>
</tr>
<tr>
<td class="fieldData">
<p> {{ dive.notes|safe }} </p>
</td>
</tr>
</tbody>
</table>
</div> <!-- notesSection -->
</div> <!-- innerContainer -->
</div> <!-- mainContainer -->
{% endfor %}
{% endblock %}
</div>
</body>
</html>