Spythere/stacjownik
1
0
Fork 0
mirror of https://github.com/Spythere/stacjownik.git synced 2026-05-03 13:28:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Dodano animację przejścia pomiędzy widokami trybów scenerii

Browse Source
This commit is contained in:
Spythere
2022-01-10 21:05:42 +01:00
parent e21be10772
commit 488c7f3f39
2 changed files with 27 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/SceneryView.vue
+26 -7
View File
@@ -29,14 +29,18 @@
<SceneryHeader :station="stationInfo" />
<div v-if="viewMode == 'info'">
<SceneryInfo :station="stationInfo" :timetableOnly="timetableOnly" />
<SceneryTimetable :station="stationInfo" :timetableOnly="timetableOnly" />
</div>
<transition name="scenery-view-anim" mode="out-in">
<div :key="viewMode">
<div v-if="viewMode == 'info'">
<SceneryInfo :station="stationInfo" :timetableOnly="timetableOnly" />
<SceneryTimetable :station="stationInfo" :timetableOnly="timetableOnly" />
</div>
<div v-else-if="viewMode == 'history'">
<SceneryHistory :name="stationInfo.name" />
</div>
<div v-else-if="viewMode == 'history'">
<SceneryHistory :name="stationInfo.name" />
</div>
</div>
</transition>
</div>
</div>
</template>
@@ -118,6 +122,21 @@ export default defineComponent({
$sceneryBgCol: #333;
.scenery-view-anim {
&-enter-from,
&-leave-to {
opacity: 0;
}
&-enter-active {
transition: all 100ms ease-out;
}
&-leave-active {
transition: all 100ms ease-out 100ms;
}
}
.scenery {
&-view {
min-height: 100%;