From 78b168d8f5af83500844241b60d0ef9618252863 Mon Sep 17 00:00:00 2001
From: blckmn <blackman@xtra.com.au>
Date: Sat, 5 Nov 2022 21:48:16 +1100
Subject: Adding help icons and improving darkmode css.

---
 locales/en/messages.json       | 15 +++++++++++++++
 src/css/dark-theme.less        | 14 ++++++++++++++
 src/tabs/firmware_flasher.html | 15 ++++++++++-----
 3 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/locales/en/messages.json b/locales/en/messages.json
index 2b1aa69c..36691246 100644
--- a/locales/en/messages.json
+++ b/locales/en/messages.json
@@ -6725,5 +6725,20 @@
     },
     "firmwareFlasherConfigurationFile": {
         "message": "Configuration Filename:"
+    },
+    "firmwareFlasherRadioProtocolDescription": {
+        "message": "Select the radio protocols you would like included in this build. Note this is a drop down, and multiple items maybe selected."
+    },
+    "firmwareFlasherTelemetryProtocolDescription": {
+        "message": "Select the telemetry protocols you would like included in this build. Note this is a drop down, and multiple items maybe selected. There are also some telemetry protocols that will be enabled, regardless of your selection here based on the radio protocol selected, e.g. CRSF."
+    },
+    "firmwareFlasherOptionsDescription": {
+        "message": "Select the generic options you would like included in this build. Note this is a drop down, and multiple items maybe selected. Such items as fixes, e.g. AKK VTX, are included here."
+    },
+    "firmwareFlasherMotorProtocolDescription": {
+        "message": "Select the motor (ESC) protocols you would like included in this build. Note this is a drop down, and multiple items maybe selected."
+    },
+    "firmwareFlasherBranchDescription": {
+        "message": "Especially useful for developers, you can select a merged PR, specify a commit sha, or specify a 'yet to be merged' PR by typing in: pull/{PR number}/head ."
     }
 }
diff --git a/src/css/dark-theme.less b/src/css/dark-theme.less
index f9b98b34..4dd8c31d 100644
--- a/src/css/dark-theme.less
+++ b/src/css/dark-theme.less
@@ -315,6 +315,20 @@ button {
 	}
 }
 .tab-firmware_flasher {
+	.build_configuration {
+		.select2 {
+			color: #424242;
+			.selection {
+				.select2-selection {
+					background-color: #575757;
+				}
+			}
+		}
+		select {
+			background-color: #3a3a3a;
+			color: white;
+		}
+	}
 	.options {
 		select {
 			background-color: #3a3a3a;
diff --git a/src/tabs/firmware_flasher.html b/src/tabs/firmware_flasher.html
index d03d2f99..e15fcc53 100644
--- a/src/tabs/firmware_flasher.html
+++ b/src/tabs/firmware_flasher.html
@@ -155,15 +155,17 @@
                     <div style="width: 49%; float: left;">
                         <strong i18n="firmwareFlasherBuildRadioProtocols"></strong>
                         <div id="radioProtocolInfo">
-                            <select id="radioProtocols" name="radioProtocols" multiple="multiple" class="select2" style="width: 95%; color: #424242">
+                            <select id="radioProtocols" name="radioProtocols" multiple="multiple" class="select2" style="width: 95%">
                             </select>
+                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherRadioProtocolDescription"></div>
                         </div>
                     </div>
                     <div style="width: 49%; float: right;">
                         <strong i18n="firmwareFlasherBuildTelemetryProtocols"></strong>
                         <div id="telemetryProtocolInfo">
-                            <select id="telemetryProtocols" name="telemetryProtocols" multiple="multiple" class="select2" style="width: 95%; color: #424242">
+                            <select id="telemetryProtocols" name="telemetryProtocols" multiple="multiple" class="select2" style="width: 95%">
                             </select>
+                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherTelemetryProtocolDescription"></div>
                         </div>
                     </div>
                 </div>
@@ -173,15 +175,17 @@
                     <div style="width: 49%; float: left;">
                         <strong i18n="firmwareFlasherBuildOptions"></strong>
                         <div id="optionsInfo">
-                            <select id="options" name="options" multiple="multiple" class="select2" style="width: 95%; color: #424242">
+                            <select id="options" name="options" multiple="multiple" class="select2" style="width: 95%">
                             </select>
+                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherOptionsDescription"></div>
                         </div>
                     </div>
                     <div style="width: 49%; float: right;">
                         <strong i18n="firmwareFlasherBuildMotorProtocols"></strong>
                         <div id="motorProtocolInfo">
-                            <select id="motorProtocols" name="motorProtocols" multiple="multiple" class="select2" style="width: 95%; color: #424242">
+                            <select id="motorProtocols" name="motorProtocols" multiple="multiple" class="select2" style="width: 95%">
                             </select>
+                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherMotorProtocolDescription"></div>
                         </div>
                     </div>
                 </div>
@@ -191,8 +195,9 @@
                     <div style="width: 49%; float: left;">
                         <strong i18n="firmwareFlasherBranch"></strong>
                         <div id="branchInfo">
-                            <select id="commits" name="commits" class="select2" style="width: 95%; color: #424242">
+                            <select id="commits" name="commits" class="select2" style="width: 95%">
                             </select>
+                            <div class="helpicon cf_tip_wide" i18n_title="firmwareFlasherBranchDescription"></div>
                         </div>
                     </div>
                 </div>
-- 
cgit v1.2.3