nopaque/web/app/templates/modals/context_modal.html.j2

<!-- Modal showing detailed context info for one match. -->

<div id="context-modal" class="modal">
  <div class="modal-content">
    <form>
      <div class="row" style="margin-bottom: 0px; margin-top: -20px;">
        <div class="col s12 m6 l6">
          <div class="section">
            <h6 style="margin-top: 0px;">Display</h6>
            <div class="divider" style="margin-bottom: 10px;"></div>
            <div class="col s12" style="margin-bottom: 10px;">
              {{ inspect_display_options_form.expert_mode_inspect.label.text }}
              <div class="switch right">
                <label>
                  {{ inspect_display_options_form.expert_mode_inspect() }}
                  <span class="lever"></span>
                </label>
              </div>
            </div>
            <div class="col s12" style="margin-bottom: 10px;">
              {{ inspect_display_options_form.highlight_sentences.label.text }}
              <div class="switch right">
                <label>
                  {{ inspect_display_options_form.highlight_sentences() }}
                  <span class="lever"></span>
                </label>
              </div>
            </div>
            <div class="col s12" style="margin-bottom: 10px;">
              Sentences around match
              <div class="input-field right" style="margin-top: -2rem;
                                                    margin-bottom: -2rem;
                                                    height: 0px;">
                <p class="range-field">
                  <input type="range"
                         id="context-sentences"
                         min="1"
                         max="10"
                         value="3" />
                </p>
              </div>
            </div>
          </div>
        </div>
        <div class="col s12 m6 l6">
          <div class="section">
            <h6 style="margin-top: 0px;">Create</h6>
            <div class="divider" style="margin-bottom: 10px;"></div>
            <div class="col s12">
              Add to Sub Results
              <div class="secondary-content right" id="create-inspect-menu">
                {# The needed button is created and added via javascript #}
              </div>
            </div>
          </div>
        </div>
      </div>
    </form>
    <div class="row section">
      <h5 style="margin-top: 0px;">Context for match:
        <span id="context-match-nr"></span></h5>
      <div class="divider" style="margin-bottom: 10px;"></div>
      <div class="col s12" >
        <div id="context-results">
        </div>
      </div>
    </div>
  </div>
  <div class="modal-footer">
    <a id="inspect-results-export" class="left waves-effect waves-light btn">
      Export Single Context
      <i class="material-icons right">file_download</i>
    </a>
    <a href="#!" class="modal-close waves-effect waves-light red btn">Close</a>
  </div>
</div>