From 7f903ac736c0e8e50abb64f8985558471dc12062 Mon Sep 17 00:00:00 2001
From: Theo Arends <11044339+arendst@users.noreply.github.com>
Date: Sun, 7 Apr 2019 16:58:23 +0200
Subject: [PATCH] Only allow hex color values for future use

- Only allow hex color values (for future use)
- Change css background-color to background (saving code space)
---
 sonoff/my_user_config.h      |  7 +++----
 sonoff/xdrv_01_webserver.ino | 26 +++++++++++++-------------
 sonoff/xdrv_09_timers.ino    |  7 ++-----
 3 files changed, 18 insertions(+), 22 deletions(-)

diff --git a/sonoff/my_user_config.h b/sonoff/my_user_config.h
index 7258f893a..9ff45025d 100644
--- a/sonoff/my_user_config.h
+++ b/sonoff/my_user_config.h
@@ -272,11 +272,11 @@
 //  #define COLOR_FORM "#4f4f4f"                   // Form background color - Greyish
 //  #define COLOR_INPUT_TEXT "#000"                // Input text color - Black
 //  #define COLOR_INPUT "#ddd"                     // Input background color - Greyish
-//  #define COLOR_CONSOLE_TEXT "green"             // Console text color - Green
+//  #define COLOR_CONSOLE_TEXT "#008000"           // Console text color - Green
 //  #define COLOR_CONSOLE "#111"                   // Console background color - Blackish
 
-  #define COLOR_TEXT_WARNING "red"               // Warning text color - Red
-  #define COLOR_TEXT_SUCCESS "green"             // Success text color - Green
+  #define COLOR_TEXT_WARNING "#f00"              // Warning text color - Red
+  #define COLOR_TEXT_SUCCESS "#008000"           // Success text color - Green
 
   #define COLOR_BUTTON_TEXT "#fff"               // Button text color - White
   #define COLOR_BUTTON "#1fa3ec"                 // Button color - Blueish
@@ -289,7 +289,6 @@
   #define COLOR_TIMER_TAB_TEXT "#fff"            // Config timer tab text color - White
   #define COLOR_TIMER_TAB_BACKGROUND "#999"      // Config timer tab background color - Light grey
   #define COLOR_TIMER_ACTIVE_TAB_TEXT "#000"     // Config timer active tab text color - Black
-  #define COLOR_TIMER_ACTIVE_TAB_BG "transparent"  // Config timer active tab text color - Transparent (= COLOR_FORM)
 
 // -- mDNS ----------------------------------------
 #define USE_DISCOVERY                            // Enable mDNS for the following services (+8k code, +0.3k mem)
diff --git a/sonoff/xdrv_01_webserver.ino b/sonoff/xdrv_01_webserver.ino
index 986f4c173..35e10fd63 100644
--- a/sonoff/xdrv_01_webserver.ino
+++ b/sonoff/xdrv_01_webserver.ino
@@ -32,10 +32,10 @@
 #endif
 
 #ifndef COLOR_TEXT_WARNING
-#define COLOR_TEXT_WARNING                    "red"      // Warning text color - Red
+#define COLOR_TEXT_WARNING                    "#f00"     // Warning text color - Red
 #endif
 #ifndef COLOR_TEXT_SUCCESS
-#define COLOR_TEXT_SUCCESS                    "green"    // Success text color - Green
+#define COLOR_TEXT_SUCCESS                    "#008000"  // Success text color - Green
 #endif
 #ifndef COLOR_TEXT
 #define COLOR_TEXT                            "#000"     // Global text color - Black
@@ -288,21 +288,21 @@ const char HTTP_HEAD_STYLE1[] PROGMEM =
 
   "<style>"
   "div,fieldset,input,select{padding:5px;font-size:1em;}"
-  "fieldset{background-color:" COLOR_FORM ";}"  // Also update HTTP_TIMER_STYLE
+  "fieldset{background:" COLOR_FORM ";}"  // Also update HTTP_TIMER_STYLE
   "p{margin:0.5em 0;}"
-  "input{width:100%%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;background-color:" COLOR_INPUT ";color:" COLOR_INPUT_TEXT ";}"
+  "input{width:100%%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;background:" COLOR_INPUT ";color:" COLOR_INPUT_TEXT ";}"
   "input[type=checkbox],input[type=radio]{width:1em;margin-right:6px;vertical-align:-1px;}"
-  "select{width:100%%;background-color:" COLOR_INPUT ";color:" COLOR_INPUT_TEXT ";}"
-  "textarea{resize:none;width:98%%;height:318px;padding:5px;overflow:auto;background-color:" COLOR_CONSOLE ";color:" COLOR_CONSOLE_TEXT ";}"
-  "body{text-align:center;font-family:verdana;background-color:" COLOR_BACKGROUND ";}"
+  "select{width:100%%;background:" COLOR_INPUT ";color:" COLOR_INPUT_TEXT ";}"
+  "textarea{resize:none;width:98%%;height:318px;padding:5px;overflow:auto;background:" COLOR_CONSOLE ";color:" COLOR_CONSOLE_TEXT ";}"
+  "body{text-align:center;font-family:verdana;background:" COLOR_BACKGROUND ";}"
   "td{padding:0px;}";
 const char HTTP_HEAD_STYLE2[] PROGMEM =
-  "button{border:0;border-radius:0.3rem;background-color:" COLOR_BUTTON ";color:" COLOR_BUTTON_TEXT ";line-height:2.4rem;font-size:1.2rem;width:100%%;-webkit-transition-duration:0.4s;transition-duration:0.4s;cursor:pointer;}"
-  "button:hover{background-color:" COLOR_BUTTON_HOVER ";}"
-  ".bred{background-color:" COLOR_BUTTON_RESET ";}"
-  ".bred:hover{background-color:" COLOR_BUTTON_RESET_HOVER ";}"
-  ".bgrn{background-color:" COLOR_BUTTON_SAVE ";}"
-  ".bgrn:hover{background-color:" COLOR_BUTTON_SAVE_HOVER ";}"
+  "button{border:0;border-radius:0.3rem;background:" COLOR_BUTTON ";color:" COLOR_BUTTON_TEXT ";line-height:2.4rem;font-size:1.2rem;width:100%%;-webkit-transition-duration:0.4s;transition-duration:0.4s;cursor:pointer;}"
+  "button:hover{background:" COLOR_BUTTON_HOVER ";}"
+  ".bred{background:" COLOR_BUTTON_RESET ";}"
+  ".bred:hover{background:" COLOR_BUTTON_RESET_HOVER ";}"
+  ".bgrn{background:" COLOR_BUTTON_SAVE ";}"
+  ".bgrn:hover{background:" COLOR_BUTTON_SAVE_HOVER ";}"
   "a{text-decoration:none;}"
   ".p{float:left;text-align:left;}"
   ".q{float:right;text-align:right;}";
diff --git a/sonoff/xdrv_09_timers.ino b/sonoff/xdrv_09_timers.ino
index 2755f5a40..0147c9d14 100644
--- a/sonoff/xdrv_09_timers.ino
+++ b/sonoff/xdrv_09_timers.ino
@@ -521,9 +521,6 @@ bool TimerCommand(void)
 #ifndef COLOR_TIMER_ACTIVE_TAB_TEXT
 #define COLOR_TIMER_ACTIVE_TAB_TEXT "#000"         // Config timer active tab text color - Black
 #endif
-#ifndef COLOR_TIMER_ACTIVE_TAB_BG
-#define COLOR_TIMER_ACTIVE_TAB_BG   "transparent"  // Config timer active tab text color - Transparent (= COLOR_FORM)
-#endif
 
 #define WEB_HANDLE_TIMER "tm"
 
@@ -609,8 +606,8 @@ const char HTTP_TIMER_SCRIPT4[] PROGMEM =
     "if(ct<99){st();}"                                            // Save changes
     "ct=t;"
     "o=document.getElementsByClassName('tl');"                    // Restore style to all tabs/buttons
-    "for(i=0;i<o.length;i++){o[i].style.cssText=\"background-color:" COLOR_TIMER_TAB_BACKGROUND ";color:" COLOR_TIMER_TAB_TEXT ";font-weight:normal;\"}"
-    "e.style.cssText=\"background-color:" COLOR_TIMER_ACTIVE_TAB_BG ";color:" COLOR_TIMER_ACTIVE_TAB_TEXT ";font-weight:bold;\";"  // Change style to tab/button used to open content
+    "for(i=0;i<o.length;i++){o[i].style.cssText=\"background:" COLOR_TIMER_TAB_BACKGROUND ";color:" COLOR_TIMER_TAB_TEXT ";font-weight:normal;\"}"
+    "e.style.cssText=\"background:" COLOR_FORM ";color:" COLOR_TIMER_ACTIVE_TAB_TEXT ";font-weight:bold;\";"  // Change style to tab/button used to open content
     "s=pt[ct];"                                                   // Get parameters from array
 #ifdef USE_SUNRISE
     "p=(s>>29)&3;eb('b'+p).checked=1;"                            // Set mode