Aktualizacja listy scenerii. Animacja dodawania RJ

src/data/stations.json

@@ -2078,5 +2078,28 @@
     },
     "default": false,
     "nonPublic": false
+  },
+   {
+     "stationName": "Niedoradz",
+    "stationURL": "https://td2.info.pl/scenerie/niedoradz",
+    "stationLines": "",
+    "reqLevel": "0",
+    "supportersOnly": "NIE",
+    "signalType": "współczesna",
+    "controlType": "SPK",
+    "SBL": "",
+    "twoWayBlock": "",
+    "routes": {
+      "oneWay": {
+        "catenary": 0,
+        "noCatenary": 0
+      },
+      "twoWay": {
+        "catenary": 2,
+        "noCatenary": 0
+      }
+    },
+    "default": false,
+    "nonPublic": false
   }
 ]

src/views/SceneryView.vue

@@ -200,7 +200,12 @@
           v-else-if="computedScheduledTrains.length == 0"
         >Brak aktywnych rozkładów!</span>
 
-        <div class="timetable-item" v-for="(scheduledTrain, i) in computedScheduledTrains" :key="i">
+        <transition-group name="list-anim">
+          <div
+            class="timetable-item"
+            v-for="(scheduledTrain, i) in computedScheduledTrains"
+            :key="i"
+          >
             <span class="timetable-general">
               <span class="general-info">
                 <router-link
@@ -268,6 +273,7 @@
               </span>
             </span>
           </div>
+        </transition-group>
       </div>
     </div>
   </div>
@@ -408,6 +414,17 @@ export default class SceneryView extends styleMixin {
 @import "../styles/variables.scss";
 @import "../styles/user_badge.scss";
 
+.list-anim {
+  &-enter-active,
+  &-leave-active {
+    transition: all 250ms ease-out;
+  }
+  &-enter, &-leave-to /* .list-leave-active below version 2.1.8 */ {
+    opacity: 0;
+    transform: scale(0.95);
+  }
+}
+
 h3 {
   margin: 0.5em 0;
   padding: 0.3em;