 c8b912bfec
			
		
	
	
		c8b912bfec
		
	
	
	
	
		
			
			Add column to layout so mobile has padding. Use container to wrap schedule so padding and centred table applies to all views.
		
			
				
	
	
		
			120 lines
		
	
	
		
			No EOL
		
	
	
		
			4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			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 %} |