chore: changed layout of journal timetable badges

This commit is contained in:
2025-02-04 14:12:47 +01:00
parent 4da0ab475b
commit 0af49befc6
2 changed files with 47 additions and 41 deletions
@@ -24,44 +24,20 @@
<div class="g-separator"></div>
<div class="stock-specs">
<span class="badge" v-if="timetable.authorName">
<span class="badge specs-badge" v-if="timetable.authorName">
<span>{{ $t('journal.dispatcher-name') }}</span>
<span>{{ timetable.authorName }}</span>
</span>
<span class="badge" v-if="timetable.stockLength">
<span>{{ $t('journal.stock-length') }}</span>
<span>
{{
currentHistoryIndex == 0
? timetable.stockLength
: stockHistory[currentHistoryIndex].stockLength || timetable.stockLength
}}m
</span>
</span>
<span class="badge" v-if="timetable.stockMass">
<span>{{ $t('journal.stock-mass') }}</span>
<span>
{{
Math.floor(
(currentHistoryIndex == 0
? timetable.stockMass
: stockHistory[currentHistoryIndex].stockMass || timetable.stockMass) / 1000
)
}}t
</span>
</span>
<span class="badge" v-if="timetable.maxSpeed">
<span>{{ $t('journal.stock-max-speed') }}</span>
<span>{{ timetable.maxSpeed }}km/h</span>
</span>
<span class="badge" v-if="timetable.trainMaxSpeed">
<span class="badge specs-badge" v-if="timetable.trainMaxSpeed">
<span>{{ $t('journal.stock-timetable-speed') }}</span>
<span> {{ timetable.trainMaxSpeed }}km/h </span>
</span>
<span class="badge specs-badge" v-if="timetable.maxSpeed">
<span>{{ $t('journal.stock-max-speed') }}</span>
<span>{{ timetable.maxSpeed }}km/h</span>
</span>
</div>
<div class="stock-dangers" v-if="timetable.warningNotes">
@@ -98,8 +74,35 @@
<!-- Historia zmian w składzie -->
<div v-if="timetable.stockString || stockHistory.length != 0">
<div class="g-separator"></div>
<b>{{ $t('journal.stock-preview') }}:</b>
<div class="stock-specs" style="margin-top: 0.5em">
<span class="badge specs-badge" v-if="timetable.stockLength">
<span>{{ $t('journal.stock-length') }}</span>
<span>
{{
currentHistoryIndex == 0
? timetable.stockLength
: stockHistory[currentHistoryIndex].stockLength || timetable.stockLength
}}m
</span>
</span>
<span class="badge specs-badge" v-if="timetable.stockMass">
<span>{{ $t('journal.stock-mass') }}</span>
<span>
{{
Math.floor(
(currentHistoryIndex == 0
? timetable.stockMass
: stockHistory[currentHistoryIndex].stockMass || timetable.stockMass) / 1000
)
}}t
</span>
</span>
</div>
<div class="stock-history">
<button class="btn btn--action" @click="copyStockToClipboard()">
<i class="fa-regular fa-copy"></i> {{ $t('journal.stock-copy') }}
@@ -255,14 +258,21 @@ export default defineComponent({
display: flex;
flex-wrap: wrap;
gap: 0.5em;
}
.badge {
margin: 0;
.specs-badge {
margin: 0;
span:last-child {
color: black;
background-color: $accentCol;
}
span:first-child {
color: white;
background-color: #666;
border-radius: 0.25em 0 0 0.25em;
}
span:last-child {
color: black;
background-color: $accentCol;
border-radius: 0 0.25em 0.25em 0;
}
}
-4
View File
@@ -144,10 +144,6 @@
{{ stockSpeedLimit }} km/h
</em>
</span>
<span v-if="train.timetableData?.trainMaxSpeed"
>&bull; vRJ: {{ train.timetableData.trainMaxSpeed }} km/h</span
>
</div>
</div>