colors

2 files changed, 11 insertions, 2 deletions

diff --git a/client/app.css b/client/app.css
index 28df14c..382e6d8 100644
--- a/client/app.css
+++ b/client/app.css
@@ -81,3 +81,6 @@ label {
   margin-bottom: 10px;
   margin-right: 10px;
 }
+.score.good { color: #080; }
+.score.ok { color: #d80; }
+.score.bad { color: #800; }
\ No newline at end of file
diff --git a/client/components/results.component.js b/client/components/results.component.js
index 3248a9a..a87420f 100644
--- a/client/components/results.component.js
+++ b/client/components/results.component.js
@@ -5,6 +5,12 @@ import { connect } from 'react-redux'
 import * as actions from '../actions'
 import * as types from '../types'
 
+function scoreClass(score) {
+  if (score < 1) return 'exact'
+  if (score <= 10) return 'good'
+  if (score < 15) return 'ok'
+  return 'bad'
+}
 function Results({ actions, query, similar }) {
   const { loading, success, error, match, results, added } = similar
   if (!success && !error) {
@@ -64,9 +70,9 @@ function Results({ actions, query, similar }) {
             />
           </div>
           <br />
-          {score == 0
+          {score === 0
             ? <span className='score'><b>Exact match</b></span>
-            : <span className='score'>Score: {score}</span>
+            : <span className={'score ' + scoreClass(score)}>Score: {score}</span>
           }<br />
           <span className='sha256'>{sha256}</span>
           Phash: {phash.toString(16)}