Add train detail accordians

This commit is contained in:
Fred Boniface
2023-06-30 11:08:59 +01:00
parent 8bd6454b67
commit 55d1d5cfe9
2 changed files with 114 additions and 48 deletions

View File

@@ -6,6 +6,7 @@
import { uuid } from '$lib/stores/uuid';
import { onMount } from 'svelte'
import TrainDetail from '$lib/train/train-detail.svelte';
let title = "Timetable Results"
let id = ""
@@ -68,6 +69,7 @@
</script>
<Header {title} />
<div id="whitespace"></div>
{#if error}
<Island>
@@ -80,63 +82,18 @@
{/if}
{#each data as service}
{#if service.stops[0]['publicDeparture']}
<h2>GW: {service.stops[0]['publicDeparture']} {service.stops[0]['tiploc']} to {service.stops[service['stops'].length -1]['tiploc']}</h2>
<p>PIS: {service.pis}</p>
<table>
<tr>
<th>Location</th>
<th>Sch Arr.</th>
<th>Sch Dep.</th>
</tr>
{#each service.stops as stop}
{#if stop.publicArrival || stop.publicDeparture}
<tr>
<td>{stop.tiploc}</td>
<td>{stop.publicArrival || '-'}</td>
<td>{stop.publicDeparture || '-'}</td>
</tr>
{/if}
{/each}
</table>
{:else}
<h2>GW: {service.stops[0]['wttDeparture']} {service.stops[0]['tiploc']} to {service.stops[service['stops'].length -1]['tiploc']}</h2>
<p>PIS: {service.pis}</p>
<table>
<tr>
<th>Location</th>
<th>Sch Arr.</th>
<th>Sch Dep.</th>
</tr>
{#each service.stops as stop}
<tr>
<td>{stop.tiploc}</td>
<td>{stop.wttArrival || '-'}</td>
<td>{stop.wttDeparture || '-'}</td>
</tr>
{/each}
</table>
{/if}
<TrainDetail {service} />
{/each}
<Nav />
<style>
h2 {
margin-top: 20px;
#whitespace {
height: 15px;
}
p {
color: white;
font-size: 18px;
font-weight: 600;
}
table {
margin: auto;
color: white;
font-size: 16px;
}
th, td {
padding-left: 8px;
padding-right: 8px;
}
</style>