From 55456167068d521d139f57eed296e18287b7fefd Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Thu, 22 Aug 2024 02:28:40 +0200
Subject: [PATCH] chore: styling hotfixes and improvements

---
 .../SceneryInfo/SceneryInfoUserList.vue       | 32 +++++++++----------
 src/components/StationsView/StationTable.vue  | 14 ++++----
 src/views/DriverView.vue                      |  2 +-
 3 files changed, 22 insertions(+), 26 deletions(-)

diff --git a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue
index 375c528..c67f1b5 100644
--- a/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue
+++ b/src/components/SceneryView/SceneryInfo/SceneryInfoUserList.vue
@@ -15,7 +15,6 @@
       <li
         v-for="{ train, status } in stationTrains"
         class="badge user"
-        tabindex="0"
         :key="train.id"
         :data-status="status"
       >
@@ -98,38 +97,27 @@ ul {
 }
 
 .user {
-  cursor: pointer;
-
-  &_train {
-    color: black;
-    background-color: $no-timetable;
-
-    transition: background-color 200ms;
-    -ms-transition: background-color 200ms;
-    -webkit-transition: background-color 200ms;
-  }
-
   &[data-status='no-timetable'] .user_train {
     background-color: $no-timetable;
   }
 
-  &[data-status='departed'] > &_train {
+  &[data-status='departed'] .user_train {
     background-color: $departed;
   }
 
-  &[data-status='stopped'] > &_train {
+  &[data-status='stopped'] .user_train {
     background-color: $stopped;
   }
 
-  &[data-status='online'] > &_train {
+  &[data-status='online'] .user_train {
     background-color: $online;
   }
 
-  &[data-status='terminated'] > &_train {
+  &[data-status='terminated'] .user_train {
     background-color: $terminated;
   }
 
-  &[data-status='disconnected'] > &_train {
+  &[data-status='disconnected'] .user_train {
     background-color: $disconnected;
   }
 
@@ -138,6 +126,16 @@ ul {
     pointer-events: none;
   }
 }
+
+.user_train {
+  color: black;
+  background-color: $no-timetable;
+
+  transition: background-color 200ms;
+  -ms-transition: background-color 200ms;
+  -webkit-transition: background-color 200ms;
+}
+
 .users-anim {
   &-move,
   &-enter-active,
diff --git a/src/components/StationsView/StationTable.vue b/src/components/StationsView/StationTable.vue
index 9296853..fbe937f 100644
--- a/src/components/StationsView/StationTable.vue
+++ b/src/components/StationsView/StationTable.vue
@@ -59,8 +59,7 @@
           :key="station.name"
           @click.right.prevent="openForumSite($event, station.generalInfo?.url)"
           @keydown.space.prevent="openForumSite($event, station.generalInfo?.url)"
-          tabindex="0"
-          :to="getSceneryRoute(station.name)"
+          :to="getSceneryRoute(station)"
         >
           <td class="station-name" :class="station.generalInfo?.availability">
             <b v-if="station.generalInfo?.project" style="color: salmon">{{
@@ -121,7 +120,7 @@
             <span v-if="station.onlineInfo?.dispatcherName">
               <b
                 v-if="apiStore.donatorsData.includes(station.onlineInfo.dispatcherName)"
-                @click.stop="openDonationCard"
+                @click.prevent="openDonationCard"
                 data-tooltip-type="DonatorTooltip"
                 :data-tooltip-content="$t('donations.dispatcher-message')"
               >
@@ -319,7 +318,7 @@ import dateMixin from '../../mixins/dateMixin';
 import styleMixin from '../../mixins/styleMixin';
 import { useApiStore } from '../../store/apiStore';
 import { useMainStore } from '../../store/mainStore';
-import { Status } from '../../typings/common';
+import { Station, Status } from '../../typings/common';
 import { useTooltipStore } from '../../store/tooltipStore';
 import { getChangedFilters } from '../../managers/stationFilterManager';
 import { ActiveSorter, HeadIdsType, headIconsIds, headIds } from './typings';
@@ -363,9 +362,7 @@ export default defineComponent({
   },
 
   methods: {
-    getSceneryRoute(name: string) {
-      const station = this.filteredStationList.find((station) => station.name === name);
-
+    getSceneryRoute(station: Station) {
       // TODO: Hide tooltips when navigating away
 
       return {
@@ -499,7 +496,8 @@ table {
   }
 }
 
-tr, .a-row {
+tr,
+.a-row {
   background-color: $rowCol;
 
   &:nth-child(even) {
diff --git a/src/views/DriverView.vue b/src/views/DriverView.vue
index ebf1249..1c1aad3 100644
--- a/src/views/DriverView.vue
+++ b/src/views/DriverView.vue
@@ -7,7 +7,7 @@
             <img src="/images/icon-back.svg" alt="train icon" />
             <span>{{ $t('trains.driver-return-link') }}</span>
           </router-link>
-          <router-link :to="`/journal/timetables?search-driver=`" class="a-button btn--image">
+          <router-link :to="`/journal/timetables?search-driver=${chosenTrain.driverName}`" class="a-button btn--image">
             <img src="/images/icon-train.svg" alt="train icon" />
             <span class="hidable">
               {{ $t('trains.driver-journal-link') }}