Skip to content

GitLab

Commit 87fdb39e authored by Bengfort's avatar Bengfort
Browse files

full-width tables

parent 04ac0180
Hide whitespace changes
Inline Side-by-side
scheduler/main/static/style.css 0 → 100644
View file @ 87fdb39e
.full-width {
width: 100vw;
position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
overflow-x: auto;
}
.full-width > * {
width: auto;
margin: 0 auto;
}
scheduler/main/templates/base.html
View file @ 87fdb39e
......@@ -10,6 +10,7 @@
<link rel="shortcut icon" type="image/x-icon" href="{% static 'images/favicon.ico' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'bootstrap-datepicker/dist/css/bootstrap-datepicker3.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'style.css' %}" />
</head>
<body>
<header class="bg-dark">
......
scheduler/main/templates/main/invitation_form.html
View file @ 87fdb39e
......@@ -12,30 +12,32 @@
{% bootstrap_form_errors form %}
<p>{% translate 'Please select one of the available timeslots to make an appointment. You will still be able to change your selection later.' %}</p>
<table class="table table-hover" data-js="multi-datetime">
<thead>
<tr>
<th></th>
{% for time in table.times %}
<th data-value="{{ time|date:'H:i' }}">{{ time }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for date, row in table.timeslots.items %}
<div class="full-width my-2">
<table class="table table-hover" data-js="multi-datetime">
<thead>
<tr>
<th>{{ date }}</th>
{% for time, id in row.items %}
<td>
{% if id %}
<input type="radio" name="timeslot" value="{{ id }}" {% if id == form.timeslot.value %}checked{% endif %}>
{% endif %}
</td>
<th></th>
{% for time in table.times %}
<th data-value="{{ time|date:'H:i' }}">{{ time }}</th>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</thead>
<tbody>
{% for date, row in table.timeslots.items %}
<tr>
<th>{{ date }}</th>
{% for time, id in row.items %}
<td>
{% if id %}
<input type="radio" name="timeslot" value="{{ id }}" {% if id == form.timeslot.value %}checked{% endif %}>
{% endif %}
</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div class="d-print-none mb-3">
<button class="btn btn-secondary" name="timeslot" value="">{% translate 'Reset' %}</button>
......
scheduler/main/templates/main/schedule_form.html
View file @ 87fdb39e
......@@ -39,28 +39,30 @@
</div>
</div>
<table class="table table-hover" data-js="multi-datetime">
<thead>
<tr>
<th></th>
{% for time in form.timeslots.value.times %}
<th data-value="{{ time|date:'H:i' }}">{{ time }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for date, row in form.timeslots.value.timeslots.items %}
<tr data-value="{{ date|date:'Y-m-d' }}">
<th>{{ date }}</th>
{% for time, checked in row.items %}
<td>
<input type="checkbox" name="timeslots" value="{{ date|date:'Y-m-d' }} {{ time|date:'H:i' }}" {% if checked %}checked{% endif %}>
</td>
<div class="full-width my-2">
<table class="table table-hover" data-js="multi-datetime">
<thead>
<tr>
<th></th>
{% for time in form.timeslots.value.times %}
<th data-value="{{ time|date:'H:i' }}">{{ time }}</th>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</thead>
<tbody>
{% for date, row in form.timeslots.value.timeslots.items %}
<tr data-value="{{ date|date:'Y-m-d' }}">
<th>{{ date }}</th>
{% for time, checked in row.items %}
<td>
<input type="checkbox" name="timeslots" value="{{ date|date:'Y-m-d' }} {{ time|date:'H:i' }}" {% if checked %}checked{% endif %}>
</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
</fieldset>
<div class="d-print-none mb-3">
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment