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

Poprawki interfejsu

Browse Source
This commit is contained in:
Spythere
2021-06-29 17:55:22 +02:00
parent 2a23604b9c
commit 668e2027f9
7 changed files with 58 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/StationsView/StationTable.vue
+10 -23
View File
@@ -80,10 +80,8 @@
</td>
<td class="station_status">
<span
class="status-badge"
:class="station.statusID"
>{{ $t(`status.${station.statusID}`) }}
<span class="status-badge" :class="station.statusID"
>{{ $t(`status.${station.statusID}`) }}
{{
station.statusID == "online" ? station.statusTimeString : ""
}}
@@ -98,9 +96,10 @@
<span
v-if="station.online"
:style="calculateExpStyle(station.dispatcherExp)"
>{{
>{{
2 > station.dispatcherExp ? "L" : station.dispatcherExp
}}</span>
}}</span
>
</td>
<td class="station_tracks twoway">
@@ -183,10 +182,7 @@
/>
</td>
<td
class="station_users"
:class="{ inactive: !station.online }"
>
<td class="station_users" :class="{ inactive: !station.online }">
<span>
<span class="highlight">{{ station.currentUsers }}</span>
/
@@ -194,10 +190,7 @@
</span>
</td>
<td
class="station_spawns"
:class="{ inactive: !station.online }"
>
<td class="station_spawns" :class="{ inactive: !station.online }">
<span class="highlight">{{ station.spawns.length }}</span>
</td>
@@ -206,7 +199,7 @@
:class="{ inactive: !station.online }"
>
<span class="highlight">
{{ station.scheduledTrains.length }} &nbsp;
{{ station.scheduledTrains.length }}
</span>
/
<span style="color: #bbb">{{
@@ -220,17 +213,11 @@
</table>
</div>
<div
class="no-stations"
v-if="stations.length == 0 && isDataLoaded"
>
<div class="no-stations" v-if="stations.length == 0 && isDataLoaded">
{{ $t("sceneries.no-stations") }}
</div>
<div
class="no-stations"
v-else-if="!isDataLoaded"
>
<div class="no-stations" v-else-if="!isDataLoaded">
{{ $t("app.loading") }}
</div>
</section>
src/components/TrainsView/TrainTable.vue
+41 -31
View File
@@ -45,19 +45,22 @@
<div class="info_timetable" v-else>
<div class="timetable_general">
<span class="warning twr" v-if="train.timetableData.TWR">
TWR
</span>
<span class="timetable_hero">
<span class="timetable_warnings">
<span class="warning twr" v-if="train.timetableData.TWR">
TWR
</span>
<span class="warning skr" v-if="train.timetableData.SKR">
SKR
</span>
</span>
<span class="warning skr" v-if="train.timetableData.SKR">
SKR
</span>
<span>
<strong>{{ train.timetableData.category }}</strong>
{{ train.trainNo }} |
<span style="color: gold">
{{ train.timetableData.routeDistance }} km
<span>
<strong>{{ train.timetableData.category }}</strong>
{{ train.trainNo }} |
<span style="color: gold">
{{ train.timetableData.routeDistance }} km
</span>
</span>
</span>
@@ -423,6 +426,10 @@ img.train-image {
.info {
.timetable {
&_hero {
display: flex;
}
&_general {
display: flex;
justify-content: space-between;
@@ -441,6 +448,8 @@ img.train-image {
display: flex;
align-items: center;
font-weight: bold;
margin: 5px 0;
font-size: 1.1em;
@@ -450,6 +459,26 @@ img.train-image {
margin-bottom: 10px;
font-size: 0.7em;
}
&_warnings {
display: flex;
color: black;
.warning {
padding: 0.1em 0.65em;
margin-right: 0.35em;
font-weight: bold;
&.twr {
background: var(--clr-twr);
}
&.skr {
background: var(--clr-skr);
}
}
}
}
}
@@ -537,25 +566,6 @@ img.train-image {
}
}
.warning {
padding: 0.1em 0.8em;
margin-right: 0.5em;
display: flex;
align-items: center;
color: black;
font-weight: bold;
&.twr {
background: var(--clr-twr);
}
&.skr {
background: var(--clr-skr);
}
}
@include smallScreen() {
.info-bottom {
text-align: center;