re-arrange demodulator buttons in a dynamic grid

htdocs/css/openwebrx.css

@@ -445,7 +445,7 @@ input[type=range]:disabled {
 
 .openwebrx-demodulator-button
 {
-	width: 38px;
+	min-width: 38px;
 	height: 19px;
 	font-size: 12pt;
 	text-align: center;
@@ -620,6 +620,18 @@ img.openwebrx-mirror-img
     padding-top: 0;
 }
 
+.openwebrx-modes-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));
+    grid-gap: 5px;
+}
+
+.openwebrx-modes-grid .openwebrx-demodulator-button {
+    margin: 0;
+    overflow: hidden;
+    white-space: nowrap;
+}
+
 #openwebrx-smeter-outer
 {
 	border-color: #888;

htdocs/lib/DemodulatorPanel.js

@@ -57,19 +57,9 @@ DemodulatorPanel.prototype.render = function() {
         );
     });
 
-    var index = 0;
+    var $modegrid = $('<div class="openwebrx-modes-grid"></div>');
-    var arrayLength = buttons.length;
+    $modegrid.append.apply($modegrid, buttons);
-    var chunks = [];
+    html.push($modegrid);
-
-    for (index = 0; index < arrayLength; index += 5) {
-        chunks.push(buttons.slice(index, index + 5));
-    }
-
-    html.push.apply(html, chunks.map(function(chunk){
-        $line = $('<div class="openwebrx-panel-line openwebrx-panel-flex-line"></div>');
-        $line.append.apply($line, chunk);
-        return $line
-    }));
 
     html.push($(
         '<div class="openwebrx-panel-line openwebrx-panel-flex-line">' +