summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorDaniel Friesel <derf@finalrewind.org>2019-12-21 23:53:49 +0100
committerDaniel Friesel <derf@finalrewind.org>2019-12-21 23:53:49 +0100
commit87a40ca57f724194d5f2f4a35731f08c3eb821d0 (patch)
treeff007202763346e7d656c53ed62c005c660ed563
parenta578f8f66613a9428617338f8270b9be21c7816b (diff)
more compact and less ugly wagon order display2.3.17
-rw-r--r--public/static/css/app.css81
-rw-r--r--public/static/css/material-icons.css8
l---------public/static/v21 (renamed from public/static/v19)0
-rw-r--r--templates/layouts/app.html.ep2
-rw-r--r--templates/layouts/legacy.html.ep2
-rw-r--r--templates/wagenreihung.html.ep34
6 files changed, 76 insertions, 51 deletions
diff --git a/public/static/css/app.css b/public/static/css/app.css
index 3e4b3bd..ef2b2e9 100644
--- a/public/static/css/app.css
+++ b/public/static/css/app.css
@@ -42,11 +42,6 @@ div.content {
text-align: center;
}
-.wagonorder .direction {
- position: absolute;
- left: 10em;
-}
-
.wagonorder .wagon {
position: absolute;
left: 3em;
@@ -60,40 +55,80 @@ div.content {
border-top: none;
}
+.wagonorder .wagon .direction {
+ position: absolute;
+ left: 0.2em;
+ bottom: 0;
+ right: 0;
+ text-align: center;
+ color: #666666;
+}
+
.wagonorder .details {
position: absolute;
- left: 11em;
+ padding-top: 0.5ex;
+ left: 10em;
right: 0em;
}
-.wagonorder .details .firstclass {
+.wagonorder .details .type {
display: inline-block;
- width: 0.8em;
- text-align: center;
- color: #ffffff;
- background-color: #666666;
- border: 1px solid #666666;
+ width: 5em;
+ color: #666666;
}
-.wagonorder .details .secondclass {
- display: inline-block;
- width: 0.8em;
- text-align: center;
+.wagonorder .details .uicunknown {
+ color: #999999;
+}
+
+.wagonorder .details .uicexchange {
+ margin-right: 0.2em;
+ color: #999999;
+}
+
+.wagonorder .details .uiccountry {
+ margin-right: 0.2em;
+ color: #999999;
+}
+
+.wagonorder .details .uic5 {
+ margin-right: 0.2em;
+ color: #999999;
+}
+
+.wagonorder .details .uic56 {
color: #666666;
- border: 1px solid #666666;
+ font-weight: bold;
}
-.wagonorder .details .noclass {
- display: inline-block;
- width: 0.8em;
+.wagonorder .details .uic78 {
+ margin-right: 0.2em;
+ color: #666666;
+ font-weight: bold;
}
-.wagonorder .details .type {
- display: inline-block;
- width: 5em;
+.wagonorder .details .uic78::before {
+ content: "-";
+}
+
+.wagonorder .details .uictype {
+ margin-right: 0.2em;
+ color: #666666;
+ font-weight: bold;
+}
+
+.wagonorder .details .uicno {
color: #666666;
}
+.wagonorder .details .uiccheck {
+ color: #999999;
+}
+
+.wagonorder .details .uiccheck::before {
+ content: "-";
+}
+
div.app {
border-width:1px 2px;
width:100%;
diff --git a/public/static/css/material-icons.css b/public/static/css/material-icons.css
index a85e909..be41671 100644
--- a/public/static/css/material-icons.css
+++ b/public/static/css/material-icons.css
@@ -2,12 +2,12 @@
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
- src: url(/static/v20/fonts/MaterialIcons-Regular.eot); /* For IE6-8 */
+ src: url(/static/v21/fonts/MaterialIcons-Regular.eot); /* For IE6-8 */
src: local('Material Icons'),
local('MaterialIcons-Regular'),
- url(/static/v20/fonts/MaterialIcons-Regular.woff2) format('woff2'),
- url(/static/v20/fonts/MaterialIcons-Regular.woff) format('woff'),
- url(/static/v20/fonts/MaterialIcons-Regular.ttf) format('truetype');
+ url(/static/v21/fonts/MaterialIcons-Regular.woff2) format('woff2'),
+ url(/static/v21/fonts/MaterialIcons-Regular.woff) format('woff'),
+ url(/static/v21/fonts/MaterialIcons-Regular.ttf) format('truetype');
}
.material-icons {
diff --git a/public/static/v19 b/public/static/v21
index 945c9b4..945c9b4 120000
--- a/public/static/v19
+++ b/public/static/v21
diff --git a/templates/layouts/app.html.ep b/templates/layouts/app.html.ep
index 5a36685..2b2bf79 100644
--- a/templates/layouts/app.html.ep
+++ b/templates/layouts/app.html.ep
@@ -18,7 +18,7 @@
<meta http-equiv="refresh" content="<%= $self->stash('refresh_interval') %>"/>
% }
- % my $av = 'v20'; # asset version
+ % my $av = 'v21'; # asset version
%= stylesheet "/static/${av}/css/app.css"
%= stylesheet "/static/${av}/css/material-icons.css"
%= stylesheet "/static/${av}/css/jquery-ui.min.css"
diff --git a/templates/layouts/legacy.html.ep b/templates/layouts/legacy.html.ep
index 8b96c8f..e74d2e5 100644
--- a/templates/layouts/legacy.html.ep
+++ b/templates/layouts/legacy.html.ep
@@ -17,7 +17,7 @@
<meta http-equiv="refresh" content="<%= $self->stash('refresh_interval') %>"/>
% }
- % my $av = 'v20'; # asset version
+ % my $av = 'v21'; # asset version
%= stylesheet "/static/${av}/css/default.css"
%= stylesheet "/static/${av}/css/material-icons.css"
%= stylesheet "/static/${av}/css/jquery-ui.min.css"
diff --git a/templates/wagenreihung.html.ep b/templates/wagenreihung.html.ep
index b14c2dc..25a2153 100644
--- a/templates/wagenreihung.html.ep
+++ b/templates/wagenreihung.html.ep
@@ -37,17 +37,6 @@
% if ($wagon->is_locomotive or $wagon->is_powercar) {
% $bg = 'background-color: #cccccc;';
% }
- <div class="direction" style="
- top: <%= $wagon->{position}{start_percent} %>%; bottom: <%= 100 - $wagon->{position}{end_percent} %>%;">
-% if ($wr->has_bad_wagons) {
-% }
-% elsif ($wr->direction == 100) {
- ↓
-% }
-% else {
- ↑
-% }
- </div>
<div class="wagon" style="
top: <%= $wagon->{position}{start_percent} %>%; bottom: <%= 100 - $wagon->{position}{end_percent} %>%; <%= $bg %>">
% if ($wagon->is_locomotive or $wagon->is_powercar) {
@@ -76,30 +65,31 @@
<i class="material-icons">star</i>
% }
% }
- </div>
- <div class="details" style="
- top: <%= $wagon->{position}{start_percent} %>%; bottom: <%= 100 - $wagon->{position}{end_percent} %>%;">
-% if ($wagon->is_first_class) {
- <span class="firstclass">1</span>
+ <div class="direction">
+% if ($wr->has_bad_wagons) {
% }
-% elsif ($wagon->is_second_class) {
- <span class="secondclass">2</span>
+% elsif ($wr->direction == 100) {
+ <i class="material-icons">arrow_downward</i>
% }
% else {
- <span class="noclass"></span>
+ <i class="material-icons">arrow_upward</i>
% }
+ </div>
+ </div>
+ <div class="details" style="
+ top: <%= $wagon->{position}{start_percent} %>%; bottom: <%= 100 - $wagon->{position}{end_percent} %>%;">
<span class="type">
%= $wagon->type
</span>
% my $uic_id = $wagon->uic_id;
% if (length($uic_id) != 12) {
- <span style="color: #666666;"><%= $uic_id %></span>
+ <span class="uicunknown"><%= $uic_id %></span>
% }
% elsif ($wr->train_type eq 'ICE') {
- <span style="margin-right: 0.2em; color: #999999;"><%= substr($uic_id, 0, 2) %></span><span style="margin-right: 0.2em; color: #999999;"><%= substr($uic_id, 2, 2) %></span><span style="margin-right: 0.2em; color: #999999;"><%= substr($uic_id, 4, 1) %></span><span style="margin-right: 0.2em; font-weight: bold;"><%= substr($uic_id, 5, 3) %></span><span><%= substr($uic_id, 8, 3) %></span><span style="color: #999999;">-<%= substr($uic_id, 11) %></span>
+ <span class="uicexchange"><%= substr($uic_id, 0, 2) %></span><span class="uiccountry"><%= substr($uic_id, 2, 2) %></span><span class="uic5"><%= substr($uic_id, 4, 1) %></span><span class="uictype"><%= substr($uic_id, 5, 3) %></span><span class="uicno"><%= substr($uic_id, 8, 3) %></span><span class="uiccheck"><%= substr($uic_id, 11) %></span>
% }
% else {
- <span style="margin-right: 0.2em; color: #999999;"><%= substr($uic_id, 0, 2) %></span><span style="margin-right: 0.2em; color: #999999;"><%= substr($uic_id, 2, 2) %></span><span style="font-weight: bold;"><%= substr($uic_id, 4, 2) %></span>-<span style="margin-right: 0.2em; font-weight: bold;"><%= substr($uic_id, 6, 2) %></span><span><%= substr($uic_id, 8, 3) %></span><span style="color: #999999;">-<%= substr($uic_id, 11) %></span>
+ <span class="uicexchange"><%= substr($uic_id, 0, 2) %></span><span class="uiccountry"><%= substr($uic_id, 2, 2) %></span><span class="uic56"><%= substr($uic_id, 4, 2) %></span><span class="uic78"><%= substr($uic_id, 6, 2) %></span><span class="uicno"><%= substr($uic_id, 8, 3) %></span><span class="uiccheck"><%= substr($uic_id, 11) %></span>
% }
</div>
% }