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

fix: table border alignment

Browse Source
This commit is contained in:
Spythere
2025-07-06 15:21:45 +02:00
parent 812c34ae31
commit 022e937a17
1 changed files with 20 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Timetable/TimetableContent.vue
+20 -24
View File
@@ -15,8 +15,8 @@
<th width="100" class="border border-black dark:border-white"> <th width="100" class="border border-black dark:border-white">
{{ $t('headers.line_km') }} {{ $t('headers.line_km') }}
</th> </th>
<th width="35" class="border border-black dark:border-white">V<sub>P</sub></th> <th width="40" class="border border-black dark:border-white">V<sub>P</sub></th>
<th width="35" class="border border-black dark:border-white">V<sub>L</sub></th> <th width="40" class="border border-black dark:border-white">V<sub>L</sub></th>
<th width="200" class="border border-black dark:border-white"> <th width="200" class="border border-black dark:border-white">
{{ $t('headers.station') }} {{ $t('headers.station') }}
</th> </th>
@@ -76,33 +76,29 @@
<!-- Km --> <!-- Km -->
<td <td
class="border border-black dark:border-white border-t-1 border-b-1 relative p-0" class="border border-black dark:border-white border-t-0 border-b-1 relative p-0"
:class="{ :class="{
'border-t-0':
row.lastRowRef == null ||
(row.lastRowRef.departureSpeedL == row.arrivalSpeedL &&
row.lastRowRef.departureSpeedP == row.arrivalSpeedP &&
row.lastRowRef.departureTracks == row.arrivalTracks &&
row.lastRowRef.realLine == row.realLine),
'border-b-0': i != computedTimetableRows.length - 1 'border-b-0': i != computedTimetableRows.length - 1
}" }"
> >
<div class="absolute top-0 left-0 w-full h-full"> <div class="absolute -top-[0.5px] left-0 w-full h-full">
<table class="h-full w-full border-collapse"> <table class="h-full w-full border-collapse">
<tbody> <tbody>
<!-- Arrival Km --> <!-- Arrival Km -->
<tr <tr>
:class="`align-top ${ <td
row.lastRowRef == null || class="align-top border-t text-inherit"
(row.lastRowRef.departureSpeedL == row.arrivalSpeedL && :class="{
row.lastRowRef.departureSpeedP == row.arrivalSpeedP && 'border-t-0 text-transparent':
row.lastRowRef.departureTracks == row.arrivalTracks && row.lastRowRef == null ||
row.lastRowRef.realLine == row.realLine) (row.lastRowRef.departureSpeedL == row.arrivalSpeedL &&
? 'text-transparent' row.lastRowRef.departureSpeedP == row.arrivalSpeedP &&
: 'text-inherit' row.lastRowRef.departureTracks == row.arrivalTracks &&
}`" row.lastRowRef.realLine == row.realLine)
> }"
<td>{{ row.arrivalKm }}</td> >
{{ row.arrivalKm }}
</td>
</tr> </tr>
<!-- Departure Km --> <!-- Departure Km -->
@@ -128,12 +124,12 @@
<!-- Vp, Vl --> <!-- Vp, Vl -->
<td <td
class="text-center align-top p-0 border-l-black dark:border-l-white relative" class="text-center align-top p-0 border-l-black dark:border-l-white relative"
:class="{ :class="{
'border-b border-b-black dark:border-b-white': i == computedTimetableRows.length - 1 'border-b border-b-black dark:border-b-white': i == computedTimetableRows.length - 1
}" }"
colspan="2" colspan="2"
> >
<div class="absolute top-0 left-0 w-full h-full"> <div class="absolute -top-[0.5px] left-0 w-full h-full">
<table class="h-full w-full border-collapse"> <table class="h-full w-full border-collapse">
<tbody> <tbody>
<tr class="align-top"> <tr class="align-top">