From b45f27f83158c118ef3d319f1512c543f6016bd3 Mon Sep 17 00:00:00 2001 From: unknown Date: Thu, 31 Dec 2020 22:37:17 +0100 Subject: [PATCH] add first draft of replay page layout --- static/replayStyle.css | 56 +++++++++++++++++++++++++++++++++++++++ static/scripts/chart.js | 3 ++- templates/index.html | 3 +-- templates/replayFull.html | 34 ++++++++++++++++++++++++ 4 files changed, 93 insertions(+), 3 deletions(-) create mode 100644 static/replayStyle.css create mode 100644 templates/replayFull.html diff --git a/static/replayStyle.css b/static/replayStyle.css new file mode 100644 index 0000000..e70dd40 --- /dev/null +++ b/static/replayStyle.css @@ -0,0 +1,56 @@ +body { margin: 0; padding: 0; } +#map { position: absolute; top: 0; bottom: 0; width: 100%; } + +.legend { + background-color: #fff; + border-radius: 3px; + bottom: 30px; + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); + font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif; + padding: 10px; + position: absolute; + right: 10px; + z-index: 1; +} + +.legend h4 { + margin: 0 0 10px; +} + +.legend div span { + border-radius: 50%; + display: inline-block; + height: 10px; + margin-right: 5px; + width: 10px; +} + +body{margin:0; padding:0; font-size:13px; font-family:Georgia, "Times New Roman", Times, serif; color:#919191; background-color:#232323;} + +.float-child { + width: 45%; + float: left; + padding: 10px; +} + +canvas { + position: absolute; +} + +.sceneMap { + width: 1000px; + height: 500px; + border: 0px solid #CCC; + margin: 20px; + perspective: 400px; +} + +.scene { + width: 200px; + height: 200px; + border: 0px solid #CCC; + margin: 70px; + perspective: 400px; +} + +label { margin-right: 10px; } diff --git a/static/scripts/chart.js b/static/scripts/chart.js index 594b6d9..250d5d9 100644 --- a/static/scripts/chart.js +++ b/static/scripts/chart.js @@ -5,9 +5,10 @@ var myChart = new Chart(ctx, { labels: new Array(GRAPH_RES), datasets: [{ label: 'Z', - backgroundColor: 'rgba(255, 99, 132, 0.2)', + backgroundColor: 'rgba(255, 99, 132, 1)', borderColor: 'rgba(255, 99, 132, 1)', borderWidth: 1, + fill: false, pointRadius: 0, lineTension: 0.5, data: new Array(GRAPH_RES) diff --git a/templates/index.html b/templates/index.html index f4bd499..43dbcf1 100644 --- a/templates/index.html +++ b/templates/index.html @@ -30,8 +30,7 @@ - - +

diff --git a/templates/replayFull.html b/templates/replayFull.html new file mode 100644 index 0000000..f4edae9 --- /dev/null +++ b/templates/replayFull.html @@ -0,0 +1,34 @@ + + + + + + + + + + + + + +
+
+
+
+
+

Legende

+
Ublox
+
Smartphone
+
+
+
+ +
+
+
+ + + + + +