Zmiany w wyświetlaniu trasy pocągu, poprawki w wyglądzie tabel

src/components/TrainsView/TrainSchedule.vue

@@ -14,8 +14,12 @@
 
           <div
             class="stop-line arrival"
-            v-if="i > 0 && followingStops[i - 1].departureLine != stop.arrivalLine"
-          >{{ stop.arrivalLine }}</div>
+            v-if="
+              i > 0 && followingStops[i - 1].departureLine != stop.arrivalLine
+            "
+          >
+            {{ stop.arrivalLine }}
+          </div>
 
           <span class="stop-info">
             <div class="info-indicator"></div>
@@ -25,20 +29,35 @@
               <span
                 class="date-arrival"
                 v-if="!stop.beginsHere"
-                :class="{delayed: stop.arrivalDelay > 0, preponed: stop.arrivalDelay < 0}"
-              >p. {{stylizeTime(stop.arrivalRealTimeString, stop.arrivalDelay)}}</span>
+                :class="{
+                  delayed: stop.arrivalDelay > 0,
+                  preponed: stop.arrivalDelay < 0,
+                }"
+                >p.
+                {{
+                  stylizeTime(stop.arrivalRealTimeString, stop.arrivalDelay)
+                }}</span
+              >
 
               <span
                 class="date-stop"
                 v-if="stop.stopTime"
                 :class="stop.stopType.replace(', ', '-')"
-              >{{ stop.stopTime }} {{ stop.stopType }}</span>
+                >{{ stop.stopTime }} {{ stop.stopType }}</span
+              >
 
               <span
                 class="date-departure"
                 v-if="!stop.terminatesHere && stop.stopTime != 0"
-                :class="{delayed: stop.departureDelay > 0, preponed: stop.departureDelay < 0}"
-              >o. {{ stylizeTime(stop.departureRealTimeString, stop.departureDelay) }}</span>
+                :class="{
+                  delayed: stop.departureDelay > 0,
+                  preponed: stop.departureDelay < 0,
+                }"
+                >o.
+                {{
+                  stylizeTime(stop.departureRealTimeString, stop.departureDelay)
+                }}</span
+              >
             </span>
           </span>
 
@@ -185,7 +204,8 @@ li.schedule-item > .stop-info {
       }
 
       &.pt,
-      &.pm {
+      &.pm,
+      &.pt-pm {
         background: #252525;
       }
     }

src/components/TrainsView/TrainTable.vue

@@ -171,6 +171,7 @@ import Train from "@/scripts/interfaces/Train";
 import Station from "@/scripts/interfaces/Station";
 
 import TrainSchedule from "@/components/TrainsView/TrainSchedule.vue";
+import TrainStop from '@/scripts/interfaces/TrainStop';
 
 @Component({
   components: { TrainSchedule }
@@ -202,11 +203,10 @@ export default class TrainTable extends Vue {
 
   generateStopList(stops: any): string | undefined {
     if (!stops) return "";
-    return stops.reduce((acc, stop, i) => {
-
-      if (stop.stopType.includes("ph")) acc.push(`<strong>${stop.stopName}</strong>`);
-      else if (i > 0 && i < stops.length - 1 && !stop.stopName.includes("po."))
-        acc.push(`<span style='color: #ccc;'>${stop.stopName.includes("podg.") ? stop.stopName.split(",")[0] : stop.stopName}</span>`);
+    return stops.reduce((acc, stop: TrainStop, i) => {
+      if (stop.stopType.includes("ph")) acc.push(`<strong style='color:${stop.confirmed ? "springgreen" : "white"}'>${stop.stopName}</strong>`);
+      else if (i > 0 && i < stops.length - 1)
+        acc.push(`<span style='color:${stop.confirmed ? "springgreen" : "lightgray"}'>${stop.stopName}</span>`);
       return acc;
     }, []).join(" * ");
   }
@@ -360,6 +360,10 @@ export default class TrainTable extends Vue {
 }
 
 .stats {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+
   &-main {
     display: flex;
     margin-bottom: 1.5em;