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

Poprawki

Browse Source
This commit is contained in:
Spythere
2021-07-09 14:18:18 +02:00
parent 4a4f448fd4
commit 383c2873b6
1 changed files with 41 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/TrainsView/TrainSchedule.vue
+41 -21
View File
@@ -5,6 +5,7 @@
<li <li
v-for="(stop, i) in followingStops" v-for="(stop, i) in followingStops"
:key="i" :key="i"
class="stop"
:class="addClasses(stop, i)" :class="addClasses(stop, i)"
> >
<span class="stop_info"> <span class="stop_info">
@@ -70,20 +71,18 @@
</span> </span>
</span> </span>
<div class="stop_line"> <div class="stop_line" v-if="i < followingStops.length - 1">
<div class="progress-bar"></div> <div class="progress-bar"></div>
<span v-if="i < followingStops.length - 1"> <span
<span v-if="stop.departureLine == followingStops[i + 1].arrivalLine"
v-if="stop.departureLine == followingStops[i + 1].arrivalLine" >
> {{ stop.departureLine }}
{{ stop.departureLine }} </span>
</span>
<span v-else> <span v-else>
{{ stop.departureLine }} / {{ stop.departureLine }} /
{{ followingStops[i + 1].arrivalLine }} {{ followingStops[i + 1].arrivalLine }}
</span>
</span> </span>
</div> </div>
</li> </li>
@@ -155,12 +154,15 @@ export default defineComponent({
return { return {
confirmed: stop.confirmed, confirmed: stop.confirmed,
stopped: stop.stopped, stopped: stop.stopped,
beginning: stop.beginsHere, begin: stop.beginsHere,
end: stop.terminatesHere,
delayed: stop.departureDelay > 0, delayed: stop.departureDelay > 0,
[stop.stopType.replaceAll(", ", "-")]: [stop.stopType.replaceAll(", ", "-")]:
stop.stopType.match(new RegExp("ph|pm|pt")) && !stop.confirmed, stop.stopType.match(new RegExp("ph|pm|pt")) &&
!stop.confirmed &&
!stop.beginsHere,
"minor-stop-active": this.activeMinorStops.includes(index), "minor-stop-active": this.activeMinorStops.includes(index),
"last-confirmed": index == this.lastConfirmed, "last-confirmed": index == this.lastConfirmed && !stop.terminatesHere,
}; };
}, },
}, },
@@ -168,9 +170,9 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
$barClr: #d4d4d4; $barClr: #b1b1b1;
$confirmedClr: #18d818; $confirmedClr: #18d818;
$stoppedClr: #ff4500; $stoppedClr: #f55f31;
$haltClr: #48c5eb; $haltClr: #48c5eb;
$preponedClr: #008b00; $preponedClr: #008b00;
@@ -217,7 +219,7 @@ $stopNameClr: #22a8d1;
background-color: $barClr; background-color: $barClr;
} }
ul.stop_list > li { ul.stop_list > li.stop {
position: relative; position: relative;
display: flex; display: flex;
@@ -226,13 +228,33 @@ ul.stop_list > li {
padding: 0 0.5em; padding: 0 0.5em;
&[class*="ph"] > .stop_info > .indicator { &[class*="ph"] > .stop_info > .indicator {
border-color: $stopExchangeClr; border-color: $stopNameClr;
} }
&[class*="pt"] > .stop_info > .indicator { &[class*="pt"] > .stop_info > .indicator {
border-color: #818181; border-color: #818181;
} }
&.begin {
.stop_info > .indicator {
border-color: lightgreen;
}
.stop_info > .progress-bar {
background: lightgreen;
}
}
&.end {
.stop_info > .indicator {
border-color: salmon;
}
.stop_info > .progress-bar {
background: salmon;
}
}
&.minor-stop-active { &.minor-stop-active {
.stop_info > .progress-bar { .stop_info > .progress-bar {
animation: 0.5s ease-in-out alternate infinite blink; animation: 0.5s ease-in-out alternate infinite blink;
@@ -303,9 +325,7 @@ ul.stop_list > li {
.stop-bar { .stop-bar {
position: absolute; position: absolute;
top: 0; top: 0;
left: -1rem; left: -17px;
transform: translate(-1px, -1px);
z-index: 10; z-index: 10;