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

Przywrócono uwagi eksplatacyjne

Browse Source
This commit is contained in:
Spythere
2022-01-13 20:08:06 +01:00
parent 8acc88a2ff
commit a04d23a52f
5 changed files with 89 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/icon-warning.svg
+3 -3
View File
@@ -1,4 +1,4 @@
<svg width="160" height="145" viewBox="0 0 160 145" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M80 0L160 145H80H0L80 0Z" fill="#F2E147"/>
<path d="M86.08 54.4465V84.3335C86.08 87.5033 85.9233 90.6209 85.6098 93.6862C85.2963 96.7167 84.8783 99.9388 84.3558 103.352H75.63C75.1075 99.9388 74.6895 96.7167 74.376 93.6862C74.0625 90.6209 73.9058 87.5033 73.9058 84.3335V54.4465H86.08ZM71.9203 122.894C71.9203 121.814 72.1118 120.787 72.495 119.811C72.913 118.836 73.4703 118 74.167 117.303C74.8985 116.607 75.7519 116.049 76.7273 115.631C77.7026 115.213 78.7476 115.004 79.8623 115.004C80.9421 115.004 81.9697 115.213 82.945 115.631C83.9203 116.049 84.7563 116.607 85.453 117.303C86.1497 118 86.707 118.836 87.125 119.811C87.543 120.787 87.752 121.814 87.752 122.894C87.752 124.009 87.543 125.054 87.125 126.029C86.707 126.969 86.1497 127.788 85.453 128.485C84.7563 129.181 83.9203 129.721 82.945 130.105C81.9697 130.523 80.9421 130.732 79.8623 130.732C78.7476 130.732 77.7026 130.523 76.7273 130.105C75.7519 129.721 74.8985 129.181 74.167 128.485C73.4703 127.788 72.913 126.969 72.495 126.029C72.1118 125.054 71.9203 124.009 71.9203 122.894Z" fill="black"/>
<svg width="160" height="150" viewBox="0 0 160 150" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.163 139L80 12.4204L149.837 139H80H10.163Z" stroke="white" stroke-width="12"/>
<path d="M85.4488 50.3354V80.6619C85.4488 83.8784 85.2898 87.0418 84.9717 90.1522C84.6536 93.2273 84.2294 96.4968 83.6992 99.9606H74.8451C74.315 96.4968 73.8908 93.2273 73.5727 90.1522C73.2546 87.0418 73.0955 83.8784 73.0955 80.6619V50.3354H85.4488ZM71.0808 119.789C71.0808 118.694 71.2752 117.651 71.664 116.661C72.0882 115.672 72.6537 114.823 73.3606 114.117C74.1029 113.41 74.9689 112.844 75.9585 112.42C76.9482 111.996 78.0086 111.784 79.1396 111.784C80.2354 111.784 81.278 111.996 82.2677 112.42C83.2574 112.844 84.1057 113.41 84.8126 114.117C85.5195 114.823 86.085 115.672 86.5092 116.661C86.9333 117.651 87.1454 118.694 87.1454 119.789C87.1454 120.921 86.9333 121.981 86.5092 122.971C86.085 123.925 85.5195 124.756 84.8126 125.462C84.1057 126.169 83.2574 126.717 82.2677 127.106C81.278 127.53 80.2354 127.742 79.1396 127.742C78.0086 127.742 76.9482 127.53 75.9585 127.106C74.9689 126.717 74.1029 126.169 73.3606 125.462C72.6537 124.756 72.0882 123.925 71.664 122.971C71.2752 121.981 71.0808 120.921 71.0808 119.789Z" fill="#FFFBFB"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

src/components/TrainsView/TrainSchedule.vue
+77 -66
View File
@@ -16,8 +16,12 @@
<span class="stop-name">
<span v-html="stop.stopName"></span>
<img v-if="stop.comments" :src="icons.warning" :title="stop.comments">
<!-- {{ decodeURIComponent(stop.comments) }} -->
<span class="g-tooltip" v-if="stop.comments">
<img :src="icons.warning" />
<span class="content" v-html="stop.comments">
</span>
</span>
<span v-html="stop.comments"></span>
</span>
@@ -65,7 +69,6 @@
</span>
</span>
<div class="stop_line" v-if="i < followingStops.length - 1">
<div class="progress-bar"></div>
@@ -87,7 +90,7 @@
<script lang="ts">
import TrainStop from '@/scripts/interfaces/TrainStop';
import { computed, defineComponent } from '@vue/runtime-core';
import decodedChars from "@/data/decodedChars.json";
import decodedChars from '@/data/decodedChars.json';
export default defineComponent({
props: {
@@ -101,8 +104,8 @@ export default defineComponent({
data: () => ({
icons: {
warning: require("@/assets/icon-warning.svg")
}
warning: require('@/assets/icon-warning.svg'),
},
}),
setup(props) {
@@ -150,9 +153,9 @@ export default defineComponent({
},
decodeSWDRComment(comment: string) {
const test = 'kurw&#x119;a&#x119;'
const charsToDecode = test.split('&#x');
}
const test = 'kurw&#x119;a&#x119;';
const charsToDecode = test.split('&#x');
},
},
});
</script>
@@ -181,9 +184,13 @@ $stopNameClr: #22a8d1;
.train-schedule {
max-height: 600px;
margin-top: 2em;
padding-top: 1em;
margin-top: 1em;
overflow-y: auto;
z-index: 5;
}
.schedule-wrapper {
@@ -203,6 +210,66 @@ $stopNameClr: #22a8d1;
background-color: $barClr;
}
.stop-name {
background: $stopNameClr;
padding: 0.3em 0.5em;
display: flex;
align-items: center;
.g-tooltip > .content {
font-size: 0.9em;
}
img {
width: 1em;
margin-left: 0.5em;
}
}
.stop-date {
display: flex;
align-items: center;
.date {
background: $dateClr;
padding: 0.3em 0.5em;
}
.stop {
&.ph,
&.ph-pm,
&.pm {
background: $stopExchangeClr;
}
background: $stopDefaultClr;
}
.arrival,
.departure {
&.delayed {
s {
color: #999;
}
span {
color: $delayedClr;
}
}
&.preponed {
s {
color: #999;
}
span {
color: $preponedClr;
}
}
}
}
ul.stop_list > li.stop {
position: relative;
@@ -347,61 +414,5 @@ ul.stop_list > li.stop {
border: 3px solid $barClr;
border-radius: 100%;
}
.stop-name {
background: $stopNameClr;
padding: 0.3em 0.5em;
display: flex;
align-items: center;
img {
width: 1em;
margin-left: 0.5em;
}
}
.stop-date {
display: flex;
align-items: center;
.date {
background: $dateClr;
padding: 0.3em 0.5em;
}
.stop {
&.ph,
&.ph-pm,
&.pm {
background: $stopExchangeClr;
}
background: $stopDefaultClr;
}
.arrival,
.departure {
&.delayed {
s {
color: #999;
}
span {
color: $delayedClr;
}
}
&.preponed {
s {
color: #999;
}
span {
color: $preponedClr;
}
}
}
}
}
</style>
src/components/TrainsView/TrainTable.vue
+4 -3
View File
@@ -101,7 +101,7 @@
{{ train.locoType }}
</span>
</div>
<span class="driver-loco">
<div class="driver-cars">
<span v-if="train.cars.length > 0">
@@ -300,7 +300,7 @@ export default defineComponent({
behavior: 'smooth',
block: 'center',
});
}, 150);
}, 200);
},
onImageError(e: Event) {
@@ -433,6 +433,7 @@ img.train-image {
.info {
display: flex;
flex-direction: column;
justify-content: space-between;
& .timetable {
&_hero {
@@ -493,7 +494,7 @@ img.train-image {
&_comments {
img {
width: 2em;
width: 1.75em;
}
}
}
src/store/index.ts
+1 -1
View File
@@ -475,7 +475,7 @@ export const store = createStore<State>({
});
state.trainList = state.trainList.reduce((acc, train) => {
const timetableData = timetableList.find(data => data && data.trainNo === train.trainNo);
const timetableData = timetableList.find(data => data && data.trainNo === train.trainNo && data.driverId === train.driverId);
const trainStopData = state.stationList
.find(station => station.name === train.currentStationName)
src/styles/global.scss
+4 -5
View File
@@ -50,7 +50,7 @@ body {
.g-tooltip {
position: relative;
z-index: 10;
z-index: 100;
.content {
position: absolute;
@@ -59,13 +59,12 @@ body {
transform: translate(-50%, -120%);
z-index: 10;
visibility: hidden;
opacity: 0;
min-width: 150px;
min-width: 250px;
background-color: var(--clr-accent);
background-color: gray;
text-align: center;
padding: 0.15em;
@@ -81,7 +80,7 @@ body {
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: var(--clr-accent) transparent transparent transparent;
border-color: gray transparent transparent transparent;
}
@include smallScreen() {