Migrate transport mode icons to Tabler Icons

src/lib/cards/QuickLinkCard.svelte

@@ -15,10 +15,11 @@
 </script>
 
 <Card config={upstreamProps}>
+    <div class="quick-links">
     {#if !$ql.length}
         <LinkButton text={"Add Quick Links"} link={"/more/settings"} />
     {:else}
-        <div class="quick-links">
+        
             {#each $ql as link}
                 {#if link.length === 3}
                     <LinkButton text={link.toUpperCase()} link={`/ldb?station=${link.toLowerCase()}`} />
@@ -26,8 +27,9 @@
                     <LinkButton text={link.toUpperCase()} link={`/train?headcode=${link.toLowerCase()}`} />
                 {/if}
             {/each}
-        </div>
+        
     {/if}
+    </div>
 </Card>
 
 <style>

src/lib/ldb/public-ldb.svelte

@@ -8,6 +8,7 @@
     import Island from "$lib/islands/island.svelte";
     import { getApiUrl } from "$lib/scripts/upstream";
     import TimeBar from "$lib/navigation/TimeBar.svelte";
+    import { IconBus, IconSailboat } from "@tabler/icons-svelte";
 
     let requestedStation;
     $: requestedStation = station;
@@ -157,7 +158,6 @@
 {#if isLoading}
     <Loading />
 {:else if dataAge}
-    <p id="timestamp">Updated: {dataAge.toLocaleTimeString()}</p>
     {#if services.length}
         <table class="ldbTable">
             <tr>
@@ -215,7 +215,7 @@
     {/if}
     {#if busServices.length}
         <br />
-        <img class="transport-mode" src="/images/transport-modes/bus.svg" alt="Bus services" /><br />
+        <IconBus /><br />
         <span class="table-head-text">Bus Services</span>
         <table class="ldbTable">
             <tr>
@@ -258,7 +258,7 @@
     {/if}
     {#if ferryServices.length}
         <br />
-        <img class="transport-mode" src="/images/transport-modes/ferry.svg" alt="Bus services" /><br />
+        <IconSailboat /><br />
         <span class="table-head-text">Ferry Services</span>
         <table class="ldbTable">
             <tr>

src/lib/ldb/staff/staff-ldb.svelte

@@ -1,13 +1,14 @@
 <script lang="ts">
     import TableGenerator from "./table/table-generator.svelte";
     import Loading from "$lib/navigation/loading.svelte";
-    import type { ApiResponse, StaffLdb } from "@owlboard/ts-types";
+    import type { StaffLdb } from "@owlboard/ts-types";
     import { detailInit, defineDetail } from "./train-detail";
     import TrainDetail from "./train-detail.svelte";
     import { fetchStaffLdb } from "./fetch";
     import AlertBar from "../common/nrcc/alert-bar.svelte";
     import TimeBar from "$lib/navigation/TimeBar.svelte";
     import { onMount } from "svelte";
+    import { IconBus, IconSailboat } from "@tabler/icons-svelte";
 
     export let station: string;
     export let title: string | undefined = "Loading...";
@@ -76,12 +77,14 @@
             <TableGenerator services={data.trainServices} click={showDetail} />
         {/if}
         {#if data.busServices?.length}
-            <img class="transport-mode" src="/images/transport-modes/bus.svg" alt="Bus services" /><br />
+            <IconBus />
+            <br />
             <span class="table-head-text">Bus Services</span>
             <TableGenerator services={data.busServices} click={showDetail} />
         {/if}
         {#if data.ferryServices?.length}
-            <img class="transport-mode" src="/images/transport-modes/ferry.svg" alt="Ferry services" /><br />
+            <IconSailboat />
+            <br>
             <span class="table-head-text">Ferry Services</span>
             <TableGenerator services={data.ferryServices} click={showDetail} />
         {/if}