<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>