scinote-web/app/views/reports/templates/template_1/cover.html.erb

<div class="report-template-index">
  <style type="text/css" scoped>
    .report-template-index .template-table {
      height: 297mm;
      width: 100%;
      font-size: 12px;
      border-collapse: collapse;
      border-spacing: 0;
      table-layout: fixed;
    }

    .report-template-index .template-checkbox {
      border: 1px solid black;
      display: inline-block;
      height: 16px;
      margin-bottom: -3px;
      margin-right: .25em;
      position: relative;
      width: 16px;
    }

    .report-template-index .template-checkbox.selected {
      background: black;
    }

    .report-template-index .template-table > tbody > tr > td {
      border: 2px solid black;
      padding: .25em;
      text-align: left;
      vertical-align: top;
    }

    .report-template-index .cell-label {
      font-weight: bold;
    }

    .report-template-index .template-table > tbody > tr > td.title {
      font-size: 14px;
      font-weight: bold;
      text-align: center;
      vertical-align: middle;
      white-space: nowrap;
    }

    .report-template-index tr.fixed-height {
      height: 5em;
    }

    .report-template-index .seals-table {
      height: 100%;
      width: 100%;
    }

    .report-template-index .seals-table td {
      font-size: 12px;
      line-height: 16px;
      vertical-align: top;
    }

    .report-template-index .net-contents-table {
      font-size: 12px;
      height: 100%;
      width: 100%;
    }

    .report-template-index .template-table > tbody > tr > td.pagination-cell {
      font-size: 14px;
      font-weight: bold;
      text-align: center;
      vertical-align: middle;
      white-space: nowrap;
    }


  </style>
  <table class="template-table">
    <tr class="fixed-height">
      <td colspan=4 class="title">
        ANALYST WORKSHEET
      </td>
      <td colspan=7>
        <div class="cell-label">
          1. PRODUCT
        </div>
        <div class="cell-value">
          <%= template[:product] %>
        </div>
      </td>
      <td colspan=5>
        <div class="cell-label">
          2. SAMPLE NUMBER
        </div>
        <div class="cell-value">
          <%= template[:sample_number] %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=4>
        <table class="seals-table">
          <tr>
            <td>
              <div class="cell-label">
                3. SEALS
              </div>
            </td>
          </tr>
          <tr>
            <%= render Reports::MultiCheckboxInputComponent.new(
              report: report,
              name: :seals,
              label: 'Seals',
              items: {
                intact: 'INTACT',
                broken: 'BROKEN',
                none: 'NONE'
              }
            ) %>
          </tr>
          <tr></tr>
        </table>
      </td>
      <td colspan=3>
        <div class="cell-label">
          4. DATE RECEIVED
        </div>
        <div class="cell-value">
          <%= render Reports::DateInputComponent.new(report: report, name: :date_recieved, label: 'Date recieved', editing: false) %>
        </div>
      </td>
      <td colspan=4>
        <div class="cell-label">
          5.RECEIVED FROM
        </div>
        <div class="cell-value">
          <%= render Reports::TextInputComponent.new(report: report, name: :recieved_from, label: 'Received from', editing: false) %>
        </div>
      </td>
      <td colspan=5>
        <div class="cell-label">
          6. DISTRICT OR LABORATORY
        </div>
        <div class="cell-value">
          <%= render Reports::TextInputComponent.new(report: report, name: :district_laboratory, label: 'District or laboratory', editing: false) %>
        </div>
      </td>
    </tr>
    <tr>
      <td colspan=16>
        <div class="cell-label">
          7. DESCRIPTION OF SAMPLE
        </div>
        <div class="cell-value">
          <%= render Reports::LargeTextInputComponent.new(report: report, name: :sample_description, label: 'Descripton of sample', editing: false) %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=2>
        <div class="cell-label">
          8. NET CONTENTS
        </div>
      </td>
      <td colspan=7>
        <table class="net-contents-table">
          <tr>
            <td>
              <%= render Reports::CheckboxInputComponent.new(report: report, name: :not_applicable, label: 'Not applicable', editing: false) %>
              NOT APPLICABLE
            </td>
            <td>
              DECLARE/UNIT <b>
                <%= render Reports::TextInputComponent.new(report: report, name: :declare_unit, label: 'Declare unit', editing: false) %>
              </b>
            </td>
          </tr>
          <tr>
            <td>
              <%= render Reports::CheckboxInputComponent.new(report: report, name: :not_determined, label: 'Not determined', editing: false) %>
              NOT DETERMINED
            </td>
            <td>AMOUNT FOUND
              <b>
                <%= render Reports::TextInputComponent.new(report: report, name: :amount_found, label: 'Amount found', editing: false) %>
              </b>
            </td>
          </tr>
          <tr>
            <td>
              <b>
                <%= render Reports::TextInputComponent.new(report: report, name: :units_examined, label: 'Units examined', editing: false) %>
              </b> UNITS EXAMINED
            </td>
            <td>% of DECLARED
              <b>
                <%= render Reports::TextInputComponent.new(report: report, name: :percent_of_declared, label: 'Percent of declared', editing: false) %>
              </b>
            </td>
          </tr>
        </table>
      </td>
      <td colspan=2>
        <div class="cell-label">
          9. LABELING
        </div>
      </td>
      <td colspan=5>
        <table class="net-contents-table">
          <tr>
            <td>
              <b>
                <%= render Reports::TextInputComponent.new(report: report, name: :originals_submitted, label: 'Original(s) submitted', editing: false) %>
              </b> ORIGINAL(S) SUBMITTED
            </td>
          </tr>
          <tr>
            <td>
              <b>
                <%= render Reports::TextInputComponent.new(report: report, name: :copies_submitted, label: 'Copies submitted', editing: false) %>
              </b> COPIES SUBMITTED
            </td>
          </tr>
          <tr>
            <td>
              <%= render Reports::CheckboxInputComponent.new(report: report, name: :labeling_none, label: 'None', editing: false) %>
              NONE
            </td>
          </tr>
        </table>
      </td>
    </tr>
    <tr>
      <td colspan=16>
        <div class="cell-label">
          10. SUMMARY OF ANALYSIS
        </div>
        <div class="cell-value">
          <%= render Reports::LargeTextInputComponent.new(report: report, name: :analysis_summary, label: 'Summary of analysis', editing: false) %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=16>
        <div class="cell-label">
          11. RESERVE SAMPLE
        </div>
        <div class="cell-value">
          <%= template[:reserve_sample] %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=8 rowspan=2>
        <div class="cell-label">
          12. a. ANALYST SIGNATURE (Broke Seal <%= render Reports::CheckboxInputComponent.new(report: report, name: :analyst_signature_broke, label: 'Broke seal', editing: false) %>)
        </div>
        <div class="cell-value">
          <%= render Reports::TextInputComponent.new(report: report, name: :analyst_signature_a, label: 'Analyst signature A', editing: false) %>
        </div>
      </td>
      <td colspan=3 rowspan=2>
        <div class="cell-label">
           13. WORKSHEET CHECK
        </div>
      </td>
      <td colspan=5>
        <div class="cell-label">
           a. BY
        </div>
        <div class="cell-value">
          <%= render Reports::TextInputComponent.new(report: report, name: :worksheet_check_by, label: 'Worksheet check by', editing: false) %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=5>
        <div class="cell-label">
           b. DATE
        </div>
        <div class="cell-value">
          <%= render Reports::DateInputComponent.new(report: report, name: :worksheet_check_date, label: 'Worksheet check date', editing: false) %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=8>
        <div class="cell-label">
           b.
        </div>
        <div class="cell-value">
          <%= render Reports::TextInputComponent.new(report: report, name: :analyst_signature_b, label: 'Analyst signature B', editing: false) %>
        </div>
      </td>
      <td colspan=8>
        <div class="cell-label">
           13. DATE REPORTED
        </div>
        <div class="cell-value">
          <%= render Reports::DateInputComponent.new(report: report, name: :date_reported, label: 'Date reported', editing: false) %>
        </div>
      </td>
    </tr>
    <tr class="fixed-height">
      <td colspan=8>
        <div class="cell-label">
           c.
        </div>
        <div class="cell-value">
          <%= render Reports::TextInputComponent.new(report: report, name: :analyst_signature_c, label: 'Analyst signature C', editing: false) %>
        </div>
      </td>
      <td colspan=8 class="pagination-cell">
        PAGE 1 OF
      </td>
    </tr>
  </table>
</div>