From 65204fa0ff7bf1a24faad86a60bd8ba431b6208b Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Tue, 4 Jun 2019 23:17:44 +0200
Subject: [PATCH] fix Ticker highlight style

---
 src/renderer/components/Ticker.css | 5 +++++
 src/renderer/components/Ticker.jsx | 6 +++---
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/Ticker.css b/src/renderer/components/Ticker.css
index a74057d..dacbfed 100644
--- a/src/renderer/components/Ticker.css
+++ b/src/renderer/components/Ticker.css
@@ -50,3 +50,8 @@
 .change--negative {
     color: crimson;
 }
+
+.active .change--positive,
+.active .change--negative {
+    color: #fff !important;
+}
diff --git a/src/renderer/components/Ticker.jsx b/src/renderer/components/Ticker.jsx
index 412e8fc..8183b29 100644
--- a/src/renderer/components/Ticker.jsx
+++ b/src/renderer/components/Ticker.jsx
@@ -46,12 +46,12 @@ export default class Ticker extends PureComponent {
       borderColor: accentColor
     }
 
-    // convert Map to array first, cause for...of or forEach returns undefined,
-    // so it cannot be mapped to a collection of elements
+    // convert Map to array first, cause for...of or forEach returns
+    // undefined, so it cannot be mapped to a collection of elements
     return [...prices.entries()].map(([key, value]) => (
       <Item key={key} className="number-unit">
         <button
-          className="label label--price"
+          className={`label label--price ${key === currency && 'active'}`}
           onClick={() => toggleCurrencies(key)}
           disabled={needsConfig}
           style={key === currency && !needsConfig ? activeStyle : {}}