Convert to bootstrap tab configuration

This was broken due to being something not bootstrap for tabs.

Convert to tab layout, just like reviewers page already is.
This commit is contained in:
Sachi King 2017-04-25 15:26:10 +10:00
parent a0d0750b88
commit 61d1416b06

View file

@ -6,18 +6,15 @@
{% block page_title %}#{{ proposal.number }}: {{ proposal.title }} ({{ proposal.speaker }}){% endblock %} {% block page_title %}#{{ proposal.number }}: {{ proposal.title }} ({{ proposal.speaker }}){% endblock %}
{% block proposals_body_outer %} {% block proposals_body_outer %}
<div class="panel panel__compact"> <div class="tabbable">
<div class="panel--content"> <ul class="nav nav-tabs">
<li class="active"><a href="#proposal-detail" data-toggle="tab">{% trans "Proposal Details" %}</a></li>
<div class="panel--tab-controls"> <li><a href="#supporting-document" data-toggle="tab">{% trans "Supporting Documents" %}</a></li>
<div class="panel--tabs"> <li><a href="#reviewer-feedback" data-toggle="tab">{% trans "Reviewer Feedback" %} ({{ proposal.messages.all|length }})</a></li>
<a data-tab-control="Details" class="panel--tab-switch is-active">{% trans "Proposal Details" %}</a> </ul>
<a data-tab-control="Documents" class="panel--tab-switch">{% trans "Supporting Documents" %}</a>
<a data-tab-control="Feedback" class="panel--tab-switch">{% trans "Reviewer Feedback" %} ({{ proposal.messages.all|length }})</a> <div class="tab-content">
</div> <div class="tab-pane active" id="proposal-detail">
</div>
<div data-tab-content="Details" class="panel--tab-content is-active">
{% include "symposion/proposals/_proposal_fields.html" %} {% include "symposion/proposals/_proposal_fields.html" %}
<div class="btn-group"> <div class="btn-group">
{% if not proposal.cancelled %} {% if not proposal.cancelled %}
@ -32,8 +29,8 @@
{% endif %} {% endif %}
</div> </div>
</div> </div>
<div data-tab-content="Documents" class="panel--tab-content"> <div class="tab-pane" id="supporting-document">
{% if proposal.supporting_documents.exists %} {% if proposal.supporting_documents.exists %}
<table class="table table-striped"> <table class="table table-striped">
{% for document in proposal.supporting_documents.all %} {% for document in proposal.supporting_documents.all %}
@ -48,35 +45,32 @@
</tr> </tr>
{% endfor %} {% endfor %}
</table> </table>
{% else %} {% else %}
<p>{% trans 'No supporting documents attached to this proposal.' %}</p> <p>{% trans 'No supporting documents attached to this proposal.' %}</p>
{% endif %} {% endif %}
<a class="btn btn-default btn-sm{% if proposal.cancelled %} btn-disabled{% endif %}" href="{% url "proposal_document_create" proposal.pk %}"><i class="fa fa-upload"></i> {% trans 'Add Document' %}</a> <a class="btn btn-default btn-sm{% if proposal.cancelled %} btn-disabled{% endif %}" href="{% url "proposal_document_create" proposal.pk %}"><i class="fa fa-upload"></i> {% trans 'Add Document' %}</a>
</div>
<div class="tab-pane" id="reviewer-feedback">
<h3>{% trans 'Conversation with Reviewers' %}</h3>
{% for message in proposal.messages.all %}
<div class="review-box">
<div class="comment"><em>{{ message.message|safe }}</em></div>
<div class="dateline"><b>{{ message.user.username }}</b> {{ message.submitted_at|timesince }} ago</div>
</div> </div>
<br />
<div data-tab-content="Feedback" class="panel--tab-content"> {% endfor %}
<h3>{% trans 'Conversation with Reviewers' %}</h3> <h3>{% trans 'Leave a Message' %}</h3>
{% for message in proposal.messages.all %} <p>{% trans 'You can leave a message for the reviewers here.' %}</p>
<div class="review-box"> <form class="form-horizontal" action="" method="POST" accept-charset="utf-8">
<div class="comment"><em>{{ message.message|safe }}</em></div> {% csrf_token %}
<div class="dateline"><b>{{ message.user.username }}</b> {{ message.submitted_at|timesince }} ago</div> <fieldset>
</div> {% include "_form_snippet.html" with form=message_form %}
<br /> <div class="btn-group">
{% endfor %} <button type="submit" name="message_submit" class="btn btn-primary">{% trans 'Submit' %}</button>
</div>
<h3>{% trans 'Leave a Message' %}</h3> </fieldset>
<p>{% trans 'You can leave a message for the reviewers here.' %}</p> </form>
<form class="form-horizontal" action="" method="POST" accept-charset="utf-8">
{% csrf_token %}
<fieldset>
{% include "_form_snippet.html" with form=message_form %}
<div class="btn-group">
<button type="submit" name="message_submit" class="btn btn-primary">{% trans 'Submit' %}</button>
</div>
</fieldset>
</form>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>