chore: added SRJP external link

src/components/Global/DonationCard.vue

@@ -187,7 +187,7 @@ a.discord {
   text-decoration: underline;
 }
 
-.actions {
+.actions-container {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
   gap: 0.5em;

src/locales/en.json

@@ -376,6 +376,7 @@
     "scenery-offline": "Offline ride",
     "timeout": "An error occured while trying to refresh SWDR timetable data!",
     "driver-journal-link": "DRIVER JOURNAL",
+    "driver-srjp-link": "SRJP",
     "driver-return-link": "GO BACK",
     "driver-not-found-header": "Train not found! :/",
     "driver-not-found-desc-1": "This train has already been terminated, changed its number or is offline.",

src/locales/pl.json

@@ -363,6 +363,7 @@
     "scenery-offline": "Przejazd offline",
     "timeout": "Wystąpił problem z aktualizacją rozkładów jazdy z SWDR",
     "driver-journal-link": "DZIENNIK MASZYNISTY",
+    "driver-srjp-link": "SRJP",
     "driver-return-link": "POWRÓT",
     "driver-not-found-header": "Nie znaleziono pociągu! :/",
     "driver-not-found-desc-1": "Ten pociąg prawdopodobnie zakończył już swój bieg, zmienił numer lub jest offline.",

src/views/DriverView.vue

@@ -2,24 +2,40 @@
   <section class="driver-view">
     <div class="view-wrapper">
       <div v-if="chosenTrain">
-        <div class="actions">
-          <a class="a-button btn--image" @click="$router.back()">
-            <img src="/images/icon-back.svg" alt="train icon" />
-            <span>
-              {{ $t('trains.driver-return-link') }}
-            </span>
-          </a>
+        <div class="actions-container">
+          <div class="actions actions-left">
+            <a class="a-button btn--image" @click="$router.back()">
+              <img src="/images/icon-back.svg" alt="train icon" />
+              <span>
+                {{ $t('trains.driver-return-link') }}
+              </span>
+            </a>
+          </div>
 
-          <router-link
-            :to="`/journal/timetables?search-driver=${chosenTrain.driverName}`"
-            class="a-button btn--image"
-          >
-            <span class="hidable">
-              {{ $t('trains.driver-journal-link') }}
-            </span>
+          <div class="actions actions-right">
+            <a
+              class="a-button btn--image"
+              :href="`https://srjp-td2.web.app/?id=${chosenTrain.id}`"
+              target="_blank"
+            >
+              <span class="hidable">
+                {{ $t('trains.driver-srjp-link') }}
+              </span>
 
-            <img src="/images/icon-train.svg" alt="train icon" />
-          </router-link>
+              <img src="/images/icon-srjp.svg" alt="srjp icon" />
+            </a>
+
+            <router-link
+              :to="`/journal/timetables?search-driver=${chosenTrain.driverName}`"
+              class="a-button btn--image"
+            >
+              <span class="hidable">
+                {{ $t('trains.driver-journal-link') }}
+              </span>
+
+              <img src="/images/icon-train.svg" alt="train icon" />
+            </router-link>
+          </div>
         </div>
 
         <div class="train-card">
@@ -142,14 +158,19 @@ $viewBgCol: #1a1a1a;
   min-height: calc(100vh - 7em);
 }
 
-.actions {
+.actions-container {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: 0.5em;
 }
 
-.actions > a {
+.actions {
+  display: flex;
+  gap: 0.5em;
+}
+
+.actions-container > .actions > a {
   background-color: $viewBgCol;
   padding: 0.5em;
   border-radius: 0.5em 0.5em 0 0;
@@ -189,7 +210,7 @@ $viewBgCol: #1a1a1a;
 }
 
 @include smallScreen {
-  .actions > a > span.hidable {
+  span.hidable {
     display: none;
   }
 }