From cd79de89e448e383c41d4d514ee0575b1b609175 Mon Sep 17 00:00:00 2001 From: Adam Goldsmith Date: Wed, 1 Aug 2018 10:13:14 +0100 Subject: [PATCH] Move css into separate files --- src/index.css | 21 +++++++++++++++++++++ src/index.html | 24 +----------------------- src/map.css | 48 +++++++++++++++++++++++++++++++++++++++++++++++ src/map.html | 51 +------------------------------------------------- 4 files changed, 71 insertions(+), 73 deletions(-) create mode 100644 src/index.css create mode 100644 src/map.css diff --git a/src/index.css b/src/index.css new file mode 100644 index 0000000..4244149 --- /dev/null +++ b/src/index.css @@ -0,0 +1,21 @@ +table.stations { + border-collapse: collapse; +} + +table.stations td, table.stations th{ + border: 1px solid black; + padding: 2px; +} + +table.stations tr.timedOut { + background-color: red; +} + +table.stations tr.lowVoltage { + background-color: yellow; +} + +table.stations tr.neverHeard { + background-color: purple; + color: #eee; +} diff --git a/src/index.html b/src/index.html index d2c6ac2..7babecc 100644 --- a/src/index.html +++ b/src/index.html @@ -1,29 +1,7 @@ - +
diff --git a/src/map.css b/src/map.css new file mode 100644 index 0000000..1eea6b0 --- /dev/null +++ b/src/map.css @@ -0,0 +1,48 @@ +html, body { + height: 100%; + margin: 0; +} +.map { + height: 100%; + width: 100%; +} +.ol-control.layer-toggles { + top: 0.5em; + right: 0.5em; + background-color: rgba(70, 115, 164, 0.7); + color: #eee; + white-space: nowrap; + max-height: calc(100vh - 1em); + overflow-y: auto; +} +.layer-toggles > div { + margin: 0.5em; + margin-right: 1em; +} +.ol-control.layer-toggles:hover { + background-color: rgba(0,60,136,0.7); +} +.layer-toggles > div > label { + display: block; +} +.expand { + display: none; +} +.expand + span::before { + content: '\25B6'; +} +.expand:checked + span::before { + content: '\25BC'; +} +.expand ~ .collapsible-content { + display: none; +} +.expand:checked ~ .collapsible-content { + display: block; +} +.collapsible-content { + margin-left: 0.8em; +} +.collapsible-content label { + display: block; +} diff --git a/src/map.html b/src/map.html index faaf7f0..83f10f7 100644 --- a/src/map.html +++ b/src/map.html @@ -1,56 +1,7 @@ - + OpenLayers example