chore: layout & design fixes

src/components/StationsView/StationTable.vue

@@ -4,8 +4,7 @@
       v-if="apiStore.dataStatuses.connection == Status.Loading && filteredStationList.length == 0"
     />
 
-    <div class="table_wrapper" v-else-if="filteredStationList.length > 0">
-      <table>
+    <table v-else-if="filteredStationList.length > 0">
       <thead>
         <tr>
           <th
@@ -217,8 +216,7 @@
               :src="`/images/icon-${station.generalInfo.signalType}.svg`"
               :alt="station.generalInfo.signalType"
               :title="
-                  $t('sceneries.info.signals-type') +
-                  $t(`signals.${station.generalInfo.signalType}`)
+                $t('sceneries.info.signals-type') + $t(`signals.${station.generalInfo.signalType}`)
               "
             />
 
@@ -299,7 +297,6 @@
         </tr>
       </tbody>
     </table>
-    </div>
 
     <div class="no-stations" v-else>
       <div>
@@ -415,12 +412,15 @@ export default defineComponent({
 @import '../../styles/icons.scss';
 
 $rowCol: #424242;
+$tableBgCol: #555555;
 
 .station_table {
   height: 80vh;
   min-height: 700px;
-  overflow: auto;
+  overflow-y: scroll;
+  overflow-x: auto;
   font-weight: 500;
+  background-color: $tableBgCol;
 }
 
 .no-stations {

src/router/index.ts

@@ -58,7 +58,7 @@ const routes: Array<RouteRecordRaw> = [
 const router = createRouter({
   scrollBehavior(to, from, savedPosition) {
     if (to.name == 'SceneryView' && from.name !== to.name && from.query['view'] === undefined)
-      return { el: `.app_main` };
+      return { el: `.app_main`, top: -15 };
 
     if (savedPosition) return savedPosition;
   },

src/views/SceneryView.vue

@@ -121,10 +121,6 @@ export default defineComponent({
     Status: Status.Data
   }),
 
-  // activated() {
-  //   this.loadSelectedCheckpoint();
-  // },
-
   setup() {
     const route = useRoute();
 
@@ -215,11 +211,10 @@ button.back-btn {
 
   position: relative;
 
-  width: 100%;
   max-width: var(--max-container-width);
-  min-height: 100vh;
+  width: 100%;
 
-  margin: 1rem 0;
+  padding: 1rem 0;
   text-align: center;
 
   &[data-timetable-only='true'] {
@@ -233,9 +228,7 @@ button.back-btn {
   background-color: #181818;
   padding: 1em 0.5em;
 
-  height: 100vh;
-  min-height: 750px;
-  max-height: 1000px;
+  height: calc(100vh - 0.5em);
   overflow: auto;
 
   display: flex;
@@ -246,9 +239,7 @@ button.back-btn {
   background: #181818;
   padding: 1em 0.5em;
 
-  height: 100vh;
-  min-height: 750px;
-  max-height: 1000px;
+  height: calc(100vh - 0.5em);
 
   display: grid;
   grid-template-rows: auto 1fr auto;