Add notes

js/train-detail.js

@@ -34,6 +34,11 @@ async function parse(data) {
 }
 
 async function displayOptions(data) {
+  // for (service of data) {
+  //   create a button showing first departure time
+  //   alongside the TOC, the origin and destination.
+  //   maybe implement an accordion?
+  // }
   return data
 }
 
@@ -63,10 +68,9 @@ async function displayOne(object) {
     stopRows += await createPublicStopTableRow(stop)
   }
   const displayBox = document.getElementById('train_data')
-  const titleImg = document.getElementById('titleimg')
+  displayBox.innerHTML = ''
   displayBox.insertAdjacentHTML('beforeend', dataTableHead + stopRows + dataTableClose)
   displayBox.style = 'display:block;'
-  titleImg.style = 'width:150px;height:98px;padding-bottom:0;'
 }
 
 async function createPublicStopTableRow(stop) {
@@ -88,11 +92,4 @@ async function createPublicStopTableRow(stop) {
         <td id='public_dep'>${public_dep}</td>
       </tr>
     `
-}
-
-async function reset() {
-  const titleImg = document.getElementById('titleimg')
-  const displayBox = document.getElementById('train_data')
-  titleImg.style = ''
-  displayBox.innerHTML = ''
 }

styles/train-detail.css

@@ -1,16 +1,23 @@
+.titleimg {
+    width: 150px;
+    height: 98px;
+    padding-bottom: 0;
+}
+
 #data_headcode {
-  color: var(--second-text-color);
-  font-size: 25px;
-  font-weight:bolder;
+    color: var(--second-text-color);
+    font-size: 25px;
+    font-weight: bolder;
+    margin-bottom: 5px
 }
-  
+
 #data_piscode {
-  color: var(--second-text-color);
+    margin: 5px;
+    color: var(--second-text-color)
 }
-  
+
 #data_table {
-  color: var(--second-text-color);
-  width: 200px;
-  margin: auto;
-}
-  
+    color: var(--second-text-color);
+    width: 200px;
+    margin: auto
+}  

train-detail.html

@@ -38,7 +38,6 @@
       <source srcset="./images/logo/logo-full-250.png" type="image/png">
       <img class="titleimg" id="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
     </picture>
-    <h2>Train Details</h2>
       <div id="train_options">
 
       </div>