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

Started dashboard design

Browse source
This commit is contained in:
Tobias Schulmann 2018-06-24 12:14:29 +12:00 committed by Tobias S
parent 1f04ec0cea
commit 5256aeeda3
7 changed files with 383 additions and 321 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
pinaxcon/templates/_form_btns.html Normal file
View file

@ -0,0 +1,2 @@
<input class="btn btn-primary" type="submit" value="Save" />
<a class="btn btn-default" href="{% url "dashboard" %}">Cancel</a>

5
pinaxcon/templates/_form_snippet.html
View file

@ -1,5 +1,6 @@
{% load lca2018_tags %} {% load lca2018_tags %}
{% load bootstrap %} {% load bootstrap %}
{% load crispy_forms_tags %}
{% if form.non_field_errors %} {% if form.non_field_errors %}
<div class="has-errors"> <div class="has-errors">
@ -9,7 +10,7 @@
{% endif %} {% endif %}
<blockquote> <blockquote>
Fields marked with <strong>*</strong> are required. Fields marked with a<br/>* are required
</blockquote> </blockquote>
{{ form|bootstrap_horizontal }} {% crispy form %}

159
pinaxcon/templates/dashboard.html
View file

@ -11,27 +11,28 @@
{% block header_title %}linux.conf.au 2019{% endblock %} {% block header_title %}linux.conf.au 2019{% endblock %}
{% block header_lead %}User Dashboard{% endblock %} {% block header_lead %}User Dashboard{% endblock %}
{% block main_class %}{% endblock %}
{% block content %} {% block content %}
{% available_categories as categories %} {% available_categories as categories %}
{% if categories %} <div class="container">
<h1 class="text-primary mb-5">Dashboard</h1>
</div>
{% if categories %}
{% if user.is_staff %} {% if user.is_staff %}
<div class="container"> <div class="container">
<div class="page-header">
<h2>Administration</h2> <h2>Administration</h2>
</div>
<div class="page-row"> <div class="page-row">
<div class="col-xs-12"> <div class="col-xs-12">
<a class="btn btn-lg btn-info" role="button" href="{% url "reports_list" %}">Reports</a> <a class="btn btn-lg btn-info" role="button" href="{% url "reports_list" %}">Reports</a>
</div> </div>
</div> </div>
</div> </div>
{% endif %} {% endif %}
<div class="container"> <div class="container">
<div class="col-12"> <div class="col-12">
<h2>{% trans "Attend" %} {% conference_name %}</h2> <h2>{% trans "Attend" %} {% conference_name %}</h2>
</div> </div>
@ -166,53 +167,57 @@
{% endif %} {% endif %}
</div> </div>
</div> </div>
{% endif %} {% endif %}
<div class="row"> <div class="container">
<div class="row">
<div class="col-12"> <div class="col-12">
<h2>{% trans "Speaking and Miniconfs" %}</h2> <h2 class="text-primary mb-5">{% trans "Speaking and Miniconfs" %}</h2>
<div class="card">
<div class="card-header">
Speaker Profile
</div> </div>
<div class="card-body"> </div>
<p class="card-text">
Your speaker profile is independent of your attendee profile and the details you provide here will be used during selection and to populate your speaker bio on the conference website. <div class="row">
</p> <div class="col-md-6 text-primary d-flex flex-column">
<h3 class="text-upper">Speaker Profile</h3>
{% if not user.speaker_profile %} {% if not user.speaker_profile %}
<p class="card-text">To create a speaking or miniconf proposal you must first create a speaker profile.</p> <p>
<a href="{% url "speaker_create" %}" class="btn btn-primary">Create Profile</a> To create a speaking or miniconf proposal you must first create a speaker
profile.
</p>
{% endif %}
<p>
Your speaker profile is independent of your attendee profile and the
details you provide here will be used during selection and to populate
your speaker bio on the conference website.
</p>
<div class="mt-auto">
{% if not user.speaker_profile %}
<a href="{% url "speaker_create" %}" class="btn btn-primary btn-lg" role="button">Create Profile</a>
{% else %} {% else %}
<a class="btn btn-primary" role="button" href="{% url "speaker_edit" %}">Edit Profile</a> <a href="{% url "speaker_edit" %}" class="btn btn-primary btn-lg" role="button">Edit Profile</a>
{% endif %} {% endif %}
</div> </div>
</div> </div>
{% if user.speaker_profile %} {% if user.speaker_profile %}
<div class="col-xs-12 col-sm-6 col-lg-6"> <div class="col-md-6 text-primary d-flex flex-column">
<div class="panel panel-primary"> <h3 class="text-upper">New Proposal</h3>
<div class="panel-heading">
<h5>New Proposal</h5>
</div>
<div class="panel-body">
<p>You may use the following form to create a speaking or miniconf proposal.</p> <p>You may use the following form to create a speaking or miniconf proposal.</p>
<p>Once submitted you will be able to see the status of your proposals, as well manage the submission and co-speakers from this page</p> <p>Once submitted you will be able to see the status of your proposals, as well manage the submission and co-speakers from this page</p>
<a class="btn btn-lg btn-primary pull-right" role="button" href="{% url "proposal_submit" %}">New Proposal</a> <div class="mt-auto">
</div> <a class="btn btn-lg btn-primary" role="button" href="{% url "proposal_submit" %}">New Proposal</a>
</div> </div>
</div> </div>
{% endif %} {% endif %}
</div> </div>
</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"> <div class="container">
<div class="page-header"> <div class="page-header">
<h2>Your Proposals</h2> <h2>Your Proposals</h2>
</div> </div>
@ -223,16 +228,16 @@
{% endfor %} {% endfor %}
{% endif %} {% endif %}
</div> </div>
</div> </div>
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if user.speaker_profile %} {% if user.speaker_profile %}
{% 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"> <div class="container">
<div class="page-header"> <div class="page-header">
<h2>Copresenter Proposals</h2> <h2>Copresenter Proposals</h2>
</div> </div>
@ -244,30 +249,26 @@
{% include "symposion/proposals/_pending_proposal_row.html" %} {% include "symposion/proposals/_pending_proposal_row.html" %}
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
{% endif %} {% endif %}
{% endif %} {% endif %}
{% if review_sections %} <div class="bg-primary text-secondary mt-5 pb-5">
<div class="container"> <div class="container">
<div class="page-header">
<h2>{% trans "Reviews" %}</h2> {% if review_sections %}
</div> <div class="row">
<div class="page-row"> <h2 class="col-12 my-5">{% trans "Reviews" %}</h2>
{% for section in review_sections %} {% for section in review_sections %}
<div class="col-xs-12 col-sm-6 col-lg-6"> <div class="col-md-6">
<div class="panel panel-primary"> <h3>{{ section }}</h3>
<div class="panel-heading"> <ul class="list-unstyled">
<h5>{{ section }}</h5>
</div>
<div class="panel-body">
<ul>
<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>
<li><a href="{% url "user_not_reviewed" section.section.slug %}">Not Reviewed by you</a></li> <li><a href="{% url "user_not_reviewed" section.section.slug %}">Not Reviewed by you</a></li>
</ul> </ul>
{% if section in manage_sections %} {% if section in manage_sections %}
<ul> <ul class="list-unstyled">
<li><a href="{% url "review_bulk_update" section.section.slug %}">Bulk Update</a></li> <li><a href="{% url "review_bulk_update" section.section.slug %}">Bulk Update</a></li>
<li><a href="{% url "result_notification" section.section.slug "accepted" %}">Send notifications</a></li> <li><a href="{% url "result_notification" section.section.slug "accepted" %}">Send notifications</a></li>
<li><a href="{% url "review_status" section.section.slug %}">Voting Status</a></li> <li><a href="{% url "review_status" section.section.slug %}">Voting Status</a></li>
@ -275,21 +276,19 @@
</ul> </ul>
{% endif %} {% endif %}
</div> </div>
</div>
</div>
{% endfor %} {% endfor %}
</div> </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"> <div class="container">
<div class="page-header"> <div class="page-header">
<h2>{% trans "Teams" %}</h2> <h2>{% trans "Teams" %}</h2>
</div> </div>
</div> </div>
<div class="container"> <div class="container">
<div class="page-row"> <div class="page-row">
{% if user.memberships.exists %} {% if user.memberships.exists %}
<div class="page-header"> <div class="page-header">
@ -316,8 +315,8 @@
</div> </div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
<div class="container"> <div class="container">
<div class="page-row"> <div class="page-row">
{% if available_teams %} {% if available_teams %}
<div class="page-header"> <div class="page-header">
@ -341,13 +340,13 @@
</div> </div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
{% endif %} {% endif %}
{% endblock %} <!-- block content --> {% endblock %} <!-- block content -->
{% block scripts_extra %} {% block scripts_extra %}
<script type="text/javascript"> <script type="text/javascript">
var _toggleVoidInvoices = function() { var _toggleVoidInvoices = function() {
var visible = false; var visible = false;
function toggleVoidInvoices() { function toggleVoidInvoices() {
@ -369,5 +368,5 @@
} }
var toggleVoidInvoices = _toggleVoidInvoices(); var toggleVoidInvoices = _toggleVoidInvoices();
_toggleVoidInvoices = undefined; _toggleVoidInvoices = undefined;
</script> </script>
{% endblock %} {% endblock %}

2
pinaxcon/templates/site_base.html
View file

@ -52,7 +52,7 @@
{% endif %} {% endif %}
<h1 class="text-primary text-upper h2 mb-5">{% block page_title %}{% endblock %}</h1>
{% block body_base %} {% block body_base %}
{% block body %} {% block body %}

5
pinaxcon/templates/symposion/speakers/speaker_create.html
View file

@ -10,10 +10,7 @@
{% csrf_token %} {% csrf_token %}
<fieldset> <fieldset>
{% include "_form_snippet.html" with form=speaker_form %} {% include "_form_snippet.html" with form=speaker_form %}
<div class="btn-group"> {% include "_form_btns.html" %}
<input class="btn btn-primary" type="submit" value="Save" />
<a class="btn btn-default" href="{% url "dashboard" %}">Cancel</a>
</div>
</fieldset> </fieldset>
</form> </form>
{% endblock %} {% endblock %}

5
pinaxcon/templates/symposion/speakers/speaker_edit.html
View file

@ -10,10 +10,7 @@
{% csrf_token %} {% csrf_token %}
<fieldset> <fieldset>
{% include "_form_snippet.html" with form=speaker_form %} {% include "_form_snippet.html" with form=speaker_form %}
<div class="btn-group"> {% include "_form_btns.html" %}
<input class="btn btn-primary" type="submit" value="Save" />
<a class="btn btn-default" href="{% url "dashboard" %}">Cancel</a>
</div>
</fieldset> </fieldset>
</form> </form>
{% endblock %} {% endblock %}

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

@ -41,6 +41,10 @@ body {
} }
} }
.text-upper {
text-transform: uppercase;
}
.navbar-collapse { .navbar-collapse {
margin-left: $padding-left-default; margin-left: $padding-left-default;
} }
@ -184,3 +188,65 @@ main.container-fluid {
height: 480px; height: 480px;
filter: grayscale(100%); filter: grayscale(100%);
} }
.btn-lg {
padding: 0.8rem 4.5rem;
font-size: 1rem;
line-height: 1.5;
}
.btn {
padding: 0.4rem 2.25rem;
font-size: 1rem;
border-radius: 0;
text-transform: uppercase;
}
.jumbotron {
border-radius: 0;
background-color: rgba(204, 213, 197, 0.1);
border: 1px $primary solid;
color: $primary;
padding: 5rem 6rem ;
}
.col-form-label, .form-check-label {
font-weight: bold;
}
.form-text.text-muted {
color: $primary !important;
margin-bottom: 1rem;
}
fieldset {
blockquote {
font-size: 80%;
}
}
.form-control {
border-radius: 0;
border: 2px $primary solid;
&:focus {
border: 2px $primary solid;
}
}
label.form-check-label {
display: flex;
align-items: center
}
h3 {
text-transform: uppercase;
}
main {
a {
color: #f5843e;
font-weight: 600;
}
}