diff options
| -rw-r--r-- | sass/src/common/local.scss | 24 | ||||
| -rw-r--r-- | templates/_departures_hafas.html.ep | 22 | ||||
| -rw-r--r-- | templates/_departures_iris.html.ep | 24 |
3 files changed, 44 insertions, 26 deletions
diff --git a/sass/src/common/local.scss b/sass/src/common/local.scss index 71f9e81..3008c54 100644 --- a/sass/src/common/local.scss +++ b/sass/src/common/local.scss @@ -71,7 +71,7 @@ ul.suggestions { .departures li { transition: background .3s; display: grid; - grid-template-columns: 10ch 11ch 1fr; + grid-template-columns: 10ch 10ch 1fr; align-items: center; &:hover { background-color: $departures-highlight-color; @@ -84,11 +84,11 @@ ul.suggestions { border: 1px solid; color: $off-black; } - .dep-dest::before { - content: "Fahrt nach"; + .dep-time::after { + content: " ⊖"; } - .dep-dest::after { - content: "entfällt"; + } +} } } } @@ -107,8 +107,12 @@ ul.suggestions { font-weight: bold; } } - - +.departures .dep-time { + color: $off-black; +} +.departures .dep-dest { + margin-left: 0.8rem; +} .departures .dep-line { text-align: center; padding: .2rem; @@ -118,8 +122,10 @@ ul.suggestions { display: inline-block; font-weight: 600; line-height: 1; - margin-right: 0.8rem; height: fit-content; + width: fit-content; + min-width: 6ch; + margin: 0 auto; &.Bus, &.RUF, &.AST { background-color: #a3167e; @@ -176,8 +182,8 @@ ul.suggestions { @media screen and (max-width: 600px) { .departures li { - grid-template-columns: 11ch 1fr; .dep-line, .dep-time { + grid-template-columns: 10ch 1fr; grid-column: 1; margin-right: 0.8rem; text-align: center; diff --git a/templates/_departures_hafas.html.ep b/templates/_departures_hafas.html.ep index 58bdb02..a10594e 100644 --- a/templates/_departures_hafas.html.ep +++ b/templates/_departures_hafas.html.ep @@ -22,7 +22,7 @@ data-train="<%= $result->id %>" data-ts="<%= ($result->sched_datetime // $result->datetime)->epoch %>" > - <span class="dep-time"> + <a class="dep-time" href="#"> %= $result->datetime->strftime('%H:%M') % if ($result->delay) { (<%= sprintf('%+d', $result->delay) %>) @@ -30,18 +30,24 @@ % elsif (not defined $result->delay and not $result->is_cancelled) { <i class="material-icons" aria-label="Keine Echtzeitdaten vorhanden" style="font-size: 16px;">gps_off</i> % } - </span> - <a class="dep-line <%= (split(/ /, $result->line))[0] %>"> - %= $result->line - </a> - <span class="dep-dest"> + </a> + <span class="dep-line <%= (split(/ /, $result->line))[0] %>"> + %= $result->line + </span> + <span class="dep-dest"> + % if ($result->is_cancelled) { + Fahrt nach <%= $result->destination %> entfällt + % } + % else { %= $result->destination % for my $checkin (@{$checkin_by_train->{$result->id} // []}) { <span class="followee-checkin"> - <i class="material-icons tiny">people</i> <%= $checkin->{followee_name} %> → <%= $checkin->{arr_name} // '???' %> + <i class="material-icons tiny">people</i> + <%= $checkin->{followee_name} %> → <%= $checkin->{arr_name} // '???' %> </span> % } - </span> + % } + </span> </li> % } </ul> diff --git a/templates/_departures_iris.html.ep b/templates/_departures_iris.html.ep index 2c47016..332ef1c 100644 --- a/templates/_departures_iris.html.ep +++ b/templates/_departures_iris.html.ep @@ -22,7 +22,7 @@ data-train="<%= $result->train_id %>" data-ts="<%= ($result->sched_departure // $result->departure)->epoch %>" > - <span class="dep-time"> + <a class="dep-time" href="#"> % if ($result->departure_hidden) { (<%= $result->departure->strftime('%H:%M') %>) % } @@ -35,16 +35,22 @@ % elsif (not $result->has_realtime and $result->start->epoch < $now_epoch) { <i class="material-icons" aria-label="Keine Echtzeitdaten vorhanden" style="font-size: 16px;">gps_off</i> % } - </span> - <a class="dep-line <%= (split(/ /, $result->line))[0] %>"> - %= $result->line </a> + <span class="dep-line <%= (split(/ /, $result->line))[0] %>"> + %= $result->line + </span> <span class="dep-dest"> - %= $result->destination - % for my $checkin (@{$checkin_by_train->{$result->train_id} // []}) { - <span class="followee-checkin"> - <i class="material-icons tiny">people</i> <%= $checkin->{followee_name} %> → <%= $checkin->{arr_name} // '???' %> - </span> + % if ($result->is_cancelled) { + Fahrt nach <%= $result->destination %> entfällt + % } + % else { + %= $result->destination + % for my $checkin (@{$checkin_by_train->{$result->train_id} // []}) { + <span class="followee-checkin"> + <i class="material-icons tiny">people</i> + <%= $checkin->{followee_name} %> → <%= $checkin->{arr_name} // '???' %> + </span> + % } % } </span> </li> |