Do some cosmetics and code style

This commit is contained in:
Stephan Porada 2020-01-21 15:39:08 +01:00
parent 2142fb14af
commit 50df7e0ab0

View File

@ -36,6 +36,7 @@
}
</style>
<!-- Query Form -->
<form id="query-form">
<div class="col s12">
<ul class="collapsible expandable">
@ -43,14 +44,25 @@
<!-- <div class="collapsible-header">
<i class="material-icons">search</i>CQP Query
</div> -->
<div class="collapsible-body" style="padding: 0px 2rem;">
<!-- Div element above is part of valid materialize collapsible.
Commented out to prevent the user from collapsing it and also to save
space -->
<div class="collapsible-body" style="padding-top: 10px;
padding-right: 2rem;
padding-bottom: 0px;
padding-left: 2rem;">
<div class="row">
<div class="col s12 m11">
<div class="input-field">
<i class="material-icons prefix">search</i>
{{ query_form.query() }}
{{ query_form.query.label }}
<span class="helper-text" data-error="wrong" data-success="right"><a href="http://cwb.sourceforge.net/files/CQP_Tutorial/"><i class="material-icons" style="font-size: inherit;">help</i> CQP query language tutorial</a></span>
<span class="helper-text" data-error="wrong" data-success="right">
<a href="http://cwb.sourceforge.net/files/CQP_Tutorial/">
<i class="material-icons" style="font-size: inherit;">help
</i> CQP query language tutorial
</a>
</span>
{% for error in query_form.query.errors %}
<span class="helper-text red-text">{{ error }}</span>
{% endfor %}
@ -59,7 +71,10 @@
<div class="col s12 m1">
<p class="hide-on-small-only" style="
margin: 0px;">&nbsp;</p>
<button class="waves-effect waves-light btn-small right" type="submit">Send<i class="material-icons right">send</i></button>
<button class="waves-effect waves-light btn-small right"
type="submit">Send
<i class="material-icons right">send</i>
</button>
</div>
</div>
</div>
@ -106,7 +121,9 @@
</div>
</form>
<div id="export-query-results-modal" class="modal modal-fixed-footer no-autoinit">
<!-- Export query results modal -->
<div id="export-query-results-modal"
class="modal modal-fixed-footer no-autoinit">
<div class="modal-content">
{{ query_download_form.hidden_tag() }}
<h4>Download current query Results</h4>
@ -114,26 +131,44 @@
<table>
<tr>
<td>JSON</td>
<td><a class="btn waves-effect waves-light" id="download-results">Download</a></td>
<td>
<a class="btn waves-effect waves-light" id="download-results">Download
<i class="material-icons right">file_download</i>
</a>
</td>
</tr>
<tr>
<td>CSV</td>
<td><a class="btn waves-effect waves-light disabled">Download</a></td>
<td>
<a class="btn waves-effect waves-light disabled">Download
<i class="material-icons right">file_download</i>
</a>
</td>
</tr>
<tr>
<td>EXCEL</td>
<td><a class="btn waves-effect waves-light disabled">Download</a></td>
<td>
<a class="btn waves-effect waves-light disabled">Download
<i class="material-icons right">file_download</i>
</a>
</td>
</tr>
<tr>
<td>HTML</td>
<td><a class="btn waves-effect waves-light disabled">Download</a></td>
<td>
<a class="btn waves-effect waves-light disabled">Download
<i class="material-icons right">file_download</i>
</a>
</td>
</tr>
</table>
</div>
<div class="modal-footer">
<a href="#!" class="modal-close waves-effect waves-green red btn">Close</a>
</div>
</div>
<!-- Loading animation card when query results are being loaded -->
<div class="row">
<div class="col s12 hide" id="getting-query-results">
<div class="card">
@ -149,6 +184,7 @@
</div>
</div>
<!-- table showing the query results -->
<div class="row">
<div class="col s12" id="recieved-query-results">
<div class="card">
@ -175,6 +211,8 @@
</div>
</div>
<!-- Loding animation modal that waits for the CQP server container to be ready
-->
<div id="loading-modal" class="modal no-autoinit">
<div class="modal-content">
<h4>Waiting for analysis software</h4>
@ -184,6 +222,7 @@
</div>
</div>
<!-- Context modal used for detailed information about one match -->
<div id="context-modal" class="modal modal-fixed-footer">
<div class="modal-content">
<h4>Match context and information</h4>