From 2a18ba43683b7496f446ebf906b079611b3f7ca6 Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Sat, 2 Mar 2024 22:19:41 +0100
Subject: [PATCH] =?UTF-8?q?poprawki=20szeroko=C5=9Bci?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/StationsView/StationTable.vue | 55 +++++++-------------
 src/styles/JournalSection.scss               |  2 +-
 src/styles/global.scss                       |  1 +
 src/views/SceneryView.vue                    | 10 ++--
 src/views/StationsView.vue                   |  2 +-
 src/views/TrainsView.vue                     |  2 +-
 6 files changed, 28 insertions(+), 44 deletions(-)

diff --git a/src/components/StationsView/StationTable.vue b/src/components/StationsView/StationTable.vue
index 694b3a3..85f5f2f 100644
--- a/src/components/StationsView/StationTable.vue
+++ b/src/components/StationsView/StationTable.vue
@@ -192,7 +192,7 @@
               </span>
             </td>
 
-            <td class="station_info" v-if="station.generalInfo">
+            <td class="station-info" v-if="station.generalInfo">
               <span
                 class="scenery-icon icon-info"
                 :class="station.generalInfo.controlType.replace('+', '-')"
@@ -201,25 +201,21 @@
               >
               </span>
 
-              <span>
-                <img
-                  class="icon-info"
-                  v-if="station.generalInfo.SUP"
-                  src="/images/icon-SUP.svg"
-                  alt="SUP (RASP-UZK)"
-                  :title="$t('desc.SUP')"
-                />
-              </span>
+              <img
+                class="icon-info"
+                v-if="station.generalInfo.signalType"
+                :src="`/images/icon-${station.generalInfo.signalType}.svg`"
+                :alt="station.generalInfo.signalType"
+                :title="$t('desc.signals-type') + $t(`signals.${station.generalInfo.signalType}`)"
+              />
 
-              <span>
-                <img
-                  class="icon-info"
-                  v-if="station.generalInfo.signalType"
-                  :src="`/images/icon-${station.generalInfo.signalType}.svg`"
-                  :alt="station.generalInfo.signalType"
-                  :title="$t('desc.signals-type') + $t(`signals.${station.generalInfo.signalType}`)"
-                />
-              </span>
+              <img
+                class="icon-info"
+                v-if="station.generalInfo.SUP"
+                src="/images/icon-SUP.svg"
+                alt="SUP (RASP-UZK)"
+                :title="$t('desc.SUP')"
+              />
             </td>
 
             <td class="station-info" v-else>
@@ -530,30 +526,19 @@ tr {
 }
 
 .station-info {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
   /* Images */
   .icon-info {
-    // display: flex;
-    // justify-content: center;
-    // align-items: center;
+    vertical-align: middle;
+    line-height: 32px;
 
     width: 32px;
     height: 32px;
     font-size: 12px;
 
-    margin: 0 0.2em;
+    margin: 0 4px;
 
-    outline: 2px solid #444;
-    border-radius: 0.5em;
-
-    @include smallScreen() {
-      width: 24px;
-      height: 24px;
-      font-size: 10px;
-    }
+    outline: 2px solid #2b2b2b;
+    border-radius: 5px;
   }
 }
 
diff --git a/src/styles/JournalSection.scss b/src/styles/JournalSection.scss
index c95422a..504cf1f 100644
--- a/src/styles/JournalSection.scss
+++ b/src/styles/JournalSection.scss
@@ -11,7 +11,7 @@
 }
 
 .journal_wrapper {
-  max-width: 1350px;
+  max-width: 1500px;
   width: 100%;
 
   margin: 0 auto;
diff --git a/src/styles/global.scss b/src/styles/global.scss
index 4b71fbf..94e5cef 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -19,6 +19,7 @@
   --clr-donator: #f7a4ff;
 
   --no-scroll-padding: 17px;
+  --max-container-width: 1700px;
 
   font-size: 16px;
 }
diff --git a/src/views/SceneryView.vue b/src/views/SceneryView.vue
index 36b275f..4429fdd 100644
--- a/src/views/SceneryView.vue
+++ b/src/views/SceneryView.vue
@@ -210,13 +210,13 @@ button.back-btn {
 
 .scenery-wrapper {
   display: grid;
-  grid-template-columns: 4fr 5fr;
+  grid-template-columns: 4fr 6fr;
   gap: 0 1em;
 
   position: relative;
 
   width: 100%;
-  max-width: 1700px;
+  max-width: var(--max-container-width);
   min-height: 100vh;
 
   margin: 1rem 0;
@@ -234,11 +234,9 @@ button.back-btn {
   padding: 1em 0.5em;
 
   height: 95vh;
-  min-height: 550px;
+  min-height: 750px;
   max-height: 1000px;
 
-  overflow: auto;
-
   display: flex;
   flex-direction: column;
 }
@@ -248,7 +246,7 @@ button.back-btn {
   padding: 1em 0.5em;
 
   height: 95vh;
-  min-height: 550px;
+  min-height: 750px;
   max-height: 1000px;
 
   display: grid;
diff --git a/src/views/StationsView.vue b/src/views/StationsView.vue
index d54f054..f6f419a 100644
--- a/src/views/StationsView.vue
+++ b/src/views/StationsView.vue
@@ -99,7 +99,7 @@ export default defineComponent({
 
 .wrapper {
   max-width: 100%;
-  width: 1700px;
+  width: var(--max-container-width);
 }
 
 .stations-options {
diff --git a/src/views/TrainsView.vue b/src/views/TrainsView.vue
index 99a7d82..19baee8 100644
--- a/src/views/TrainsView.vue
+++ b/src/views/TrainsView.vue
@@ -126,7 +126,7 @@ export default defineComponent({
 
 .trains_wrapper {
   margin: 1rem auto;
-  max-width: 1350px;
+  max-width: 1500px;
 }
 
 .trains_topbar {