zakładki: poprawki widoku i działania

src/components/tabs/NumberGeneratorTab.vue

@@ -23,9 +23,12 @@
       </div>
 
       <div class="generated-number">
-        Wygenerowany numer pociągu: <b class="text--accent">{{ trainNumber }}</b>
+        <span v-if="trainNumber">Wygenerowany numer pociągu: <b class="text--accent">{{ trainNumber }}</b></span>
+        <span v-else>Wybierz obszary konstrukcyjne i kategorię!</span>
       </div>
 
+      <hr>
+      
       <div class="tab_actions">
         <button class="btn" @click="randomizeTrainNumber">PRZELOSUJ</button>
       </div>
@@ -99,7 +102,7 @@ const randomizeTrainNumber = () => {
 }
 
 .generated-number {
-  font-size: 1.5em;
+  font-size: 1.3em;
   font-weight: bold;
 
   margin: 0.5em 0;
@@ -108,6 +111,8 @@ const randomizeTrainNumber = () => {
 }
 
 .tab_actions {
+  margin-top: 0.5em;
+
   button {
     grid-column: 3;
   }

src/components/tabs/StockGeneratorTab.vue

@@ -8,7 +8,9 @@
       <div>
         <h2>WŁAŚCIWOŚCI SKŁADU</h2>
 
-        <b class="text--accent"> &lArr; Dodaj lokomotywę na pierwsze miejsce listy, aby uwzględnić ją przy losowaniu składu! </b>
+        <b class="text--accent">
+          &lArr; Dodaj lokomotywę na pierwsze miejsce listy, aby uwzględnić ją przy losowaniu składu!
+        </b>
 
         <div class="tab_attributes">
           <label>
@@ -285,13 +287,6 @@ export default defineComponent({
   gap: 1em;
 }
 
-hr {
-  height: 3px;
-  background-color: white;
-  outline: none;
-  margin: 0;
-}
-
 .generator_warning {
   background-color: $accentColor;
   padding: 0.5em;

src/components/tabs/StockListTab.vue

@@ -60,10 +60,11 @@
       </b>
 
       <span>
-        Masa: <span class="text--accent">{{ store.totalMass }}t</span> - Długość:
+        Masa: <span class="text--accent">{{ store.totalMass }}t</span> (dopuszczalna:
+        <span class="text--accent">{{ store.acceptableMass ? store.acceptableMass + 't' : '-' }}</span
+        >) - Długość:
         <span class="text--accent">{{ store.totalLength }}m</span>
-        - vMax: <span class="text--accent">{{ store.maxStockSpeed }} km/h</span> - tMax:
-        <span class="text--accent">{{ store.acceptableMass || '-' }}t</span>
+        - vMax: <span class="text--accent">{{ store.maxStockSpeed }} km/h</span>
       </span>
     </div>
 

src/styles/tab.scss

@@ -48,8 +48,6 @@
     grid-template-columns: repeat(3, 1fr);
 
     button {
-      background-color: #131313;
-
       padding: 0.5em;
       font-weight: bold;
     }
@@ -60,6 +58,13 @@
   }
 }
 
+hr {
+  height: 3px;
+  background-color: white;
+  outline: none;
+  margin: 0;
+}
+
 @media only screen and (max-width: 470px) {
   .tab_attributes {
     label {

src/utils/vehicleUtils.ts

@@ -130,7 +130,7 @@ export function acceptableMass(state: IStore) {
   // Towarowy / inny elektr.
   if (/^EU/.test(activeLocomotiveType)) return 2000;
   if (/^ET/.test(activeLocomotiveType)) return 4000;
-  if (/^EP/.test(activeLocomotiveType)) return 0;
+  if (/^EP/.test(activeLocomotiveType)) return 650;
 
   return 0;
 }