diff --git a/package.json b/package.json
index a9c2e130..aa336fec 100644
--- a/package.json
+++ b/package.json
@@ -57,6 +57,7 @@
"lru_map": "^0.3.3",
"marked": "^0.8.0",
"object-hash": "^2.0.3",
+ "select2": "^4.0.13",
"semver-min": "^0.6.5",
"short-unique-id": "^1.1.1",
"three": "~0.97.0",
diff --git a/src/css/select2_custom.css b/src/css/select2_custom.css
new file mode 100644
index 00000000..ec4f7993
--- /dev/null
+++ b/src/css/select2_custom.css
@@ -0,0 +1,32 @@
+/* Select 2 replacement styles */
+.select2 {
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: 400;
+ font-size: 13.3333px;
+}
+
+.select2-selection__rendered {
+ line-height: 19px !important;
+ padding-left: 4px !important;
+ color: var(--defaultText) !important;
+}
+
+.select2-container .select2-selection--single {
+ height: 20px !important;
+ border-radius: 3px !important;
+ border: 1px solid #bfbfbf !important;
+}
+
+.select2-selection__arrow {
+ height: 19px !important;
+}
+ .select2-selection__arrow b {
+ height: 5px !important;
+ width: 5px !important;
+ margin-left: -1px !important;
+ margin-top: -5px !important;
+ border: none !important;
+ border-bottom: 1px solid black !important;
+ border-right: 1px solid black !important;
+ transform: rotateZ(45deg);
+ }
\ No newline at end of file
diff --git a/src/css/tabs/firmware_flasher.css b/src/css/tabs/firmware_flasher.css
index 972b82b8..4258cf16 100644
--- a/src/css/tabs/firmware_flasher.css
+++ b/src/css/tabs/firmware_flasher.css
@@ -213,4 +213,4 @@
#dialogUnstableFirmwareAcknoledgement .content ul {
margin-top: 5px;
margin-bottom: 5px;
-}
+}
\ No newline at end of file
diff --git a/src/js/tabs/firmware_flasher.js b/src/js/tabs/firmware_flasher.js
index db029a04..9da5c223 100644
--- a/src/js/tabs/firmware_flasher.js
+++ b/src/js/tabs/firmware_flasher.js
@@ -528,6 +528,8 @@ TABS.firmware_flasher.initialize = function (callback) {
self.localFirmwareLoaded = false;
}
+ $('select[name="board"]').select2();
+
$('select[name="board"]').change(function() {
$("a.load_remote_file").addClass('disabled');
var target = $(this).val();
diff --git a/src/main.html b/src/main.html
index 5c4fe13b..e3b3731b 100644
--- a/src/main.html
+++ b/src/main.html
@@ -39,6 +39,8 @@
+
+
@@ -139,6 +141,8 @@
+
+
diff --git a/src/tabs/firmware_flasher.html b/src/tabs/firmware_flasher.html
index efedeae6..7d33051e 100644
--- a/src/tabs/firmware_flasher.html
+++ b/src/tabs/firmware_flasher.html
@@ -23,7 +23,7 @@
|
- |