From 2fecfb0b6577e5b4bedfce59ad25286bc808ebf8 Mon Sep 17 00:00:00 2001
From: Hydra <dominic.clifton@cleanflight.com>
Date: Sat, 22 Apr 2017 15:33:25 +0100
Subject: [PATCH] CF/BF - Cleanup ports tab.

Handes wrapping on narrow screens better.
---
 _locales/en/messages.json | 19 ++++++++++++++-----
 tabs/ports.css            | 17 ++++++++++++++++-
 tabs/ports.js             |  2 +-
 3 files changed, 31 insertions(+), 7 deletions(-)
 mode change 100755 => 100644 _locales/en/messages.json

diff --git a/_locales/en/messages.json b/_locales/en/messages.json
old mode 100755
new mode 100644
index 4ceaeab4..13d61a7f
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -735,10 +735,10 @@
     },
 
     "portsIdentifier": {
-      "message": "Port Identifier"
+      "message": "Identifier"
     },
     "portsConfiguration": {
-      "message": "Configuration"
+      "message": "Configuration/MSP"
     },
     "portsSerialRx": {
       "message": "Serial Rx"
@@ -791,6 +791,18 @@
     "portsFunction_TELEMETRY_SMARTPORT": {
         "message": "SmartPort"
     },
+    "portsFunction_TELEMETRY_IBUS": {
+        "message": "iBUS"
+    },
+    "portsFunction_TELEMETRY_JETIXBUS": {
+        "message": "JETIXBUS"
+    },
+    "portsFunction_TELEMETRY_CRSF": {
+        "message": "CRSF"
+    },
+    "portsFunction_TELEMETRY_SRXL": {
+        "message": "SRXL"
+    },
     "portsFunction_ESC_SENSOR": {
         "message": "ESC"
     },
@@ -806,9 +818,6 @@
     "portsFunction_IRC_TRAMP": {
         "message": "IRC Tramp"
     },
-    "portsFunction_TELEMETRY_IBUS": {
-        "message": "iBUS Telemetry"
-    },
     "pidTuningUpgradeFirmwareToChangePidController": {
         "message": "<span style=\"color: red\">Changing PID controller disabled - you can change it via the CLI.</span>  You have firmware with API version <span style=\"color: red\">$1</span>, but this functionality requires requires <span style=\"color: #ffbb00\">$2</span>."
     },
diff --git a/tabs/ports.css b/tabs/ports.css
index 025490c7..04728aaf 100644
--- a/tabs/ports.css
+++ b/tabs/ports.css
@@ -72,8 +72,22 @@
     display: none;
 }
 
+/* margin required when cell contents wrap */
+.tab-ports .ports select {
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
+
+.tab-ports .ports select[name=function-peripherals],
+.tab-ports .ports select[name=function-telemetry] {
+    max-width: 110px;
+}
+
+.tab-ports .ports td {
+    text-align: center;
+}
+
 .tab-ports .ports thead td {
-    text-align: left;
     white-space: nowrap;
     padding: 5px 7px;
     background-color: #828885;
@@ -81,6 +95,7 @@
 }
 
 .tab-ports .ports thead td:first-child {
+    text-align: left;
     border-top-left-radius: 5px;
     border-left: 0px;
 }
diff --git a/tabs/ports.js b/tabs/ports.js
index de052a1e..134249ad 100644
--- a/tabs/ports.js
+++ b/tabs/ports.js
@@ -209,7 +209,7 @@ TABS.ports.initialize = function (callback, scrollPosition) {
                     var select_e;
                     if (column !== 'telemetry' && column !== 'sensors' && column !== 'peripherals') {
                         var checkboxId = 'functionCheckbox-' + portIndex + '-' + columnIndex + '-' + i;
-                        functions_e.prepend('<span class="function"><input type="checkbox" class="togglemedium" id="' + checkboxId + '" value="' + functionName + '" /><label for="' + checkboxId + '"> ' + functionRule.displayName + '</label></span>');
+                        functions_e.prepend('<span class="function"><input type="checkbox" class="togglemedium" id="' + checkboxId + '" value="' + functionName + '" /><label for="' + checkboxId + '"></label></span>');
 
                         if (serialPort.functions.indexOf(functionName) >= 0) {
                             var checkbox_e = functions_e.find('#' + checkboxId);