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

Fix proposal detail and edit pages

Browse source
This commit is contained in:
Tobias Schulmann 2018-06-30 14:01:19 +12:00
parent 77ce0021ef
commit 499b3b6769
9 changed files with 291 additions and 281 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
pinaxcon/templates/_form_btns.html
View file

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

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

@ -1,236 +1,249 @@
{% load i18n %} {% load i18n %}
{% load lca2018_tags %} {% load lca2018_tags %}
<div> <div class="row my-4">
<label class="col-sm-2 col-lg-2">Withdrawn</label> <h2 class="col-12">
<div class="col-sm-10 col-lg-10"> Details
{% if proposal.cancelled %} </h2>
<p class="label-danger">WITHDRAWN</p> </div>
{% else %}
<p class="label-success">Not withdrawn</p>
{% endif %}
</div>
</div>
<div> <div class="row">
<label class="col-sm-2 col-lg-2">Submitted by</label> <label class="list-label col-md-2">Withdrawn</label>
<div class="col-sm-10 col-lg-10"> <div class="col-md-10">
<p>{{ proposal.speaker }} &lt;{{ proposal.speaker.email }}&gt;</p> {% if proposal.cancelled %}
</div> <p class="label-danger">WITHDRAWN</p>
</div> {% else %}
<p class="label-success">Not withdrawn</p>
<div>
<label class="col-sm-2 col-lg-2">Proposal Type</label>
<div class="col-sm-10 col-lg-10">
<p>{{ proposal.kind.name|capfirst }}</p>
</div>
</div>
<div>
<label class="col-sm-2 col-lg-2">Target Audience</label>
<div class="col-sm-10 col-lg-10">
<p>{{ proposal.get_target_audience_display }}&nbsp;</p>
</div>
</div>
{% if proposal.talk_format %}
<div>
<label class="col-sm-2 col-lg-2">Talk Format</label>
<div class="col-sm-10 col-lg-10">
<p>{{ proposal.get_talk_format_display }}</p>
</div>
</div>
{% endif %} {% endif %}
</div>
</div>
{% if proposal.can_exhibit %} <div class="row">
<div> <label class="list-label col-md-2">Submitted by</label>
<label class="col-sm-2 col-lg-2">Can exhibit?</label> <div class="col-md-10">
<div class="col-sm-10 col-lg-10"> <p>{{ proposal.speaker }} &lt;{{ proposal.speaker.email }}&gt;</p>
<p>{{ proposal.get_can_exhibit_display }}</p> </div>
</div> </div>
<div>
<label class="col-sm-2 col-lg-2">Exhibition Requirements</label>
<div class="col-sm-10 col-lg-10">
{% if proposal.exhibition_requirements %}
<div class="special_requirements monospace-text">{{ proposal.exhibition_requirements|safe }}</div>
{% else %}
<div class="special_requirements monospace-text"><b>No Special Talk Requirements Requested</b></div>
{% endif %}
</div> <div class="row">
&nbsp; <label class="list-label col-md-2">Proposal Type</label>
</div> <div class="col-md-10">
<p>{{ proposal.kind.name|capfirst }}</p>
</div>
</div>
</div> <div class="row">
{% endif %} <label class="list-label col-md-2">Target Audience</label>
<div class="col-md-10">
<p>{{ proposal.get_target_audience_display }}&nbsp;</p>
</div>
</div>
{% if proposal.additional_speakers.all %} {% if proposal.talk_format %}
<div> <div class="row">
<label class="col-sm-2 col-lg-2">Additional Speakers</label> <label class="list-label col-md-2">Talk Format</label>
<div class="col-sm-10 col-lg-10"> <div class="col-md-10">
<table class="table"> <p>{{ proposal.get_talk_format_display }}</p>
<thead> </div>
<tr> </div>
<th>Name</th> {% endif %}
<th>Email</th>
<th>Status</th>
</tr>
</thead>
<tbody>
{% for speaker in proposal.additional_speakers.all %}
<tr>
{% if speaker.user %}
<td>{{ speaker.name }}</td>
<td>{{ speaker.email }}</td>
<td>Joined</td>
{% else %}
<td>Unknown</td>
<td>{{ speaker.email }}</td>
<td>Invitation Sent</td>
{% endif %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<p></p>
{% endif %}
<div> {% if proposal.can_exhibit %}
<label class="col-sm-2 col-lg-2">Abstract</label> <div class="row">
<div class="col-sm-10 col-lg-10"> <label class="list-label col-md-2">Can exhibit?</label>
<div class="abstract monospace-text well">{{ proposal.abstract_html|safe }}&nbsp;</div> <div class="col-md-10">
<p></p> <p>{{ proposal.get_can_exhibit_display }}</p>
</div> </div>
</div> <div>
<label class="list-label col-md-2">Exhibition Requirements</label>
<div> <div class="col-md-10">
<label class="col-sm-2 col-lg-2">Private Abstract</label> {% if proposal.exhibition_requirements %}
<div class="col-sm-10 col-lg-10"> <div class="special_requirements monospace-text">{{ proposal.exhibition_requirements|safe }}</div>
<div class="private_abstract monospace-text well">{{ proposal.private_abstract_html|safe }}&nbsp;</div> {% else %}
<p></p> <div class="special_requirements monospace-text"><b>No Special Talk Requirements Requested</b></div>
</div>
</div>
<div>
<label class="col-sm-2 col-lg-2">Project</label>
<div class="col-sm-10 col-lg-10">
{% if proposal.project %}
<p>{{ proposal.project|safe }}&nbsp;</p>
{% else %}
<p><b>None Provided</b></p>
{% endif %}
</div>
</div>
<div>
<label class="col-sm-2 col-lg-2">Project URL</label>
<div class="col-sm-10 col-lg-10">
{% if proposal.project_url %}
<p><a href="{{ proposal.project_url|safe }}">{{ proposal.project_url|safe }}</a>&nbsp;</p>
{% else %}
<p><b>None Provided</b></p>
{% endif %}
</div>
</div>
<div>
<label class="col-sm-2 col-lg-2">Video URL</label>
<div class="col-sm-10 col-lg-10">
{% if proposal.video_url %}
<p><a href="{{ proposal.video_url|safe }}">{{ proposal.video_url|safe }}</a>&nbsp;</p>
{% else %}
<p><b>None Provided</b></p>
{% endif %}
</div>
</div>
<div>
<label class="col-sm-2 col-lg-2">Special Requirements</label>
<div class="col-sm-10 col-lg-10">
{% if proposal.technical_requirements_html %}
<div class="special_requirements monospace-text">{{ proposal.technical_requirements_html|safe }}</div>
{% else %}
<div class="special_requirements monospace-text"><b>No Special Talk Requirements Requested</b></div>
{% endif %}
</div>
&nbsp;
</div>
<br/>
{% for speaker in proposal.speakers %}
{% if speaker.name %}
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Speaker: {{ speaker.name }}</h3>
</div>
<div class="panel-body">
<div>
<label class="col-sm-2 col-lg-2">Biography</label>
<div class="col-sm-10 col-lg-10 well monospace-text">{{ speaker.biography_html|safe }}&nbsp;</div>
</div>
<div>
<label class="col-sm-2 col-lg-2">Experience</label>
<div class="col-sm-10 col-lg-10 well monospace-text">{{ speaker.experience_html|safe }}&nbsp;</div>
</div>
{% if speaker.accessibility_html %}
<div>
<label class="col-sm-2 col-lg-2">Accessibility Requirements</label>
<div class="col-sm-10 col-lg-10 well monospace-text">{{ speaker.accessibility_html|safe }}&nbsp;</div>
</div>
{% endif %}
</div>
</div>
{% endif %} {% endif %}
{% endfor %}
{% can_manage proposal as can_manage_proposal %} </div>
{% if can_manage_proposal or request.user.speaker_profile in proposal.speakers %} &nbsp;
<div> </div>
<label class="col-sm-2 col-lg-2">Travel Assistance Required</label> </div>
<div class="col-sm-10 col-lg-10"> {% endif %}
<table class="table">
<thead> {% if proposal.additional_speakers.all %}
<tr> <div class="row">
<th>Name</th> <label class="list-label col-md-2">Additional Speakers</label>
<th>Travel</th> <div class="col-md-10">
<th>Accomodation</th> <table class="table">
</tr> <thead>
</thead> <tr>
<tbody> <th>Name</th>
{% for speaker in proposal.speakers %} <th>Email</th>
<tr> <th>Status</th>
{% if speaker.user %} </tr>
<td>{{ speaker.name }}</td> </thead>
<td>{{ speaker.travel_assistance }}</td> <tbody>
<td>{{ speaker.accommodation_assistance }}</td> {% for speaker in proposal.additional_speakers.all %}
{% else %} <tr>
<td><b>Unconfirmed co-presenter</b></td> {% if speaker.user %}
<td><b>Unknown</b></td> <td>{{ speaker.name }}</td>
<td><b>Unknown</b></td> <td>{{ speaker.email }}</td>
{% endif %} <td>Joined</td>
</tr> {% else %}
{% endfor %} <td>Unknown</td>
</tbody> <td>{{ speaker.email }}</td>
</table> <td>Invitation Sent</td>
</div> {% endif %}
</div> </tr>
<br /> {% endfor %}
</tbody>
</table>
</div>
</div>
{% endif %}
<div class="row">
<label class="list-label col-md-2">Abstract</label>
<div class="col-md-10">
<div class="abstract monospace-text well">{{ proposal.abstract_html|safe }}&nbsp;</div>
<p></p>
</div>
</div>
<div class="row">
<label class="list-label col-md-2">Private Abstract</label>
<div class="col-md-10">
<div class="private_abstract monospace-text well">{{ proposal.private_abstract_html|safe }}&nbsp;</div>
<p></p>
</div>
</div>
<div class="row">
<label class="list-label col-md-2">Project</label>
<div class="col-md-10">
{% if proposal.project %}
<p>{{ proposal.project|safe }}&nbsp;</p>
{% else %}
<p><b>None Provided</b></p>
{% endif %} {% endif %}
</div>
</div>
<div> <div class="row">
<label class="col-sm-2 col-lg-2">Recording Release</label> <label class="list-label col-md-2">Project URL</label>
<div class="col-sm-10 col-lg-10"> <div class="col-md-10">
<p>{{ proposal.recording_release }}&nbsp;</p> {% if proposal.project_url %}
</div> <p><a href="{{ proposal.project_url|safe }}">{{ proposal.project_url|safe }}</a>&nbsp;</p>
&nbsp; {% else %}
</div> <p><b>None Provided</b></p>
{% endif %}
</div>
</div>
<div> <div class="row">
<label class="col-sm-2 col-lg-2">Materials Release</label> <label class="list-label col-md-2">Video URL</label>
<div class="col-sm-10 col-lg-10"> <div class="col-md-10">
<p>{{ proposal.materials_release }}&nbsp;</p> {% if proposal.video_url %}
</div> <p><a href="{{ proposal.video_url|safe }}">{{ proposal.video_url|safe }}</a>&nbsp;</p>
&nbsp; {% else %}
<p><b>None Provided</b></p>
{% endif %}
</div>
</div>
<div class="row">
<label class="list-label col-md-2">Special Requirements</label>
<div class="col-md-10">
{% if proposal.technical_requirements_html %}
<div class="special_requirements monospace-text">{{ proposal.technical_requirements_html|safe }}</div>
{% else %}
<div class="special_requirements monospace-text"><b>No Special Talk Requirements Requested</b></div>
{% endif %}
</div>
</div>
<div class="row">
<label class="list-label col-md-2">Recording Release</label>
<div class="col-md-10">
<p>{{ proposal.recording_release }}&nbsp;</p>
</div>
</div>
<div class="row">
<label class="list-label col-md-2">Materials Release</label>
<div class="col-md-10">
<p>{{ proposal.materials_release }}&nbsp;</p>
</div>
</div>
<div class="row my-4">
<h2 class="col-12">
Speakers
</h2>
</div>
{% for speaker in proposal.speakers %}
{% if speaker.name %}
<div class="card card-default my-3">
<div class="card-header">
<h3 class="card-title">{{ speaker.name }}</h3>
</div>
<div class="card-body">
<div class="row">
<label class="list-label col-md-2">Biography</label>
<div class="col-md-10 well monospace-text">{{ speaker.biography_html|safe }}&nbsp;</div>
</div> </div>
<div class="row">
<label class="list-label col-md-2">Experience</label>
<div class="col-md-10 well monospace-text">{{ speaker.experience_html|safe }}&nbsp;</div>
</div>
{% if speaker.accessibility_html %}
<div class="row">
<label class="list-label col-md-2">Accessibility Requirements</label>
<div class="col-md-10 well monospace-text">{{ speaker.accessibility_html|safe }}&nbsp;</div>
</div>
{% endif %}
</div>
</div>
{% endif %}
{% endfor %}
{% can_manage proposal as can_manage_proposal %}
{% if can_manage_proposal or request.user.speaker_profile in proposal.speakers %}
<div class="row my-4">
<h2 class="col-12">
Travel Assistance
</h2>
</div>
<div class="row">
<div class="col-12">
<table class="table">
<thead>
<tr>
<th>Name</th>
<th>Travel</th>
<th>Accomodation</th>
</tr>
</thead>
<tbody>
{% for speaker in proposal.speakers %}
<tr>
{% if speaker.user %}
<td>{{ speaker.name }}</td>
<td>{{ speaker.travel_assistance }}</td>
<td>{{ speaker.accommodation_assistance }}</td>
{% else %}
<td><b>Unconfirmed co-presenter</b></td>
<td><b>Unknown</b></td>
<td><b>Unknown</b></td>
{% endif %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<br />
{% endif %}

13
pinaxcon/templates/symposion/proposals/_proposal_row.html
View file

@ -1,13 +1,12 @@
<!-- {% if proposal.result.status == "accepted" %} {% if proposal.result.status == "accepted" %}
<div class="card card-success mx-4"> <div class="card card-success border-primary mx-4 my-4">
{% elif proposal.result.status == "rejected" %} {% elif proposal.result.status == "rejected" %}
<div class="card card-danger mx-4"> <div class="card card-danger border-primary mx-4 my-4">
{% elif proposal.result.status == "standby" %} {% elif proposal.result.status == "standby" %}
<div class="card card-warning mx-4"> <div class="card card-warning border-primary mx-4 my-4">
{% else %} {% else %}
<div class="card card-primary mx-4"> <div class="card card-primary border-primary mx-4 my-4">
{% endif %} --> {% endif %}
<div class="card border-primary">
<div class="card-body"> <div class="card-body">
<h4 class="card-title text-primary"> <h4 class="card-title text-primary">
{{ proposal.title }} {{ proposal.title }}

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

@ -2,15 +2,8 @@
{% load staticfiles %} {% load staticfiles %}
{% block utility_body_outer %} {% block utility_body %}
{% block proposals_body_outer %} {% block proposals_body %}
<div class="l-content-page"> {% endblock %}
<div class="l-content-page--richtext">
{% block utility_body %}
{% block proposals_body %}
{% endblock %}
{% endblock %}
</div>
</div>
{% endblock %}
{% endblock %} {% endblock %}

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

@ -5,18 +5,17 @@
{% block head_title %}{{ proposal.title }}{% endblock %} {% block head_title %}{{ proposal.title }}{% endblock %}
{% 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 %}
<div class="tabbable"> <div>
<ul class="nav nav-tabs"> <ul class="nav nav-pills mb-5">
<li class="active"><a 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><a 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><a 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>
</ul> </ul>
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane active" id="proposal-detail"> <div class="tab-pane active" id="proposal-detail">
{% include "symposion/proposals/_proposal_fields.html" %} {% include "symposion/proposals/_proposal_fields.html" %}
<div class="btn-group">
{% if not proposal.cancelled %} {% if not proposal.cancelled %}
{% if request.user == proposal.speaker.user %} {% if request.user == proposal.speaker.user %}
<a class="btn btn-lg btn-primary" href="{% url "proposal_edit" proposal.pk %}">{% trans "Edit this proposal" %}</a> <a class="btn btn-lg btn-primary" href="{% url "proposal_edit" proposal.pk %}">{% trans "Edit this proposal" %}</a>
@ -28,11 +27,13 @@
{% else %} {% else %}
{% trans 'Cancelled' %} {% trans 'Cancelled' %}
{% endif %} {% endif %}
</div>
</div> </div>
<div class="tab-pane" id="supporting-document"> <div class="tab-pane" id="supporting-document">
{% if proposal.supporting_documents.exists %} <div class="row">
<div class="col-12">
<h2 class="my-4">Documents</h2>
{% 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 %}
<tr> <tr>
@ -46,26 +47,35 @@
</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-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 class="tab-pane" id="reviewer-feedback"> <div class="tab-pane" id="reviewer-feedback">
<h3>{% trans 'Conversation with Reviewers' %}</h3> <div class="row">
<div class="col-12">
<h2 class="my-4">{% trans 'Conversation with Reviewers' %}</h2>
</div>
</div>
{% for message in proposal.messages.all %} {% for message in proposal.messages.all %}
<div class="panel panel-default"> <div class="card">
<div class="panel-body"> <div class="card-body">
<div class="comment monospace-text"><em>{{ message.message|safe }}</em></div> <div class="comment monospace-text"><em>{{ message.message|safe }}</em></div>
</div> </div>
<div class="panel-heading"> <div class="card-footer">
<div><b>{{ message.user.username }}</b> {{ message.submitted_at|timesince }} ago</div> <div><b>{{ message.user.username }}</b> {{ message.submitted_at|timesince }} ago</div>
</div> </div>
</div> </div>
<br /> <br />
{% endfor %} {% endfor %}
<h3>{% trans 'Leave a Message' %}</h3> <h3 class="my-4">{% trans 'Leave a Message' %}</h3>
<p>{% trans 'You can leave a message for the reviewers here.' %}</p> <p>{% trans 'You can leave a message for the reviewers here.' %}</p>
<form class="form-horizontal" action="" method="POST" accept-charset="utf-8"> <form class="form-horizontal" action="" method="POST" accept-charset="utf-8">
{% csrf_token %} {% csrf_token %}

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

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

16
pinaxcon/templates/symposion/proposals/proposal_speaker_manage.html
View file

@ -6,14 +6,7 @@
{% block head_title %}{% trans 'Proposal:' %} {{ proposal.title }}{% endblock %} {% block head_title %}{% trans 'Proposal:' %} {{ proposal.title }}{% endblock %}
{% block proposals_body %} {% block proposals_body %}
<h1></h1> <h2 class="my-5">{% trans 'Current Speakers' %}</h2>
<p>
<a href="{% url "proposal_edit" proposal.pk %}">{% trans 'Edit proposal' %}
</a>
</p>
<h3>{% trans 'Current Speakers' %}</h3>
{% for speaker in speakers %} {% for speaker in speakers %}
{% if speaker.user %} {% if speaker.user %}
@ -23,15 +16,14 @@
{% endif %} {% endif %}
{% endfor %} {% endfor %}
<h3>{% trans 'Add another speaker' %}</h3> <h3 class="mt-5">{% trans 'Add another speaker' %}</h3>
<form class="form-horizontal" method="POST" action="" enctype="multipart/form-data"> <form class="form-horizontal" method="POST" action="" enctype="multipart/form-data">
{% csrf_token %} {% csrf_token %}
<fieldset> <fieldset>
{% include "_form_snippet.html" with form=add_speaker_form %} {% include "_form_snippet.html" with form=add_speaker_form %}
<div class="btn-group"> <input type="submit" value="Add speaker" class="btn btn-primary"/>
<input type="submit" value="Add speaker" class="btn btn-primary" /> <a href="{% url "proposal_edit" proposal.pk %}" class="btn btn-light">{% trans 'Cancel' %}
</div>
</fieldset> </fieldset>
</form> </form>
{% endblock %} {% endblock %}

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

@ -13,11 +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>
<div class="btn-group"> <input class="btn btn-primary" type="submit" name="finish" value="Save" />
<input class="btn btn-primary" type="submit" name="finish" value="Save" /> <input class="btn btn-default" type="submit" name="add-speakers" value="Save and Add Additional Speakers" />
<!-- <span style="float: right; padding: 4px 6px">or</span> -->
<input class="btn btn-default" type="submit" name="add-speakers" value="Save and Add Additional Speakers" />
</div>
</fieldset> </fieldset>
</form> </form>
{% endblock %} {% endblock %}

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

@ -93,10 +93,6 @@ footer {
li.nav-item { li.nav-item {
height: 2.75rem; height: 2.75rem;
a.nav-link {
padding-top: 0;
}
&.active > a.nav-link { &.active > a.nav-link {
font-weight: 700; font-weight: 700;
@ -258,3 +254,15 @@ main {
ul.messagelist { ul.messagelist {
margin-bottom: 0; margin-bottom: 0;
} }
label.list-label {
font-weight: bold;
}
.nav-pills>.nav-item {
background-color: #f3f3f3;
a {
color: $primary;
}
}