Conservancy/symposion_app
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve proposal/review styling

Browse source 
Use correct block for page titles. Fix element styles to be consistent
across site. Use fluid layout for review to enable sidebar.
This commit is contained in:
Joel Addison 2019-07-24 21:03:50 +10:00
parent 41f6d067dd
commit 149b7c8a54
15 changed files with 124 additions and 110 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
pinaxcon/templates/dashboard.html
View file

@ -1,4 +1,4 @@
{% extends "utility_page.html" %} {% extends "site_base.html" %}
{% load staticfiles %} {% load staticfiles %}
{% load i18n %} {% load i18n %}
{% load proposal_tags %} {% load proposal_tags %}
@ -10,8 +10,7 @@
{% block head_title %}Dashboard{% endblock %} {% block head_title %}Dashboard{% endblock %}
{% block header_lead %}User Dashboard{% endblock %} {% block page_title %}User Dashboard{% endblock %}
{% block main_class %}{% endblock %}
{% block alert %} {% block alert %}
{% endblock %} {% endblock %}
@ -19,21 +18,17 @@
{% block content %} {% block content %}
{% available_categories as categories %} {% available_categories as categories %}
<div class="container mb-5">
<h1>Dashboard</h1>
</div>
{% if categories %} {% if categories %}
{% include "symposion/dashboard/_categories.html" %} {% include "symposion/dashboard/_categories.html" %}
{% endif %} {% endif %}
<div class="container mb-5"> <div class="mb-5">
{% include "symposion/dashboard/speaking.html" %} {% include "symposion/dashboard/speaking.html" %}
</div> </div>
{% if user.speaker_profile %} {% if user.speaker_profile %}
{% if user.speaker_profile.proposals.exists %} {% if user.speaker_profile.proposals.exists %}
<div class="container mb-5"> <div class="mb-5">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<h2 class="my-5">Your Proposals</h2> <h2 class="my-5">Your Proposals</h2>
@ -56,7 +51,7 @@
{% associated_proposals as associated_proposals %} {% associated_proposals as associated_proposals %}
{% pending_proposals as pending_proposals %} {% pending_proposals as pending_proposals %}
{% if associated_proposals or pending_proposals %} {% if associated_proposals or pending_proposals %}
<div class="container mb-5"> <div class="mb-5">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<h2 class="my-5">Copresenter Proposals</h2> <h2 class="my-5">Copresenter Proposals</h2>
@ -75,12 +70,18 @@
{% endif %} {% endif %}
{% if review_sections %} {% if review_sections %}
<div class="container mb-5"> <div class="mb-5">
<div class="row"> <div class="row">
<h2 class="col-12 my-5">{% trans "Reviews" %}</h2> <h2 class="col-12 my-5">{% trans "Reviews" %}</h2>
</div>
<div class="row">
{% for section in review_sections %} {% for section in review_sections %}
<div class="col-md-6"> <div class="col-6">
<h3>{{ section }}</h3> <div class="card card-default mb-3">
<div class="card-header">
<h3 class="card-title">{{ section }}</h3>
</div>
<div class="card-body">
<ul class="list-unstyled"> <ul class="list-unstyled">
<li><a href="{% url "review_section" section.section.slug %}">All</a></li> <li><a href="{% url "review_section" section.section.slug %}">All</a></li>
<li><a href="{% url "user_reviewed" section.section.slug %}">Reviewed by you</a></li> <li><a href="{% url "user_reviewed" section.section.slug %}">Reviewed by you</a></li>
@ -95,18 +96,20 @@
</ul> </ul>
{% endif %} {% endif %}
</div> </div>
</div>
</div>
{% endfor %} {% endfor %}
</div>
</div>
{% endif %} {% endif %}
</div>
</div>
{% available_teams as available_teams %} {% available_teams as available_teams %}
{% if user.memberships.exists or available_teams %} {% if user.memberships.exists or available_teams %}
<div class="container mb-5"> <div class="mb-5">
<div class="row"> <div class="row">
<h2 class="col-12 my-5">{% trans "Teams "%}</h2> <h2 class="col-12 my-5">{% trans "Teams "%}</h2>
{% if user.memberships.exists %}
</div> </div>
{% if user.memberships.exists %}
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<h3>Your Teams</h3> <h3>Your Teams</h3>
@ -116,15 +119,12 @@
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
{% endif %}
</div> </div>
</div> {% endif %}
<div class="container">
<div class="row">
{% if available_teams %} {% if available_teams %}
<div class="row">
<div class="col-12"> <div class="col-12">
<h3 class="my-5">Available Teams</h3> <h3>Available Teams</h3>
</div> </div>
<div class="col-12"> <div class="col-12">
<div class="card-deck"> <div class="card-deck">
@ -135,7 +135,6 @@
</div> </div>
</div> </div>
{% endif %} {% endif %}
</div>
</div> </div>
{% endif %} {% endif %}

2
pinaxcon/templates/site_base.html
View file

@ -98,7 +98,7 @@
{% endblock %} {% endblock %}
</main> </main>
<footer class="footer"> <footer class="footer mt-4">
<div class="container py-4"> <div class="container py-4">
<div class="row"> <div class="row">
<div class="col-md-4 pb-4"> <div class="col-md-4 pb-4">

8
pinaxcon/templates/symposion/dashboard/_categories.html
View file

@ -8,7 +8,7 @@
{% load staticfiles %} {% load staticfiles %}
{% if user.is_staff %} {% if user.is_staff %}
<div class="container mb-4"> <div class="mb-4">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<h2>{% trans "Administration" %}</h2> <h2>{% trans "Administration" %}</h2>
@ -22,7 +22,7 @@
</div> </div>
{% endif %} {% endif %}
<div class="container mb-4"> <div class="mb-4">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<h2>{% trans "Attend" %} {% conference_name %}</h2> <h2>{% trans "Attend" %} {% conference_name %}</h2>
@ -30,7 +30,7 @@
</div> </div>
</div> </div>
<div class="container mb-4"> <div class="mb-4">
<div class="row"> <div class="row">
{% if not user.attendee.completed_registration %} {% if not user.attendee.completed_registration %}
<div class="col-12"> <div class="col-12">
@ -61,7 +61,7 @@
</div> </div>
</div> </div>
<div class="container my-4 py-4"> <div class="my-4 py-4">
<div class="row"> <div class="row">
{% items_pending as pending %} {% items_pending as pending %}

8
pinaxcon/templates/symposion/proposals/_proposal_fields.html
View file

@ -1,10 +1,10 @@
{% load i18n %} {% load i18n %}
{% load lca2018_tags %} {% load lca2018_tags %}
<div class="row my-4"> <div class="row">
<h2 class="col-12"> <div class="col-12">
Details <h2 class="my-4">{% trans 'Details' %}</h2>
</h2> </div>
</div> </div>
<div class="row"> <div class="row">

4
pinaxcon/templates/symposion/proposals/base.html
View file

@ -1,8 +1,8 @@
{% extends "utility_page.html" %} {% extends "site_base.html" %}
{% load staticfiles %} {% load staticfiles %}
{% block utility_body %} {% block body_outer %}
{% block proposals_body %} {% block proposals_body %}
{% endblock %} {% endblock %}
{% endblock %} {% endblock %}

6
pinaxcon/templates/symposion/proposals/proposal_detail.html
View file

@ -6,8 +6,8 @@
{% block page_title %}#{{ proposal.number }}: {{ proposal.title }} ({{ proposal.speaker }}){% endblock %} {% block page_title %}#{{ proposal.number }}: {{ proposal.title }} ({{ proposal.speaker }}){% endblock %}
{% block proposals_body %} {% block proposals_body %}
<div> <div class="mb-4">
<ul class="nav nav-pills mb-5"> <ul class="nav nav-tabs mb-2">
<li class="nav-item"><a class="nav-link active" href="#proposal-detail" data-toggle="tab">{% trans "Proposal Details" %}</a></li> <li class="nav-item"><a class="nav-link active" href="#proposal-detail" data-toggle="tab">{% trans "Proposal Details" %}</a></li>
<li class="nav-item"><a class="nav-link" href="#supporting-document" data-toggle="tab">{% trans "Supporting Documents" %}</a></li> <li class="nav-item"><a class="nav-link" href="#supporting-document" data-toggle="tab">{% trans "Supporting Documents" %}</a></li>
<li class="nav-item"><a class="nav-link" href="#reviewer-feedback" data-toggle="tab">{% trans "Reviewer Feedback" %} ({{ proposal.messages.all|length }})</a></li> <li class="nav-item"><a class="nav-link" href="#reviewer-feedback" data-toggle="tab">{% trans "Reviewer Feedback" %} ({{ proposal.messages.all|length }})</a></li>
@ -53,8 +53,6 @@
<a class="btn btn-primary {% 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-primary {% 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>
</div> </div>
</div> </div>
<div class="tab-pane" id="reviewer-feedback"> <div class="tab-pane" id="reviewer-feedback">

5
pinaxcon/templates/symposion/proposals/proposal_submit.html
View file

@ -3,15 +3,14 @@
{% load i18n %} {% load i18n %}
{% block head_title %}{% trans "Submit A Proposal" %}{% endblock %} {% block head_title %}{% trans "Submit A Proposal" %}{% endblock %}
{% block header_title %}Submit A Proposal{% endblock %} {% block page_title %}Submit a Proposal{% endblock %}
{% block proposals_body %} {% block proposals_body %}
{% if kinds %} {% if kinds %}
<h1>New Proposal</h1> <h1>New Proposal</h1>
<p>Select what kind of proposal you'd like to submit:</p> <p>Select what kind of proposal you'd like to submit:</p>
{% for kind in kinds %} {% for kind in kinds %}
<h2>{{ kind }}</h2> <a class="btn btn-outline-primary" href="{% url "proposal_submit_kind" kind.slug %}">{{ kind }}</a>
<a class="btn btn-lg btn-secondary" role="button" href="{% url "proposal_submit_kind" kind.slug %}">{{ kind }}</a>
{% endfor %} {% endfor %}
{% else %} {% else %}
<h1>Proposals Closed</h1> <h1>Proposals Closed</h1>

6
pinaxcon/templates/symposion/proposals/proposal_submit_kind.html
View file

@ -2,7 +2,7 @@
{% load i18n %} {% load i18n %}
{% block header_title %}Submit a Proposal for a {{ kind.name }}{% endblock %} {% block page_title %}Submit a Proposal for a {{ kind.name }}{% endblock %}
{% block head_title %}Submit a Proposal for a {{ kind.name }}{% endblock %} {% block head_title %}Submit a Proposal for a {{ kind.name }}{% endblock %}
{% block proposals_body %} {% block proposals_body %}
@ -13,8 +13,8 @@
<p> <p>
You will be able to edit your proposal after it has been submitted. The program committee may ask questions, provide feedback, and even suggest changes to your proposal as part of the review processes. You will be able to edit your proposal after it has been submitted. The program committee may ask questions, provide feedback, and even suggest changes to your proposal as part of the review processes.
</p> </p>
<input class="btn btn-primary" type="submit" name="finish" value="Save" /> <input class="btn btn-primary" type="submit" name="finish" value="Submit" />
<input class="btn btn-default" type="submit" name="add-speakers" value="Save and Add Additional Speakers" /> <input class="btn btn-default" type="submit" name="add-speakers" value="Submit and Add Additional Speakers" />
</fieldset> </fieldset>
</form> </form>
{% endblock %} {% endblock %}

48
pinaxcon/templates/symposion/reviews/base.html
View file

@ -4,14 +4,12 @@
{% load i18n %} {% load i18n %}
{% block body_class %}reviews{% endblock %} {% block body_class %}reviews{% endblock %}
{% block main_class %}container-fluid{% endblock %}
{% block body_outer %} {% block body_outer %}
<div> <div class="container-fluid">
<div class="sidebar-wrapper"> <div class="row">
<div class="sidebar mr-5"> <div class="col-md-2 col-sm-4">
<div class="collapser mb-3">
<div id="sidebarBtn"><span class="oi oi-menu"></span></div>
</div>
{% block sidebar %} {% block sidebar %}
{% for section in review_sections %} {% for section in review_sections %}
@ -50,20 +48,22 @@
{% endfor %} {% endfor %}
{% endblock %} {% endblock %}
</div> </div>
<div style="flex: 1 1 0; min-width: 40px;"> <div class="col-md-10 col-sm-8">
{% block body %} {% block body %}
{% endblock %} {% endblock %}
</div> </div>
</div> </div>
</div> </div>
{% endblock %} {% endblock %}
{% block extra_style %}
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.6/b-colvis-1.5.6/b-html5-1.5.6/b-print-1.5.6/cr-1.5.0/fc-3.2.5/fh-3.1.4/kt-2.5.0/r-2.2.2/rg-1.1.0/datatables.min.css"/>
{% endblock %}
{% block extra_script %} {% block extra_script %}
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-colvis-1.5.2/b-html5-1.5.2/b-print-1.5.2/cr-1.5.0/fc-3.2.5/fh-3.1.4/kt-2.4.0/r-2.2.2/rg-1.0.3/rr-1.2.4/datatables.min.css"/> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script> <script type="text/javascript" src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.6/b-colvis-1.5.6/b-html5-1.5.6/b-print-1.5.6/cr-1.5.0/fc-3.2.5/fh-3.1.4/kt-2.5.0/r-2.2.2/rg-1.1.0/datatables.min.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="//cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.18/b-1.5.2/b-colvis-1.5.2/b-html5-1.5.2/b-print-1.5.2/cr-1.5.0/fc-3.2.5/fh-3.1.4/kt-2.4.0/r-2.2.2/rg-1.0.3/rr-1.2.4/datatables.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
var reviewtable = $("table.table-reviews").DataTable({ var reviewtable = $("table.table-reviews").DataTable({
"stateSave": true, "stateSave": true,
@ -72,22 +72,30 @@
"pageLength": 100, "pageLength": 100,
"colReorder": true, "colReorder": true,
"columnDefs": [ "columnDefs": [
{ targets: [6,7,8,9,10], visible: false} { targets: [6, 7, 8, 9, 10], visible: false }
], ],
"buttons": [{ "buttons": [{
extend: 'collection', extend: 'collection',
text: 'Export', text: 'Export',
buttons: ["copy", "csv", "print"] buttons: ["copy", "csv", "print", "pdf"]
}, },
{ extend: 'collection', {
extend: 'collection',
text: 'Columns', text: 'Columns',
buttons: [ buttons: [
{ extend: 'columnsToggle', {
columns: '.toggle' }, extend: 'columnsToggle',
{ extend: 'columnToggle', columns: '.toggle'
},
{
extend: 'columnToggle',
text: 'Vote details', text: 'Vote details',
columns: '.votes' columns: '.votes'
}]}]}); }
]
}
]
});
reviewtable.buttons().container().prependTo( $(reviewtable.table().container() )); reviewtable.buttons().container().prependTo( $(reviewtable.table().container() ));
</script> </script>
<script> <script>

13
pinaxcon/templates/symposion/reviews/result_notification.html
View file

@ -2,6 +2,7 @@
{% load i18n %} {% load i18n %}
{% block head_title %}{% trans 'Result Notification' %}{% endblock %}
{% block body_class %}{{ block.super }} review-results{% endblock %} {% block body_class %}{{ block.super }} review-results{% endblock %}
@ -16,14 +17,14 @@
{% block body %} {% block body %}
<ul class="nav nav-pills">
<li{% if status == 'accepted' %} class="active"{% endif %}><a href="{% url "result_notification" section_slug 'accepted' %}">accepted</a>
<li{% if status == 'rejected' %} class="active"{% endif %}><a href="{% url "result_notification" section_slug 'rejected' %}">rejected</a>
<li{% if status == 'standby' %} class="active"{% endif %}><a href="{% url "result_notification" section_slug 'standby' %}">standby</a>
</ul>
<h1>Result Notification</h1> <h1>Result Notification</h1>
<ul class="nav nav-tabs">
<li class="nav-item"><a class="nav-link {% if status == 'accepted' %}active{% endif %}" href="{% url "result_notification" section_slug 'accepted' %}">Accepted</a>
<li class="nav-item"><a class="nav-link {% if status == 'rejected' %}active{% endif %}" href="{% url "result_notification" section_slug 'rejected' %}">Rejected</a>
<li class="nav-item"><a class="nav-link {% if status == 'standby' %}active{% endif %}" href="{% url "result_notification" section_slug 'standby' %}">Standby</a>
</ul>
<form class="form-horizontal" method="post" action="{% url "result_notification_prepare" section_slug status %}"> <form class="form-horizontal" method="post" action="{% url "result_notification_prepare" section_slug status %}">
{% csrf_token %} {% csrf_token %}

2
pinaxcon/templates/symposion/reviews/review_detail.html
View file

@ -53,7 +53,7 @@
<h2 class="mb-5">#{{ proposal.number }}: {{ proposal.title }} ({{ proposal.speaker }})</h2> <h2 class="mb-5">#{{ proposal.number }}: {{ proposal.title }} ({{ proposal.speaker }})</h2>
<div class="tabbable"> <div class="tabbable">
<ul class="nav nav-pills"> <ul class="nav nav-tabs">
<li class="nav-item"><a class="nav-link active" href="#proposal-detail" data-toggle="tab">{% trans "Proposal Details" %}</a></li> <li class="nav-item"><a class="nav-link active" href="#proposal-detail" data-toggle="tab">{% trans "Proposal Details" %}</a></li>
<li class="nav-item"><a class="nav-link" href="#proposal-feedback" data-toggle="tab">{% trans "Speaker Feedback" %} <span class="badge">{{ proposal.messages.all|length }}</span></a></li> <li class="nav-item"><a class="nav-link" href="#proposal-feedback" data-toggle="tab">{% trans "Speaker Feedback" %} <span class="badge">{{ proposal.messages.all|length }}</span></a></li>
</ul> </ul>

1
pinaxcon/templates/symposion/reviews/review_list.html
View file

@ -1,5 +1,6 @@
{% extends "symposion/reviews/base.html" %} {% extends "symposion/reviews/base.html" %}
{% block head_title %}Reviews - {{ section }}{% endblock %}
{% block body_class %}{{ block.super }} {% block body_class %}{{ block.super }}
{% if reviewed == "all_reviews" %} {% if reviewed == "all_reviews" %}

3
pinaxcon/templates/symposion/reviews/review_review.html
View file

@ -1,8 +1,5 @@
{% extends "site_base.html" %} {% extends "site_base.html" %}
{% load staticfiles %} {% load staticfiles %}
{% block extra_style %}
<link rel="stylesheet" href="{% static 'css/site-0a247b924d.css' %}">
{% endblock %}
{% load bootstrap %} {% load bootstrap %}

24
pinaxcon/templates/symposion/reviews/review_stats.html
View file

@ -7,13 +7,23 @@
{% if key %} {% if key %}
<br /> <br />
<div class="btn-group"> <ul class="nav nav-tabs">
<a class="btn btn-default positive" href="{% url "review_status" section_slug "positive" %}">Positive</a> <li class="nav-item">
<a class="btn btn-default negative" href="{% url "review_status" section_slug "negative" %}">Negative</a> <a class="nav-link {% if key == 'positive' %}active{% endif %}" href="{% url "review_status" section_slug "positive" %}">Positive</a>
<a class="btn btn-default indifferent" href="{% url "review_status" section_slug "indifferent" %}">Indifferent</a> </li>
<a class="btn btn-default controversial" href="{% url "review_status" section_slug "controversial" %}">Controversial</a> <li class="nav-item">
<a class="btn btn-default too_few" href="{% url "review_status" section_slug "too_few" %}">Too Few</a> <a class="nav-link {% if key == 'negative' %}active{% endif %}" href="{% url "review_status" section_slug "negative" %}">Negative</a>
</div> </li>
<li class="nav-item">
<a class="nav-link {% if key == 'indifferent' %}active{% endif %}" href="{% url "review_status" section_slug "indifferent" %}">Indifferent</a>
</li>
<li class="nav-item">
<a class="nav-link {% if key == 'controversial' %}active{% endif %}" href="{% url "review_status" section_slug "controversial" %}">Controversial</a>
</li>
<li class="nav-item">
<a class="nav-link {% if key == 'too_few' %}active{% endif %}" href="{% url "review_status" section_slug "too_few" %}">Too Few</a>
</li>
</ul>
<div> <div>
{% if key == "positive" %} {% if key == "positive" %}

3
static/src/scss/app.scss
View file

@ -67,7 +67,8 @@ h3, .h3 {
margin-bottom: 0; margin-bottom: 0;
} }
.label-required:after { content: ' *'; } .asteriskField:before { content: ' '; }
.abstract, .bio, .monospace-text { .abstract, .bio, .monospace-text {
font-family: Hack, monospace; font-family: Hack, monospace;
white-space: pre-wrap; white-space: pre-wrap;