Ruderverein-Donau-Linz/rowt
1
1
Fork 1
Code Issues 49 Pull Requests Actions Packages Projects Wiki Activity

[WIP] styling kiosk page

Browse Source
This commit is contained in:
Marie Birner
2023-07-30 15:10:09 +02:00
parent 2ff7e24cbd
commit 4d80421b9b
4 changed files with 41 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
templates/includes/forms/log.html.tera
View File

@ -19,18 +19,19 @@
<input type="hidden" name="shipmaster" value="{{shipmaster}}" />
{% endif %}
{% if not only_ones %}
{{ macros::checkbox(label='shipmaster_only_steering', name='shipmaster_only_steering') }}
{{ macros::checkbox(label='handgesteuert', name='shipmaster_only_steering') }}
{% endif %}
{% if not only_ones %}
{{ log::rower_select(id="newrower", selected=[], class="col-span-2") }}
{% endif %}
{{ macros::input(label='Abfahrtszeit', name='departure', type='datetime-local', required=true) }}
{{ macros::input(label='Ankunftszeit', name='arrival', type='datetime-local') }}
<div>Departure: <input type="datetime-local" id="datetime-dep" name="departure" required/></div>
<div> Arrival: <input type="datetime-local" id="datetime-arr" name="arrival" /></div>
<div class="col-span-2">
Destination: <input type="search" list="destinations" placeholder="Destination" name="destination" id="destination" oninput="var inputElement = document.getElementById('destination');
<div>
<label for="destination" class="small text-gray-600">Ziel</label>
<input type="search" class="input rounded-md" list="destinations" placeholder="Destination" name="destination" id="destination" oninput="var inputElement = document.getElementById('destination');
var dataList = document.getElementById('destinations');
var selectedValue = inputElement.value;
for (var i = 0; i < dataList.options.length; i++) {
@ -46,10 +47,18 @@
{% endfor %}
</datalist>
</div>
{{ macros::input(label="Distanz", name="distance_in_km", type="number", min=0, wrapper_class="col-span-2") }}
<div class="relative">
{{ macros::input(label="Distanz", name="distance_in_km", type="number", min=1) }}
<span class="absolute right-0 bottom-0 py-1.5 px-2 bg-white border-0 text-gray-600 ring-1 ring-inset ring-gray-300 rounded-br-md rounded-tr-md">km</span>
</div>
{{ macros::input(label="Kommentar", name="comments", type="text", wrapper_class="col-span-2") }}
{{ macros::select(data=logtypes, select_name='logtype', default="Normal", class="col-span-2") }}
<input type="submit" value="Starten" class="btn btn-primary w-100 col-span-2 m-auto" />
<div class="col-span-2">
<label for="logtype" class=" small text-gray-600 ">Typ</label>
{{ macros::select(data=logtypes, select_name='logtype', default="Normal") }}
</div>
<input type="submit" value="Ausfahrt starten" class="btn btn-primary w-full col-span-2 m-auto" />
<script>
const currentDate = new Date();
@ -57,13 +66,13 @@
const formattedDate = localTime.toISOString().slice(0, 16);
// Set the formatted string as the value of the input field
document.getElementById("datetime-dep").value = formattedDate;
document.getElementById("departure").value = formattedDate;
</script>
</form>
<script>
document.getElementById('form').addEventListener('submit', function(e) {
e.preventDefault();
for(let optional_elem of ["datetime-arr", "distance_in_km", "comments", "logtype"]){
for(let optional_elem of ["arrival", "distance_in_km", "comments", "logtype"]){
let myInput = document.getElementById(optional_elem);
if (myInput.value === '') {
myInput.removeAttribute('name');

32
templates/kiosk.html.tera
View File

@ -12,21 +12,29 @@
{{ macros::alert(message=flash.1, type=flash.0, class="sm:col-span-2 lg:col-span-3") }}
{% endif %}
<div class="w-full grid grid-cols-5 gap-3 mt-5">
<div class="bg-white p-3">
{{ log::show_boats(only_ones=false) }}
<div class="w-full grid md:grid-cols-5 gap-3 mt-5">
<div class="bg-white rounded-md hidden md:block">
<h2 class="h2">Boote</h2>
<div class="p-3">
{{ log::show_boats(only_ones=false) }}
</div>
</div>
<div class="col-span-3 bg-white p-3">
<h2>Neue Ausfahrt starten</h2>
{{ log::new(only_ones=false, allow_any_shipmaster=true, shipmaster=-1) }}
<div class="md:col-span-3 bg-white rounded-md">
<h2 class="h2">Neue Ausfahrt</h2>
<div class="p-3">
{{ log::new(only_ones=false, allow_any_shipmaster=true, shipmaster=-1) }}
</div>
</div>
<div class="bg-white p-3">
<div class="bg-white rounded-md">
<h2 class="h2">Am Wasser</h2>
{% for log in on_water %}
{{ log::show(log=log, state="on_water", allowed_to_close=true, only_ones=false) }}
<hr />
{% endfor %}
<div class="p-3">
{% for log in on_water %}
{{ log::show(log=log, state="on_water", allowed_to_close=true, only_ones=false) }}
<hr />
{% endfor %}
</div>
</div>
</div>
</div>