From 4a66e7d9703e709769ce7cbfe3bd3ec0a765e621 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 15:03:34 +0200 Subject: [PATCH 01/17] add favicon --- favicon-32x32.png | Bin 0 -> 722 bytes index.html | 1 + server.py | 4 ++++ 3 files changed, 5 insertions(+) create mode 100644 favicon-32x32.png diff --git a/favicon-32x32.png b/favicon-32x32.png new file mode 100644 index 0000000000000000000000000000000000000000..5fa1f66579e15c58685a89a85c39b77c0d5f4012 GIT binary patch literal 722 zcmV;@0xkWCP)u0oyQ$urx!rYUJY}88PP)3fyS}fhYo@Ct@V7Y} zj;~g$^~vpa+jTnK7e@b?{bI3rZnxY0;c)n)-|zoqZ9ARLZ}ob8`&*>eY&N%uNeI~O z_An|$!e(Lc!02^~cKf5p<9T4+A(G(p`5y4fDX-US7YXwO2IGy=Xf!toxDzxE1qM6C zp%+ypJBQZoc44>M0YyuD z$Y!%Z-y0#2$z-5XsSv}lSPW9B6!F4*K8IW`2lS^+h^GV5r7Kul|yGIYH)oPedr#!1( z)q+%;3^N`qcj?g*pHD;Hd*;nLGVY!Wei`)VzKy+K&e!MU@!=QKmg2UGuJj=-9-cn zg#siJiIWFrGMPX!nFOg+3bk78Y!2|2%|!(8ZNSs=HB4I0B_JR7UPJ(sk+;w8M`PEF zuL{CzfcW-M%jNQ!Z}Qf9EY&DFb?V<5h|fOOiPU&J{@!RbUicQ>O5bX=Ua&|d_OVbD zvp&SSkSR_j%n7kb#X1p7wOdt77;kvx==EN&_Y1NA0D$T%A0I~r0RR9107*qoM6N<$ Ef&+>`+yDRo literal 0 HcmV?d00001 diff --git a/index.html b/index.html index d09521b46e..93d8b68934 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,7 @@ Electricity Map | Real-time visualisation of the climate footprint of electricity generation + diff --git a/server.py b/server.py index fde890d74a..880dbcb585 100644 --- a/server.py +++ b/server.py @@ -103,6 +103,10 @@ def index_GET(): def style_GET(): return flask.send_from_directory('', 'style.css') +@app.route('/favicon-32x32.png') +def favicon_GET(): + return flask.send_from_directory('', 'favicon-32x32.png') + @app.route('/vendor/', methods=['GET', 'OPTIONS']) def vendor_GET(path): return flask.send_from_directory('vendor', path) From 086e73b297bec0f4eff5314acf7bb9f8c9c2574f Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 15:15:44 +0200 Subject: [PATCH 02/17] add headline --- index.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 93d8b68934..50ca077a73 100644 --- a/index.html +++ b/index.html @@ -1,12 +1,12 @@ - + - + - Electricity Map | Real-time visualisation of the climate footprint of electricity generation + Electricity Map | Clean vs. dirty electricity production in Europe @@ -60,6 +60,8 @@
+

Clean vs. dirty electricity production in Europe

- This is the electricity map
-
It shows, in real-time, where your electricity comes from and how much greenhouse gas (GHG) was emitted in the process.
From b10a8028778db0915b46f75940931cb26ed53c31 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 16:14:41 +0200 Subject: [PATCH 03/17] add Tomorrow watermark --- index.html | 3 +++ logo_with_tagline.svg | 17 +++++++++++++++++ server.py | 6 +++++- style.css | 11 +++++++++-- 4 files changed, 34 insertions(+), 3 deletions(-) create mode 100644 logo_with_tagline.svg diff --git a/index.html b/index.html index 50ca077a73..0664b66d35 100644 --- a/index.html +++ b/index.html @@ -89,6 +89,9 @@ > Contribute to complete the map
+
+ +
Help out with missing data by contributing on GitHub. Follow me on Twitter for the latest updates.
diff --git a/logo_with_tagline.svg b/logo_with_tagline.svg new file mode 100644 index 0000000000..f566d6074b --- /dev/null +++ b/logo_with_tagline.svg @@ -0,0 +1,17 @@ + + + + logo + Created with Sketch. + + + + + \ No newline at end of file diff --git a/server.py b/server.py index 880dbcb585..9119d4fd5d 100644 --- a/server.py +++ b/server.py @@ -105,7 +105,11 @@ def style_GET(): @app.route('/favicon-32x32.png') def favicon_GET(): - return flask.send_from_directory('', 'favicon-32x32.png') + return flask.send_from_directory('', 'favicon-32x32.png') + +@app.route('/logo_with_tagline.svg') +def logo_GET(): + return flask.send_from_directory('', 'logo_with_tagline.svg') @app.route('/vendor/', methods=['GET', 'OPTIONS']) def vendor_GET(path): diff --git a/style.css b/style.css index 56ddd95497..c31b81750d 100644 --- a/style.css +++ b/style.css @@ -6,7 +6,7 @@ html, body { } .contribute-bar { position: absolute; - left: 0px; + right: 0px; bottom: 0px; padding: 5px; background-color: rgba(70,70,70,0.7); @@ -14,6 +14,13 @@ html, body { color: darkgray; font-size: 0.6em; } +.watermark { + position: absolute; + left: 0px; + bottom: 0px; + padding: 15px; + opacity: 0.7; +} .overlay { width: 100%; height: 100%; @@ -93,7 +100,7 @@ html, body { } .legend { position: absolute; - bottom: 0px; + bottom: 10px; right: 0px; margin: 10px; font-size: 0.5em; From d87bfa6d7bb5511b4822d1535edbfb564455f34d Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 16:22:54 +0200 Subject: [PATCH 04/17] move contribute instructions to main panel --- index.html | 5 ++--- style.css | 14 ++++---------- 2 files changed, 6 insertions(+), 13 deletions(-) diff --git a/index.html b/index.html index 0664b66d35..6542e535dc 100644 --- a/index.html +++ b/index.html @@ -88,13 +88,12 @@ > Understand how GHG emissions are calculated
> Contribute to complete the map + To learn more about this project or contribute missing data head over to GitHub. +
-
- Help out with missing data by contributing on GitHub. Follow me on Twitter for the latest updates. -
diff --git a/style.css b/style.css index c31b81750d..8d767b74f8 100644 --- a/style.css +++ b/style.css @@ -4,15 +4,9 @@ html, body { height: 100%; font-family: sans-serif; } -.contribute-bar { - position: absolute; - right: 0px; - bottom: 0px; - padding: 5px; - background-color: rgba(70,70,70,0.7); - text-align: center; - color: darkgray; - font-size: 0.6em; +.contribute-text { + display: block; + margin-top: 20px; } .watermark { position: absolute; @@ -100,7 +94,7 @@ html, body { } .legend { position: absolute; - bottom: 10px; + bottom: 0px; right: 0px; margin: 10px; font-size: 0.5em; From 6c2bb7d170bf9244dd2bfc271e26ec0c8b2adc7c Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 16:39:42 +0200 Subject: [PATCH 05/17] simplify panel and initial text --- index.html | 10 +++------- style.css | 2 ++ 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 6542e535dc..9552163005 100644 --- a/index.html +++ b/index.html @@ -77,16 +77,12 @@
- It shows, in real-time, where your electricity comes from - and how much greenhouse gas (GHG) was emitted in the process.
+ The map on the right shows in real-time where your electricity comes from + and how much greenhouse gas (GHG) was emitted to produce it. The blinking arrows represent electricity imports and exports.

-    >>  click on a country to get started
-
- Going further:
- > Understand how GHG emissions are calculated
- > Contribute to complete the map + Tip: Click on a country to start exploring ⟶
To learn more about this project or contribute missing data head over to GitHub. diff --git a/style.css b/style.css index 8d767b74f8..76361e3117 100644 --- a/style.css +++ b/style.css @@ -7,6 +7,8 @@ html, body { .contribute-text { display: block; margin-top: 20px; + margin-bottom: -35px; + opacity: 0.5; } .watermark { position: absolute; From cb8b55fe28cc97e5d13f613698ab31b2aeff9ac4 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 16:40:51 +0200 Subject: [PATCH 06/17] Make watermark smaller --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 9552163005..8a83e88816 100644 --- a/index.html +++ b/index.html @@ -88,7 +88,7 @@
- +
From de854ca15c46ae3c5eefd4d74ec8e90db7a48d01 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Sun, 4 Sep 2016 16:41:17 +0200 Subject: [PATCH 07/17] fix header margin --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 8a83e88816..2e76208b88 100644 --- a/index.html +++ b/index.html @@ -61,7 +61,7 @@

Clean vs. dirty electricity production in Europe

+ border-bottom: solid grey 1px; margin-top: 5px;">Clean vs. dirty electricity production in Europe

Clean vs. dirty electricity production in Europe

+ border-bottom: solid grey 1px; margin-top: 5px;">Real-time climate impact of the European electricity production
- The map on the right shows in real-time where your electricity comes from + This map shows in real-time where your electricity comes from and how much greenhouse gas (GHG) was emitted to produce it. The blinking arrows represent electricity imports and exports.
From 2580b93094df968bb1c58f5a8446a90412bf2394 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 09:49:02 +0200 Subject: [PATCH 11/17] improve Tomrrow watermark --- index.html | 2 +- logo_with_tagline.svg | 17 ----------------- server.py | 4 ++-- style.css | 8 ++++++-- tomorrow_logo_open_source.svg | 15 +++++++++++++++ 5 files changed, 24 insertions(+), 22 deletions(-) delete mode 100644 logo_with_tagline.svg create mode 100644 tomorrow_logo_open_source.svg diff --git a/index.html b/index.html index 8a9c6d3b06..2f55876846 100644 --- a/index.html +++ b/index.html @@ -88,7 +88,7 @@
- +
diff --git a/logo_with_tagline.svg b/logo_with_tagline.svg deleted file mode 100644 index f566d6074b..0000000000 --- a/logo_with_tagline.svg +++ /dev/null @@ -1,17 +0,0 @@ - - - - logo - Created with Sketch. - - - - - \ No newline at end of file diff --git a/server.py b/server.py index 9119d4fd5d..1c4088c323 100644 --- a/server.py +++ b/server.py @@ -107,9 +107,9 @@ def style_GET(): def favicon_GET(): return flask.send_from_directory('', 'favicon-32x32.png') -@app.route('/logo_with_tagline.svg') +@app.route('/tomorrow_logo_open_source.svg') def logo_GET(): - return flask.send_from_directory('', 'logo_with_tagline.svg') + return flask.send_from_directory('', 'tomorrow_logo_open_source.svg') @app.route('/vendor/', methods=['GET', 'OPTIONS']) def vendor_GET(path): diff --git a/style.css b/style.css index 76361e3117..2f008b32b7 100644 --- a/style.css +++ b/style.css @@ -13,9 +13,13 @@ html, body { .watermark { position: absolute; left: 0px; - bottom: 0px; + bottom: 10px; padding: 15px; - opacity: 0.7; + opacity: 0.5; + transition: all 0.5s ease; +} +.watermark:hover { + opacity: 1; } .overlay { width: 100%; diff --git a/tomorrow_logo_open_source.svg b/tomorrow_logo_open_source.svg new file mode 100644 index 0000000000..abe9d6b579 --- /dev/null +++ b/tomorrow_logo_open_source.svg @@ -0,0 +1,15 @@ + + + + Group + Created with Sketch. + + + + + + + + + + \ No newline at end of file From a5b8b559846d59ebe3826e70288bf6b3d038e7e1 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 10:00:27 +0200 Subject: [PATCH 12/17] move contribute text to watermark. Which puts it in the context of Tomorrow Open-Source and also gives it more prominence because the Tomorrow logo is eye catching --- index.html | 3 ++- style.css | 8 ++++---- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 2f55876846..35a495c3e6 100644 --- a/index.html +++ b/index.html @@ -84,11 +84,12 @@
Tip: Click on a country to start exploring ⟶
- To learn more about this project or contribute missing data head over to GitHub. +
+ Help out with missing data by contributing on GitHub. Follow us on Twitter for the latest updates.
diff --git a/style.css b/style.css index 2f008b32b7..140bc8edb5 100644 --- a/style.css +++ b/style.css @@ -6,14 +6,14 @@ html, body { } .contribute-text { display: block; - margin-top: 20px; - margin-bottom: -35px; - opacity: 0.5; + color: white; + margin-top: 15px; + font-size: 9px; } .watermark { position: absolute; left: 0px; - bottom: 10px; + bottom: 5px; padding: 15px; opacity: 0.5; transition: all 0.5s ease; From a856c359902de12d143350f564db0e7b39a641d2 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 10:57:29 +0200 Subject: [PATCH 13/17] smaller headline --- index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 35a495c3e6..7d9df20f93 100644 --- a/index.html +++ b/index.html @@ -60,7 +60,7 @@
-

Real-time climate impact of the European electricity production

- Help out with missing data by contributing on GitHub. Follow us on Twitter for the latest updates. + Help out with missing data by contributing on GitHub.Follow us on Twitter for the latest updates.
From 6d1671cd212663ccd4b011fe77d33da7b56c3ce2 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 10:58:27 +0200 Subject: [PATCH 14/17] smaller watermark --- index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 7d9df20f93..c0a95da07c 100644 --- a/index.html +++ b/index.html @@ -60,7 +60,7 @@
-

Real-time climate impact of the European electricity production

- + Help out with missing data by contributing on GitHub.Follow us on Twitter for the latest updates.
From 816e5e4fe436f31ed417d013c953de08756a3471 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 11:03:42 +0200 Subject: [PATCH 15/17] revert to previous contribute-text style --- index.html | 2 +- style.css | 12 ++++++++---- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index c0a95da07c..71bac5b81e 100644 --- a/index.html +++ b/index.html @@ -89,8 +89,8 @@
- Help out with missing data by contributing on GitHub.Follow us on Twitter for the latest updates.
+ Help out with missing data by contributing on GitHub. Follow us on Twitter for the latest updates.
diff --git a/style.css b/style.css index 140bc8edb5..b0a43aef76 100644 --- a/style.css +++ b/style.css @@ -6,14 +6,18 @@ html, body { } .contribute-text { display: block; - color: white; - margin-top: 15px; - font-size: 9px; + position: absolute; + left: 0; + bottom: 0; + background-color: rgba(70, 70, 70, 0.95); + font-size: 0.6em; + color: lightgray; + padding: 3px 5px; } .watermark { position: absolute; left: 0px; - bottom: 5px; + bottom: 15px; padding: 15px; opacity: 0.5; transition: all 0.5s ease; From 467cfd8e07a62f5413190cd06fc4a6adb4436bd7 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 17:32:03 +0200 Subject: [PATCH 16/17] update logo --- tomorrow_logo_open_source.svg | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/tomorrow_logo_open_source.svg b/tomorrow_logo_open_source.svg index abe9d6b579..96173b9087 100644 --- a/tomorrow_logo_open_source.svg +++ b/tomorrow_logo_open_source.svg @@ -1,14 +1,14 @@ - + Group Created with Sketch. - - - - + + + + From 9c4347a57c64dd367b277fed0aebea6c2cad81e6 Mon Sep 17 00:00:00 2001 From: Guilherme Coelho Date: Tue, 6 Sep 2016 17:34:00 +0200 Subject: [PATCH 17/17] increase size of block + target blank --- index.html | 4 ++-- tomorrow_logo_open_source.svg | 10 +++++----- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index 71bac5b81e..d350d3535c 100644 --- a/index.html +++ b/index.html @@ -88,9 +88,9 @@
- +
- Help out with missing data by contributing on GitHub. Follow us on Twitter for the latest updates. + Help out with missing data by contributing on GitHub. Follow us on Twitter for the latest updates.
diff --git a/tomorrow_logo_open_source.svg b/tomorrow_logo_open_source.svg index 96173b9087..bfde2da70d 100644 --- a/tomorrow_logo_open_source.svg +++ b/tomorrow_logo_open_source.svg @@ -1,14 +1,14 @@ - + Group Created with Sketch. - - - - + + + +