From b3803c9986a99e1b95414dbc478eac2508c1dd04 Mon Sep 17 00:00:00 2001
From: Borys_Levytskyi <Borys_Levytskyi@epam.com>
Date: Fri, 15 Jan 2021 12:51:05 +0200
Subject: [PATCH] Improve look of the input

---
 src/index.css                           | 7 ++++---
 src/shell/components/HelpResultView.tsx | 6 +++---
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/index.css b/src/index.css
index 13743c9..1940f47 100644
--- a/src/index.css
+++ b/src/index.css
@@ -7,7 +7,7 @@ code { font-size: 1.2em; font-weight: bold; }
 .header-cmd { color: #c5c5c5 }
 
 .mono { font-family: monospace; font-size: 1.3em }
-.expressionInput { width: 500px; padding: 3px; border: solid 1px lightgray; }
+.expressionInput { width: 500px; padding: 3px; border: none; outline: none; }
 
 .result { margin: 10px 10px 30px; }
 .result .input { margin-bottom: 10px; }
@@ -52,6 +52,7 @@ code { font-size: 1.2em; font-weight: bold; }
 .light .one { color: black; }
 .light .zero { color: #888; }
 .light .indicator { color: #ddd; }
+.light .expressionInput { background: #ddd;}
 .light .on { color: #121212; }
 .light .prefix { color: #888}
 .light .other { color: #bbb }
@@ -63,7 +64,7 @@ code { font-size: 1.2em; font-weight: bold; }
 /* Dark */
 .dark { background: #121212; color: white;}
 .dark .expression { color: white;}
-.dark .expressionInput { background: #121212; color: white; }
+.dark .expressionInput { color: white; background: #555; }
 .dark a, .dark a:visited { color: white; }
 .dark .indicator { color: #555; }
 .dark .on { color: white; }
@@ -81,7 +82,7 @@ code { font-size: 1.2em; font-weight: bold; }
 .midnight .header-cmd { color: #85a0ad }
 .midnight { background: #2c3e50; color: white }
 .midnight .expression { color: white;}
-.midnight .expressionInput { background: #2c3e50; color: white; border-color: #85a0ad }
+.midnight .expressionInput { background: #85a0ad; color: white;}
 .midnight a, .dark a:visited { color: white; }
 .midnight .indicator { color: #85a0ad; }
 .midnight .on { color: white; }
diff --git a/src/shell/components/HelpResultView.tsx b/src/shell/components/HelpResultView.tsx
index ffd510f..57f81a5 100644
--- a/src/shell/components/HelpResultView.tsx
+++ b/src/shell/components/HelpResultView.tsx
@@ -24,9 +24,9 @@ function HelpResultView() {
                                 <div className="section">
                                     <strong className="section-title  soft">Color Theme Commands</strong>
                                 <ul>
-                                    <li><code><CommandLink text="light" /></code> — set Light theme</li>
-                                    <li><code><CommandLink text="dark" /></code> — set Dark theme</li>
-                                    <li><code><CommandLink text="midnight" /></code> — set Midnight theme</li>
+                                    <li><code><CommandLink text="light" /></code> — set Light color theme</li>
+                                    <li><code><CommandLink text="dark" /></code> — set Dark color theme</li>
+                                    <li><code><CommandLink text="midnight" /></code> — set Midnight color theme</li>
                                 </ul>
                                 </div>
                                 <div className="section">