symposion_app/pinaxcon/templates/symposion/schedule/schedule_conference.html
Joel Addison c8b912bfec Fix padding for schedule
Add column to layout so mobile has padding. Use container to wrap schedule so padding and
centred table applies to all views.
2019-01-23 08:41:33 +13:00

120 lines
No EOL
4 KiB
HTML

{% extends "utility_page.html" %}
{% load i18n %}
{% load cache %}
{% load lca2018_tags %}
{% block head_title %}Conference Schedule{% endblock %}
{% block header_title %}Conference Schedule{% endblock %}
{% block body_class %}bg-primary text-secondary{% endblock body_class %}
{% block right %}
{% endblock %}
{% block navbar %}{% include 'nav.html' with color='green' %}{% endblock %}
{% block main_class %}container-fluid{% endblock %}
{% block content %}
<div class="schedule-header text-center">
<h1>Schedule</h1>
<h3 id="schedule-date">wednesday 23 January 2019</h3>
<nav class="mb-4">
<div class="nav schedule-nav" id="schedule-nav" role="tablist">
Monday miniconfs
{% for section in sections %}
{% if "Miniconf" in section.schedule.section.name %}
{% for timetable in section.days %}
{% if timetable.day.date|date:"Y-m-d" == "2019-01-21" %}
{% include "symposion/schedule/_schedule_nav_link.html" with label=section.schedule.section.name|cut:" Miniconf" %}
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
<br />
Tuesday miniconfs
{% for section in sections %}
{% if "Miniconf" in section.schedule.section.name %}
{% for timetable in section.days %}
{% if timetable.day.date|date:"Y-m-d" == "2019-01-22" %}
{% include "symposion/schedule/_schedule_nav_link.html" with label=section.schedule.section.name|cut:" Miniconf" %}
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
<br />
{% for section in sections %}
{% if "Miniconf" not in section.schedule.section.name %}
{% for timetable in section.days %}
{% include "symposion/schedule/_schedule_nav_link.html" with active=forloop.first label=timetable.day.date|date:"l" %}
{% endfor %}
{% endif %}
{% endfor %}
</div>
</nav>
</div>
<div class="schedule-page bg-secondary text-primary pt-4 pb-4 mb-0">
<div class="container">
<div class="row">
<div class="col">
<div class="tab-content">
{% for section in sections %}
{% for timetable in section.days %}
<div class="tab-pane fade {% if timetable.day.date|date:'Y-m-d' == '2019-01-23' %}show active{% endif %}" id="{{ section.schedule.section.slug }}-{{ timetable.day.date|date:"l"|lower}}"
role="tabpanel" aria-labelledby="{{ section.schedule.section.slug }}-{{ timetable.day.date|date:"l"|lower}}-tab">
<div class="table-responsive hidden-md-down">
{% include "symposion/schedule/_grid.html" %}
</div>
<div class="mobile-schedule">
{% include "symposion/schedule/_mobile.html" %}
</div>
</div>
{% endfor %}
{% endfor %}
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{%block footer_class %}footer-no-margin{% endblock %}
{% block scripts_extra %}
<script type="text/javascript">
var dates = {
'monday': '21',
'tuesday': '22',
'wednesday': '23',
'thursday': '24',
'friday': '25'
};
var trailing = ' January 2019';
$('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
var controls = e.target.attributes['aria-controls'].value
var day = controls.split('-');
day = day[day.length - 1];
$('#schedule-date').text(day + ' ' + dates[day] + trailing);
var loc = window.location.toString().split('?')[0] += '?schedule=' + controls;
window.history.pushState({path: loc}, '', loc);
})
</script>
<script>
const urlParams = new URLSearchParams(window.location.search);
const scheduleName = urlParams.get('schedule');
if(scheduleName !== null) {
$('a[href="#' + scheduleName + '"]').tab('show');
} else {
var currLoc = $('a[data-toggle="tab"].active').first().attr('aria-controls');
var loc = window.location.toString().split('?')[0] += '?schedule=' + currLoc;
window.history.replaceState({path: loc}, '', loc);
}
</script>
{{ block.super }}
{% endblock %}