Aktualizacja scenerii i wyglądu select boxów

src/components/SceneryView/SceneryTimetable.vue

@@ -16,18 +16,19 @@
       </a>
     </h3>
 
-    <select-box
-      v-if="stationInfo && stationInfo.checkpoints"
-      :title="selectedOption"
-      :itemList="
-        stationInfo.checkpoints.map((cp, i) => ({
-          id: cp.checkpointName,
-          value: cp.checkpointName,
-        }))
-      "
-      bgColor="#444"
-      @selected="chooseOption"
-    ></select-box>
+    <div class="checkpoints">
+      <select-box
+        v-if="stationInfo && stationInfo.checkpoints"
+        :title="selectedOption"
+        :itemList="
+          stationInfo.checkpoints.map((cp, i) => ({
+            id: cp.checkpointName,
+            value: cp.checkpointName,
+          }))
+        "
+        @selected="chooseOption"
+      ></select-box>
+    </div>
 
     <span class="timetable-item loading" v-if="dataStatus == 0">{{
       $t("app.loading")
@@ -162,8 +163,8 @@ export default class SceneryTimetable extends Vue {
     this.loadSelectedOption();
   }
 
-  chooseOption(name: string) {
-    this.selectedOption = name;
+  chooseOption(item: { id: number | string; value: string }) {
+    this.selectedOption = item.value;
   }
 
   get currentURL() {
@@ -381,6 +382,15 @@ h3 {
   }
 }
 
+.checkpoints {
+  display: flex;
+  justify-content: center;
+
+  & > div {
+    border: 1px solid white;
+  }
+}
+
 .arrow {
   border: solid white;
   border-width: 0 2px 2px 0;