Merge remote-tracking branch 'upstream/master' into general-protection-fix

2026-02-25 11:49:12 -06:00 · 2025-04-08 17:15:27 +01:00
parent 19fe88d633 4b6014439d
commit a110e52d3a
38 changed files with 634 additions and 857 deletions
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -81,6 +81,7 @@
        "libvirt-php"
    ],
    "search.exclude": {
-        "emhttp/webGui/**/*": true,
-    }
+        "emhttp/webGui/**/*": true
+    },
+    "php-cs-fixer.executablePath": "${extensionPath}/php-cs-fixer.phar"
 }
--- a/emhttp/plugins/dynamix.docker.manager/sheets/AddContainer.css
+++ b/emhttp/plugins/dynamix.docker.manager/sheets/AddContainer.css
@@ -66,12 +66,7 @@ div#configLocation dt {
    --add-container-file-tree-background: var(--gray-100);
 }

-.fileTree {
+/* .fileTree {
    width: 240px;
    max-height: 200px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    display: none;
-    background: var(--add-container-file-tree-background);
-}
+} */
--- a/emhttp/plugins/dynamix.docker.manager/sheets/DockerSettings.css
+++ b/emhttp/plugins/dynamix.docker.manager/sheets/DockerSettings.css
@@ -75,16 +75,10 @@ span.nonexist {
    margin-left: 20px;
 }

-.fileTree {
-    background: var(--docker-settings-file-tree-background);
+/* .fileTree {
    width: 300px;
    max-height: 150px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
+} */
 span.disabled {
    color: var(--docker-settings-span-disabled-color);
 }
--- a/emhttp/plugins/dynamix.docker.manager/sheets/UpdateContainer.css
+++ b/emhttp/plugins/dynamix.docker.manager/sheets/UpdateContainer.css
@@ -66,12 +66,7 @@ div#configLocation dt {
    margin-top: -0.18rem !important;
 }

-.fileTree {
+/* .fileTree {
    width: 240px;
    max-height: 200px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    display: none;
-    background: var(--update-container-file-tree-background);
-}
+} */
--- a/emhttp/plugins/dynamix.vm.manager/VMTemplates.page
+++ b/emhttp/plugins/dynamix.vm.manager/VMTemplates.page
@@ -16,6 +16,14 @@ Markdown="false"
 * all copies or substantial portions of the Software.
 */
 ?>
+<link type="text/css" rel="stylesheet" href="<?autov('/webGui/styles/jquery.switchbutton.css')?>">
+<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/jquery.filetree.css")?>">
+<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/jquery.ui.css")?>">
+
+<script src="<?autov('/webGui/javascript/jquery.switchbutton.js')?>"></script>
+<script src="<?autov('/plugins/dynamix.vm.manager/javascript/dynamix.vm.manager.js')?>"></script>
+<script src="<?autov('/plugins/dynamix.vm.manager/javascript/vmmanager.js')?>"></script>
+<script src="<?autov('/webGui/javascript/jquery.filetree.js')?>" charset="utf-8"></script>
 <?
 	$docroot ??= ($_SERVER['DOCUMENT_ROOT'] ?: '/usr/local/emhttp');
 	require_once "$docroot/plugins/dynamix.vm.manager/include/libvirt_helpers.php";
@@ -37,16 +45,6 @@ Markdown="false"
 	}
 	if (strpos($strName,"User-") === false) $user = ""; else $user = ' class="user"'; 
 ?>
-
-<link type="text/css" rel="stylesheet" href="<?autov('/webGui/styles/jquery.switchbutton.css')?>">
-<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/jquery.filetree.css")?>">
-<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/jquery.ui.css")?>">
-
-<script src="<?autov('/webGui/javascript/jquery.switchbutton.js')?>"></script>
-<script src="<?autov('/plugins/dynamix.vm.manager/javascript/dynamix.vm.manager.js')?>"></script>
-<script src="<?autov('/plugins/dynamix.vm.manager/javascript/vmmanager.js')?>"></script>
-<script src="<?autov('/webGui/javascript/jquery.filetree.js')?>" charset="utf-8"></script>
-
 <div class="vmtemplate">
 	<a href="/VMs/AddVM?template=<?=htmlspecialchars(urlencode($strName))?>">
 		<span name="<?=htmlspecialchars($strName)?>" <?=$user?>><img src="/plugins/dynamix.vm.manager/templates/images/<?=htmlspecialchars($arrTemplate['icon'])?>" title="<?=htmlspecialchars($strName)?>"></span>
--- a/emhttp/plugins/dynamix.vm.manager/include/VMedit.php
+++ b/emhttp/plugins/dynamix.vm.manager/include/VMedit.php
@@ -100,9 +100,10 @@ if (strpos($strSelectedTemplate,"User-") !== false) {
 	$usertemplate = 1;
 }
 ?>
-<link type="text/css" rel="stylesheet" href="<?autov('/plugins/dynamix.vm.manager/styles/dynamix.vm.manager.css')?>">
 <link type="text/css" rel="stylesheet" href="<?autov('/webGui/styles/jquery.filetree.css')?>">
 <link type="text/css" rel="stylesheet" href="<?autov('/webGui/styles/jquery.switchbutton.css')?>">
+<link type="text/css" rel="stylesheet" href="<?autov('/plugins/dynamix.vm.manager/styles/dynamix.vm.manager.css')?>">
+<link type="text/css" rel="stylesheet" href="<?autov('/plugins/dynamix.vm.manager/styles/edit.css')?>">

 <span class="status advancedview_panel" style="margin-top:<?=$top?>px;"><input type="checkbox" class="inlineview"><input type="checkbox" class="advancedview"></span>
 <div class="domain">
--- a/emhttp/plugins/dynamix.vm.manager/sheets/UpdateVM.css
+++ b/emhttp/plugins/dynamix.vm.manager/sheets/UpdateVM.css
@@ -1,296 +0,0 @@
-:root {
-    --add-vm-background: var(--black);
-}
-
-.Theme--azure:root,
-.Theme--white:root {
-    --add-vm-background: var(--gray-100);
-}
-
-body {
-    -webkit-overflow-scrolling: touch;
-}
-#vmform table {
-    margin-top: 0;
-    table-layout: fixed;
-}
-#vmform div.title + table {
-    margin-top: 0;
-}
-#vmform table tr {
-    vertical-align: top;
-    line-height: 4rem;
-    height: 4rem;
-}
-#vmform table tr td:nth-child(1) {
-    width: 25%;
-    text-align: right;
-    padding-right: 10px;
-}
-#vmform table tr td:nth-child(2) {
-    width: 800px;
-}
-@media (max-width: 1280px) {
-    #vmform table tr td:first-child {
-        width: 35%;
-        padding-right: 4rem;
-    }
-}
-@media (min-width: 1281px) {
-    #vmform table tr td:first-child {
-        width: 30%;
-        padding-right: 4rem;
-    }
-}
-@media (min-width: 1921px) {
-    #vmform table tr td:first-child {
-        width: 25%;
-        padding-right: 4rem;
-    }
-}
-#vmform table tr td:last-child {
-    width: inherit;
-}
-
-#vmform textarea{
-    max-width:500px;
-    scrollbar-width:4px;
-}
-
-#vmform textarea::-webkit-scrollbar{
-    height:4px;
-    width:4px;
-}
-
-#vmform .multiple {
-    position: relative;
-}
-#vmform .sectionbutton {
-    position: absolute;
-    left: 2px;
-    cursor: pointer;
-    opacity: 0.4;
-    font-size: 1.4rem;
-    line-height: 17px;
-    z-index: 10;
-    transition-property: opacity, left;
-    transition-duration: 0.1s;
-    transition-timing-function: linear;
-}
-#vmform .sectionbutton.remove {
-    top: 0;
-    opacity: 0.3;
-}
-#vmform .sectionbutton.add {
-    bottom: 0;
-}
-#vmform .sectionbutton:hover {
-    opacity: 1;
-}
-#vmform .sectiontab {
-    position: absolute;
-    top: 2px;
-    bottom: 2px;
-    left: 0;
-    width: 6px;
-    border-radius: 3px;
-    background-color: var(--gray-200); /* Condensed from: #dddddd */
-    transition-property: background, width;
-    transition-duration: 0.1s;
-    transition-timing-function: linear;
-}
-#vmform .multiple:hover .sectionbutton {
-    opacity: 0.7;
-    left: 4px;
-}
-#vmform .multiple:hover .sectionbutton.remove {
-    opacity: 0.6;
-}
-#vmform .multiple:hover .sectiontab {
-    background-color: var(--gray-300);
-    width: 8px;
-}
-#vmform table.multiple:hover {
-    background-position: 0 0;
-}
-#vmform table.multiple td {
-    padding: 5px 0;
-}
-span.advancedview_panel {
-    display: none;
-    line-height: 16px;
-    margin-top: 1px;
-}
-.basic {
-    display: none;
-}
-.advanced {
-    /*Empty placeholder*/
-}
-.switch-button-label.off {
-    color: inherit;
-}
-#template_img {
-    cursor: pointer;
-}
-#template_img:hover {
-    opacity: 0.5;
-}
-#template_img:hover i {
-    opacity: 1;
-}
-.template_img_chooser_inner {
-    display: inline-block;
-    width: 80px;
-    margin-bottom: 15px;
-    margin-right: 10px;
-    text-align: center;
-}
-.template_img_chooser_inner img {
-    width: 48px;
-    height: 48px;
-}
-.template_img_chooser_inner p {
-    text-align: center;
-    line-height: 8px;
-}
-#template_img_chooser {
-    width: 560px;
-    height: 300px;
-    overflow-y: scroll;
-    position: relative;
-    display:grid;
-    grid-template-columns: repeat(6, minmax(0, 1fr));
-}
-#template_img_chooser div:hover {
-    background-color: var(--gray-150); /* Condensed from: #eee */
-    cursor: pointer;
-}
-#form_content {
-    display: none;
-}
-#vmform .four {
-    overflow: hidden;
-}
-#vmform .four label {
-    float: left;
-    display: table-cell;
-    width: 15%;
-}
-#vmform .four label:nth-child(4n + 4) {
-}
-#vmform .four label.cpu1 {
-    width: 28%;
-    height: 16px;
-    line-height: 16px;
-}
-#vmform .four label.cpu2 {
-    width: 3%;
-    height: 16px;
-    line-height: 16px;
-}
-#vmform .mac_generate {
-    cursor: pointer;
-    margin-left: -5px;
-    color: var(--blue-700); /* Condensed from: #08c */
-    font-size: 1.3rem;
-    transform: translate(0px, 2px);
-}
-#vmform .disk {
-    display: none;
-}
-#vmform .disk_preview {
-    display: inline-block;
-    color: var(--gray-300); /* Condensed from: #bbb */
-    transform: translate(0px, 1px);
-}
-i.fa-plus-circle,
-i.fa-minus-circle {
-    margin-left: 8px;
-}
-input[type="checkbox"] {
-    margin-left: 0;
-}
-
-span.width {
-    display: inline-block;
-    width: 280px;
-}
-
-span.column1 {
-    display: inline-block;
-    width: 140px;
-}
-
-span.column2 {
-    display: inline-block;
-    width: 220px;
-}
-
-input#btnvCPUSelect,
-input.wlan0_info {
-    font-size: 1rem;
-    padding: 5px 10px;
-    margin: 0 0 0 10px;
-}
-
-span.space {
-    display: inline-block;
-    width: 60px;
-}
-
-span.label {
-    display: inline-block;
-    width: 110px;
-    text-align: right;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-span.ipvtap {
-    margin-left: 25px;
-    font-family: bitstream;
-}
-
-select.narrow {
-    min-width: 90px !important;
-}
-
-select.second {
-    margin-left: 12px;
-    max-width: 90px;
-    margin-right: 0;
-}
-
-div.wlan0 {
-    text-align: left;
-}
-
-input.trim {
-    width: 98px;
-    min-width: 98px;
-}
-
-input.second {
-    margin-left: 8px;
-}
-
-.autostart ~ .switch-button-background {
-    margin-top: 8px !important;
-    margin-left: 0 !important;
-}
-
-.hidden {
-    display: none !important;
-}
-
-.CodeMirror {
-    border: 1px solid var(--gray-150);
-    cursor: text;
-    margin-top: 15px;
-    margin-bottom: 10px;
-}
-
-.CodeMirror pre.CodeMirror-placeholder {
-    color: var(--gray-400);
-}
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines.css
+++ b/emhttp/plugins/dynamix.vm.manager/sheets/VMMachines.css
@@ -128,13 +128,7 @@ span.vmgraphics {
    text-align: left;
 }

-.fileTree {
-    background: var(--vm-machines-file-tree-background);
+/* .fileTree {
    width: 500px;
    max-height: 320px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
+} */
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMSettings.css
+++ b/emhttp/plugins/dynamix.vm.manager/sheets/VMSettings.css
@@ -57,13 +57,7 @@ body {
    font-family: clear-sans;
 }

-.fileTree {
-    background: var(--vm-machines-file-tree-background);
+/* .fileTree {
    width: 300px;
    max-height: 150px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
+} */
--- a/emhttp/plugins/dynamix.vm.manager/sheets/VMTemplates.css
+++ b/emhttp/plugins/dynamix.vm.manager/sheets/VMTemplates.css
@@ -33,7 +33,6 @@
 .vmtemplate p {
    text-align: center;
    margin-top: 8px;
-    line-height: 12px;
 }

 div.template,
@@ -42,13 +41,7 @@ input#upload {
    display: none;
 }

-.fileTree {
-    background: var(--filetree-background);
+/* .fileTree {
    width: 300px;
    max-height: 150px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
+} */
--- a/emhttp/plugins/dynamix.vm.manager/sheets/AddVM.css
+++ b/emhttp/plugins/dynamix.vm.manager/sheets/AddVM.css
@@ -1,5 +1,6 @@
 :root {
    --add-vm-background: var(--black);
+    --add-vm-border: var(--gray-150);
 }

 .Theme--azure:root,
@@ -52,14 +53,14 @@ body {
    width: inherit;
 }

-#vmform textarea{
-    max-width:500px;
-    scrollbar-width:4px;
+#vmform textarea {
+    max-width: 500px;
+    scrollbar-width: 4px;
 }

-#vmform textarea::-webkit-scrollbar{
-    height:4px;
-    width:4px;
+#vmform textarea::-webkit-scrollbar {
+    height: 4px;
+    width: 4px;
 }

 #vmform .multiple {
@@ -142,29 +143,39 @@ span.advancedview_panel {
 .template_img_chooser_inner {
    display: inline-block;
    width: 80px;
-    margin-bottom: 15px;
-    margin-right: 10px;
    text-align: center;
 }
+.template_img_chooser_inner:hover {
+    color: var(--orange-400);
+    cursor: pointer;
+}
 .template_img_chooser_inner img {
    width: 48px;
    height: 48px;
 }
 .template_img_chooser_inner p {
    text-align: center;
-    line-height: 8px;
+    margin: 0;
+}
+.template_img_parent {
+    position: relative;
+}
+#template_img_chooser_outer {
+    position: absolute;
+    display: none;
+    border-radius: 5px;
+    border: 1px solid var(--add-vm-border);
+    background: var(--add-vm-background);
+    z-index: 10;
 }
 #template_img_chooser {
    width: 560px;
    height: 300px;
    overflow-y: scroll;
    position: relative;
-    display:grid;
+    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
-}
-#template_img_chooser div:hover {
-    background-color: var(--gray-150); /* Condensed from: #eee */
-    cursor: pointer;
+    gap: 1rem;
 }
 #form_content {
    display: none;
@@ -294,3 +305,7 @@ input.second {
 .CodeMirror pre.CodeMirror-placeholder {
    color: var(--gray-400);
 }
+
+.fileTree {
+    position: relative;
+}
--- a/emhttp/plugins/dynamix/Eth0.page
+++ b/emhttp/plugins/dynamix/Eth0.page
@@ -162,13 +162,6 @@ function prepareSettings(form) {
  if (brnics.length > 1) form.BRSTP.value = 'yes';
  if ($(form).find('input[name="#arg[1]"]').val() == 'none') return true;

-  var metrics = [], metrics6 = [];
-  $(form).find('input[name^="METRIC:"]').each(function(){if($(this).val() > 0) metrics.push($(this).val());});
-  $(form).find('input[name^="METRIC6:"]').each(function(){if($(this).val() > 0) metrics6.push($(this).val());});
-  if (metrics.same() || metrics6.same()) {
-    swal({title:'Duplicate metrics', text:'List of default gateways contains duplicate metric values', animation:'none', type:'error', html:true, confirmButtonText:"_(Ok)_"});
-    return false;
-  }
  // enable form items for submission
  $(form).find('input,select').prop('disabled',false);
  if (form.TYPE.value == 'access') {
@@ -213,7 +206,6 @@ function prepareSettings(form) {
  $(form).find('select[name^="USE_DHCP:"]').each(function() {
    var i = $(this).prop('name').split(':')[1];
    var protocol = $(form).find('select[name="PROTOCOL:'+i+'"]').val() || 'ipv4';
-    var metric = $(form).find('input[name="METRIC:'+i+'"]').val();
    var gw4 = (port == 'eth0') ? true : $(form).find('input[name="USE_GW4:'+i+'"]').prop('checked');
    if (protocol != 'ipv6' && $(this).val() != 'no') {
      $(form).find('input[name="IPADDR:'+i+'"]').val('');
@@ -224,7 +216,6 @@ function prepareSettings(form) {
  $(form).find('select[name^="USE_DHCP6:"]').each(function() {
    var i = $(this).prop('name').split(':')[1];
    var protocol = $(form).find('select[name="PROTOCOL:'+i+'"]').val() || 'ipv4';
-    var metric = $(form).find('input[name="METRIC6:'+i+'"]').val();
    var gw6 = (port == 'eth0') ? true : $(form).find('input[name="USE_GW6:'+i+'"]').prop('checked');
    if (protocol != 'ipv4' && $(this).val() != 'no') {
      $(form).find('input[name="IPADDR6:'+i+'"]').val('');
@@ -240,6 +231,13 @@ function prepareSettings(form) {
      $(form).find('input[name="'+name+'"]').val(data);
    });
  }
+  var metrics = [], metrics6 = [];
+  $(form).find('input[name^="METRIC:"]').each(function(){if($(this).val() > 0) metrics.push($(this).val());});
+  $(form).find('input[name^="METRIC6:"]').each(function(){if($(this).val() > 0) metrics6.push($(this).val());});
+  if (metrics.same() || metrics6.same()) {
+    swal({title:"_(Duplicate metrics)_", text:"_(List of default gateways contains duplicate metric values)_", animation:'none', type:'error', html:true, confirmButtonText:"_(Ok)_"});
+    return false;
+  }
  // force default MTU if jumbo frames are not enabled
  if ($(form).find('input[name="USE_MTU"]').prop('checked') == false) $(form).find('input[name="MTU"]').val('');
  $(form).find('input[name="#arg[1]"]').val(arg1[port]);
@@ -468,6 +466,7 @@ function checkNetworkAccess(form) {
 }

 function addVLAN(port) {
+  $('input[value="<?=_("Apply")?>"],input[value="Apply"]').prop('disabled',false);
  var index = 1;
  while ($('#index-'+port+'-'+index).length) index++;
  var template = $($('<div/>').loadTemplate($('#network-template-'+port)).html().replace(/INDEX/g,index));
@@ -558,7 +557,7 @@ function networkInfo(port, vlan) {
 </script>

 <div class="title nocontrol shift">&nbsp;</div>
-<div class="shade-<?=$display['theme']?> uplift">
+<div class="shade uplift">
 <form name="dns_settings" onchange="signalRun(this,1)">
 <div markdown="1" id="dns4" class="hide">
 _(IPv4 DNS server assignment)_:
@@ -787,7 +786,7 @@ _(Enable VLANs)_:
 <div id="index-eth0-0"></div>
 <div id="vlan-list-eth0" class="hide">
 <?foreach ($vlan_eth0 as $i):?>
-<div markdown="1" id="index-eth0-<?=$i?>" class="access-eth0 shade-<?=$display['theme']?> hide">
+<div markdown="1" id="index-eth0-<?=$i?>" class="access-eth0 shade hide">
 _(Interface description)_:
 : <input type="text" name="DESCRIPTION:<?=$i?>" maxlength="80" autocomplete="off" spellcheck="false" value="<?=htmlspecialchars(_var($eth0,"DESCRIPTION:$i"))?>">
  <input type="button" class="form" value="_(Info)_" onclick="networkInfo('eth0',<?=_var($eth0,"VLANID:$i")?>)">
@@ -889,7 +888,7 @@ _(IPv6 privacy extensions)_:
 </form>

 <script markdown="1" type="text/html" id="network-template-eth0">
-<div markdown="1" id="index-eth0-INDEX" class="access-eth0 shade-<?=$display['theme']?>">
+<div markdown="1" id="index-eth0-INDEX" class="access-eth0 shade">
 _(Interface description)_:
 : <input type="text" name="DESCRIPTION:INDEX" maxlength="80" autocomplete="off" spellcheck="false" value="<?=htmlspecialchars(_var($eth0,"DESCRIPTION:INDEX"))?>">

--- a/emhttp/plugins/dynamix/EthX.page
+++ b/emhttp/plugins/dynamix/EthX.page
@@ -249,7 +249,7 @@ _(Enable VLANs)_:
 <div id='index-ethX-0'></div>
 <div id="vlan-list-ethX" class="hide">
 <?foreach ($vlan_ethX as $i):?>
-<div markdown="1" id="index-ethX-<?=$i?>" class="access-ethX shade-<?=$display['theme']?> hide">
+<div markdown="1" id="index-ethX-<?=$i?>" class="access-ethX shade hide">
 _(Interface description)_:
 : <input type="text" name="DESCRIPTION:<?=$i?>" maxlength="80" autocomplete="off" spellcheck="false" value="<?=htmlspecialchars(_var($ethX,"DESCRIPTION:$i"))?>">
  <input type="button" class="form" value="_(Info)_" onclick="networkInfo('eth0',<?=_var($ethX,"VLANID:$i")?>)">
@@ -350,7 +350,7 @@ _(IPv6 privacy extensions)_:
 </form>

 <script markdown="1" type="text/html" id="network-template-ethX">
-<div markdown="1" id="index-ethX-INDEX" class="access-ethX shade-<?=$display['theme']?>">
+<div markdown="1" id="index-ethX-INDEX" class="access-ethX shade">
 _(Interface description)_:
 : <input type="text" name="DESCRIPTION:INDEX" maxlength="80" autocomplete="off" spellcheck="false" value="<?=htmlspecialchars(_var($ethX,"DESCRIPTION:INDEX"))?>">

--- a/emhttp/plugins/dynamix/RoutingTable.page
+++ b/emhttp/plugins/dynamix/RoutingTable.page
@@ -57,7 +57,7 @@ $(function(){
 <tbody id="route_list"></tbody>
 </table>

-<div class="shade-<?=$display['theme']?>" style="margin-top:12px;padding:12px 4px;">
+<div class="shade" style="margin-top:12px;padding:12px 4px;">
 <form markdown="1" name="add_routes" method="POST" action="/webGui/include/RoutingTable.php" target="progressFrame" onsubmit="setTimeout(resetTable,500)">
 _(Enter route + gateway + metric)_:
 : <input type="text" name="route" maxlength="39" value="" class="fixed" placeholder="_(IPv4/nn or IPv6/nn route)_" required>
--- a/emhttp/plugins/dynamix/ShareEdit.page
+++ b/emhttp/plugins/dynamix/ShareEdit.page
@@ -366,7 +366,7 @@ foreach ($rows as $row) echo $row;
 <input type="hidden" name="shareInclude" value="">
 <input type="hidden" name="shareExclude" value="">

-<div markdown="1" class="shade-<?=$display['theme']?>">
+<div markdown="1" class="shade">
 _(Share name)_:
 : <input type="text" id="shareName" name="shareName" maxlength="40" autocomplete="off" spellcheck="false" value="<?=htmlspecialchars($name)?>" oninput="checkName(this.value)" title="_(Hidden share names are not allowed)_" pattern="^[^\.].*"><span id="zfs-name" class="orange-text"><i class="fa fa-warning"></i> _(Share name contains invalid characters for ZFS use)_</span>

@@ -417,7 +417,7 @@ _(Exclusive access)_:
 <?endif;?>
 </div>

-<div markdown="1" class="shade-<?=$display['theme']?>">
+<div markdown="1" class="shade">
 _(Primary storage (for new files and folders))_:
 : <select id="primary" name="shareCachePool" onchange="form.shareFloor.value='';updateScreen(z(4),'slow')">
  <?=mk_option(primary(), '', _('Array'),  $poolsOnly ? 'disabled' : '')?>
@@ -486,7 +486,7 @@ _(Excluded disk(s))_:
 </div>

 </div>
-<div markdown="1" id="secondaryStorage" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="secondaryStorage" class="shade">
 _(Secondary storage)_:
 : <select id="secondary" onchange="updateScreen(z(4),'slow')">
  <?=mk_option(secondary(),'0',_('None'))?>
@@ -545,7 +545,7 @@ _(Excluded disk(s))_:
 </div>

 </div>
-<div markdown="1" id="moverAction" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="moverAction" class="shade">
 <div markdown="1" id="moverDirection1">
 _(Mover action)_:
 : <span class="input"><select id="direction" onchange="updateScreen(z(3),'slow')">
--- a/emhttp/plugins/dynamix/WG0.page
+++ b/emhttp/plugins/dynamix/WG0.page
@@ -1385,7 +1385,7 @@ _(DNS servers)_:

 <div id="peers-list-wg0" style="display:none"></div>
 <?foreach ($peer_wg0 as $i):?>
-<div markdown="1" id="index-wg0-<?=$i?>" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="index-wg0-<?=$i?>" class="shade">
 _(Peer name)_:
 : <span class="input"><input type="text" name="Name:<?=$i?>" class="wide" maxlength="99" value="<?=_var($wg0,"Name:$i")?>" onchange="quickValidate(this);" pattern="<?=$validname?>" title="_(Use only letters A-Z, digits or space,dash,underscore)_" placeholder="(_(optional)_)"></span>
  <input type="button" class="form" value="_(Delete Peer)_" onclick="delPeer($(document.wg0),'#index-wg0-<?=$i?>')">
@@ -1482,7 +1482,7 @@ _(Persistent keepalive)_:
 <small style="position:absolute;left:10px;top:30px">"WireGuard" and the "WireGuard" logo are registered trademarks of Jason A. Donenfeld</small>

 <script markdown="1" type="text/html" id="peer-template-wg0">
-<div markdown="1" id="index-wg0-INDEX" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="index-wg0-INDEX" class="shade">
 _(Peer name)_:
 : <span class="input"><input type="text" name="Name:INDEX" class="wide" maxlength="99" value="" onchange="quickValidate(this);" pattern="<?=$validname?>" title="_(Use only letters A-Z, digits or space,dash,underscore)_" placeholder="(_(optional)_)"></span>
  <span class="pin"><i class="fa fa-fw fa-eye eyeINDEX key-off" title="_(Show Peer Config)_"></i>
--- a/emhttp/plugins/dynamix/WGX.page
+++ b/emhttp/plugins/dynamix/WGX.page
@@ -283,7 +283,7 @@ _(DNS servers)_:

 <div id="peers-list-wgX" style="display:none"></div>
 <?foreach ($peer_wgX as $i):?>
-<div markdown="1" id="index-wgX-<?=$i?>" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="index-wgX-<?=$i?>" class="shade">
 _(Peer name)_:
 : <span class="input"><input type="text" name="Name:<?=$i?>" class="wide" maxlength="99" value="<?=_var($wgX,"Name:$i")?>" onchange="quickValidate(this);" pattern="<?=$validname?>" title="_(Use only letters A-Z, digits or space,dash,underscore)_" placeholder="(_(optional)_)"></span>
  <input type="button" class="form" value="_(Delete Peer)_" onclick="delPeer($(document.wgX),'#index-wgX-<?=$i?>')">
@@ -378,7 +378,7 @@ _(Persistent keepalive)_:
 </form>

 <script markdown="1" type="text/html" id="peer-template-wgX">
-<div markdown="1" id="index-wgX-INDEX" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="index-wgX-INDEX" class="shade">
 _(Peer name)_:
 : <span class="input"><input type="text" name="Name:INDEX" class="wide" maxlength="99" value="" onchange="quickValidate(this);" pattern="<?=$validname?>" title="_(Use only letters A-Z, digits or space,dash,underscore)_" placeholder="(_(optional)_)"></span>
  <span class="pin"><i class="fa fa-fw fa-eye eyeINDEX key-off" title="_(Show Peer Config)_"></i>
--- a/emhttp/plugins/dynamix/Wireless.page
+++ b/emhttp/plugins/dynamix/Wireless.page
@@ -49,23 +49,23 @@ _(Regulatory region)_:
 </form>

 <div id="wifi" class="hide">
-<div markdown="1" id="connected" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="connected" class="shade">
 _(Connected)_:
 : <i class="fa fa-spin fa-circle-o-notch"></i>

 </div>
-<div markdown="1" id="my_networks" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="my_networks" class="shade">
 _(My networks)_:
 : <i class="fa fa-spin fa-circle-o-notch"></i>

 </div>
-<div markdown="1" id="other_networks" class="shade-<?=$display['theme']?>">
+<div markdown="1" id="other_networks" class="shade">
 _(Other networks)_:
 : <i class="fa fa-spin fa-circle-o-notch"></i>

 </div>

-<div markdown="1" class="shade-<?=$display['theme']?>">
+<div markdown="1" class="shade">
 _(Add network)_:
 : <span class="wifi"><input name="CUSTOM" type="text" class="narrow" maxlength="32" autocomplete="off" spellcheck="false" value=""></span><i class="fa fa-wifi hand grey-text" onclick="manage_wifi(encodeURIComponent($('input[name=CUSTOM]').val()),3)" title="<?=$title?>"></i>

--- a/emhttp/plugins/dynamix/include/Boot.php
+++ b/emhttp/plugins/dynamix/include/Boot.php
@@ -20,9 +20,20 @@ $_SERVER['REQUEST_URI'] = '';
 require_once "$docroot/webGui/include/Translations.php";

 $var = parse_ini_file("/var/local/emhttp/var.ini");
+
+/**
+ * Just like DefaultPageLayout.php
+ */
+$theme   = strtok($display['theme'],'-');
+$themes1 = in_array($theme,['black','white']);
+$themes2 = in_array($theme,['gray','azure']);
+$themeHtmlClass = "Theme--$theme";
+if ($themes2) {
+  $themeHtmlClass .= " Theme--sidebar";
+}
 ?>
 <!DOCTYPE HTML>
-<html <?=$display['rtl']?>lang="<?=strtok($locale,'_')?:'en'?>">
+<html <?=$display['rtl']?>lang="<?=strtok($locale,'_')?:'en'?>" class="<?= $themeHtmlClass ?>">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -35,11 +46,22 @@ $var = parse_ini_file("/var/local/emhttp/var.ini");

 <link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/default-color-palette.css")?>">
 <link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/default-base.css")?>">
-<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/default-{$display['theme']}.css")?>">
+<link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/themes/{$display['theme']}.css")?>">

 <style>
-.notice{background-image:none;color:#e68a00;font-size:6rem;text-transform:uppercase;text-align:center;padding:4rem 0}
-.sub1,.sub2{margin:6rem 0;text-align:center;font-size:3rem}
+.boot-title {
+  background-image: none;
+  color: var(--orange-300);
+  font-size: 6rem;
+  text-transform: uppercase;
+  text-align: center;
+  padding: 4rem 0;
+}
+.boot-subtext {
+  margin: 6rem 0;
+  text-align: center;
+  font-size: 3rem;
+}
 </style>

 <script src="<?autov('/webGui/javascript/dynamix.js')?>"></script>
@@ -65,7 +87,7 @@ boot.on('message', function(msg) {
    default          : var status = "<span class='orange'>"+_('Array '+ini['fsState'])+"</span>";
  }
  status += ini['fsProgress'] ? "<br><span class='blue'>"+_(ini['fsProgress'])+"</span>" : "<br>&nbsp;";
-  $('.sub1').html(status);
+  $('.js-arrayStatus').html(status);
 });

 function parseINI(msg) {
@@ -102,19 +124,19 @@ function timer() {
  return Math.round((now.getTime()-start.getTime())/1000);
 }
 function reboot_now() {
-  $('.notice').html("<?=_('Reboot')?> - <?=gethostname()?>");
+  $('.js-bootTitle').html("<?=_('Reboot')?> - <?=gethostname()?>");
  boot.start();
  reboot_online();
 }
 function shutdown_now() {
-  $('.notice').html("<?=_('Shutdown')?> - <?=gethostname()?>");
+  $('.js-bootTitle').html("<?=_('Shutdown')?> - <?=gethostname()?>");
  boot.start();
  shutdown_online();
 }
 function reboot_online() {
  $.ajax({url:'/webGui/include/ProcessStatus.php',type:'POST',data:{name:'emhttpd',update:true},timeout:500})
  .done(function(){
-    $('.sub2').html("<?=_('System is going down')?>... "+timer());
+    $('.js-powerStatus').html("<?=_('System is going down')?>... "+timer());
    setTimeout(reboot_online,500);
  })
  .fail(function(){start=new Date(); setTimeout(reboot_offline,500);});
@@ -123,14 +145,14 @@ function reboot_offline() {
  $.ajax({url:'/webGui/include/ProcessStatus.php',type:'POST',data:{name:'emhttpd',update:true},timeout:500})
  .done(function(){location = '/Main';})
  .fail(function(){
-    $('.sub2').html("<?=_('System is rebooting')?>... "+timer());
+    $('.js-powerStatus').html("<?=_('System is rebooting')?>... "+timer());
    setTimeout(reboot_offline,500);
  });
 }
 function shutdown_online() {
  $.ajax({url:'/webGui/include/ProcessStatus.php',type:'POST',data:{name:'emhttpd',update:true},timeout:500})
  .done(function(){
-    $('.sub2').html("<?=_('System is going down')?>... "+timer());
+    $('.js-powerStatus').html("<?=_('System is going down')?>... "+timer());
    setTimeout(shutdown_online,500);
  })
  .fail(function(){start=new Date(); setTimeout(shutdown_offline,500);});
@@ -138,10 +160,10 @@ function shutdown_online() {
 function shutdown_offline() {
  var time = timer();
  if (time < 30) {
-    $('.sub2').html("<?=_('System is offline')?>... "+time);
+    $('.js-powerStatus').html("<?=_('System is offline')?>... "+time);
    setTimeout(shutdown_offline,500);
  } else {
-    $('.sub2').html("<?=_('System is powered off')?>...");
+    $('.js-powerStatus').html("<?=_('System is powered off')?>...");
    setTimeout(power_on,500);
  }
 }
@@ -177,8 +199,8 @@ case 'shutdown':
  exec('/sbin/poweroff -n');
  break;
 }
-echo '<div class="notice"></div>';
-echo '<div class="sub1">';
+echo '<div class="js-bootTitle boot-title"></div>';
+echo '<div class="js-arrayStatus boot-subtext">';
 switch (_var($var,'fsState')) {
 case 'Stopped':
  echo "<span class='red'>",_('Array Stopped'),"</span>$progress"; break;
@@ -190,7 +212,7 @@ default:
  echo "<span class='green'>",_('Array Started'),"</span>$progress"; break;
 }
 echo '</div>';
-echo '<div class="sub2"></div>';
+echo '<div class="js-powerStatus boot-subtext"></div>';
 echo '</body>';
 }else{
 ?>
--- a/emhttp/plugins/dynamix/include/DefaultPageLayout.php
+++ b/emhttp/plugins/dynamix/include/DefaultPageLayout.php
@@ -858,28 +858,9 @@ unset($pages,$page,$pgs,$pg,$icon,$nchan,$running,$start,$stop,$row,$script,$opt
 <div class="spinner fixed"></div>
 <form name="rebootNow" method="POST" action="/webGui/include/Boot.php"><input type="hidden" name="cmd" value="reboot"></form>
 <iframe id="progressFrame" name="progressFrame" frameborder="0"></iframe>
-<?
-// Build footer
-annotate('Footer');
-echo '<div id="footer"><span id="statusraid"><span id="statusbar">';
-$progress = (_var($var,'fsProgress')!='') ? "&bullet;<span class='blue strong tour'>{$var['fsProgress']}</span>" : "";
-switch (_var($var,'fsState')) {
-case 'Stopped':
-  echo "<span class='red strong'><i class='fa fa-stop-circle'></i> ",_('Array Stopped'),"</span>$progress"; break;
-case 'Starting':
-  echo "<span class='orange strong'><i class='fa fa-pause-circle'></i> ",_('Array Starting'),"</span>$progress"; break;
-case 'Stopping':
-  echo "<span class='orange strong'><i class='fa fa-pause-circle'></i> ",_('Array Stopping'),"</span>$progress"; break;
-default:
-  echo "<span class='green strong'><i class='fa fa-play-circle'></i> ",_('Array Started'),"</span>$progress"; break;
-}
-echo "</span></span><span id='countdown'></span><span id='user-notice' class='red-text'></span>";
-if ($wlan0) echo "<span id='wlan0' class='grey-text' onclick='wlanSettings()'><i class='fa fa-wifi fa-fw'></i></span>";
-echo "<span id='copyright'>Unraid&reg; webGui &copy;2024, Lime Technology, Inc.";
-echo " <a href='https://docs.unraid.net/go/manual/' target='_blank' title=\""._('Online manual')."\"><i class='fa fa-book'></i> "._('manual')."</a>";
-echo "<unraid-theme-switcher current='$theme' themes='".htmlspecialchars(json_encode(['azure', 'gray', 'black', 'white']), ENT_QUOTES, 'UTF-8')."'></unraid-theme-switcher>";
-echo "</span></div>";
-?>
+
+<? require_once "$docroot/webGui/include/DefaultPageLayout/Footer.php"; ?>
+
 <script>
 // Firefox specific workaround, not needed anymore in firefox version 100 and higher
 //if (typeof InstallTrigger!=='undefined') $('#nav-block').addClass('mozilla');
--- a/emhttp/plugins/dynamix/include/DefaultPageLayout/Footer.php
+++ b/emhttp/plugins/dynamix/include/DefaultPageLayout/Footer.php
@@ -0,0 +1,72 @@
+<?
+/**
+ * Returns the release year based on regBuildTime or the current year if not available
+ * @return string Year in YYYY format
+ */
+function releaseDateYear() {
+    global $var;
+
+    $date = new DateTime();
+    $timestamp = _var($var, 'regBuildTime', '');
+    if ($timestamp) {
+        $date->setTimestamp($timestamp);
+    }
+
+    return $date->format('Y');
+}
+/**
+ * Returns array status information based on filesystem state
+ * @param array $var Global state variable containing filesystem information
+ * @return array Status with class, icon, text and progress information
+ */
+function getArrayStatus($var) {
+    $progress = (_var($var,'fsProgress')!='') ? $var['fsProgress'] : "";
+
+    $statusMap = [
+        'Stopped' => ['class' => 'red', 'icon' => 'stop-circle', 'text' => _('Array Stopped')],
+        'Starting' => ['class' => 'orange', 'icon' => 'pause-circle', 'text' => _('Array Starting')],
+        'Stopping' => ['class' => 'orange', 'icon' => 'pause-circle', 'text' => _('Array Stopping')],
+        'default' => ['class' => 'green', 'icon' => 'play-circle', 'text' => _('Array Started')]
+    ];
+
+    $state = _var($var,'fsState');
+    $status = $statusMap[$state] ?? $statusMap['default'];
+
+    return [
+        'class' => $status['class'],
+        'icon' => $status['icon'],
+        'text' => $status['text'],
+        'progress' => $progress
+    ];
+}
+?>
+
+<footer id="footer">
+    <span id="statusraid">
+        <span id="statusbar">
+            <? $status = getArrayStatus($var); ?>
+            <span class="<?=$status['class']?> strong">
+                <i class="fa fa-<?=$status['icon']?>"></i> <?=$status['text']?>
+            </span>
+            <? if ($status['progress']): ?>
+                &bullet;<span class="blue strong tour"><?=$status['progress']?></span>
+            <? endif; ?>
+        </span>
+    </span>
+    <span id="user-notice" class="red-text"></span>
+    <? if ($wlan0): ?>
+        <span id="wlan0" class="grey-text" onclick="wlanSettings()">
+            <i class="fa fa-wifi fa-fw"></i>
+        </span>
+    <? endif; ?>
+    <span id="copyright">
+        Unraid&reg; webGui &copy;<?=releaseDateYear()?>, Lime Technology, Inc.
+        <a href="https://docs.unraid.net/go/manual/" target="_blank" title="<?=_('Online manual')?>">
+            <i class="fa fa-book"></i> <?=_('manual')?>
+        </a>
+        <unraid-theme-switcher 
+            current="<?=$theme?>"
+            themes='<?=htmlspecialchars(json_encode(['azure', 'gray', 'black', 'white']), ENT_QUOTES, 'UTF-8')?>'>
+        </unraid-theme-switcher>
+    </span>
+</footer>
--- a/emhttp/plugins/dynamix/include/Wireless.php
+++ b/emhttp/plugins/dynamix/include/Wireless.php
@@ -48,7 +48,7 @@ function scanWifi($port) {
      // store MAC address only
      $wlan[$network][0] = substr($wlan[$network][0],4,17);
      // identify open network
-      $wlan[$network][4] = $wlan[$network][4] ?: 'open';
+      $wlan[$network][4] ??= 'open';
    } else {
      // group radio frequencies
      $wlan[$network][1] .= ' '.$attr[1];
@@ -84,7 +84,7 @@ case 'list':
  $title = _('Connect to WiFi network');
  $port  = array_key_first($wifi);
  $carrier = "/sys/class/net/$port/carrier";
-  $echo  = [];
+  $echo  = $wlan = [];
  foreach ($wifi as $network => $block) {
    if ($network == $port) continue;
    $wlan[$network][0] = $block['ATTR1'] ?? '';
@@ -185,8 +185,8 @@ case 'join':
  }
  if ($manual || $safe) {
    echo "<tr><td>"._('Security')."</td><td><select name=\"SECURITY\" onclick=\"showSecurity(this.value)\">";
-    echo mk_option($safe, 'open', _('None'));
    echo mk_option($safe, 'auto', _('Automatic'));
+    echo mk_option($safe, 'open', _('None'));
    echo mk_option($safe, 'PSK', _('WPA2'));
    echo mk_option($safe, 'PSK SAE', _('WPA2/WPA3'));
    echo mk_option($safe, 'SAE', _('WPA3'));
--- a/emhttp/plugins/dynamix/include/publish.php
+++ b/emhttp/plugins/dynamix/include/publish.php
@@ -49,7 +49,7 @@ function publish($endpoint, $message, $len=1) {
      my_logger("Nchan out of shared memory.  Reloading nginx");
      // prevent multiple attempts at restarting from other scripts using publish.php
      touch("/tmp/publishPaused");
-      exec("/etc/rc.d/rc.nginx reload");
+      exec("/etc/rc.d/rc.nginx restart");
      @unlink("/tmp/publishPaused");
    }
  }
--- a/emhttp/plugins/dynamix/scripts/feedback
+++ b/emhttp/plugins/dynamix/scripts/feedback
@@ -1,5 +1,5 @@
 #!/usr/bin/php -q
-<?PHP
+<?php
 /* Copyright 2005-2024, Lime Technology
 * Copyright 2012-2024, Bergware International.
 *
@@ -13,7 +13,7 @@

 $docroot ??= ($_SERVER['DOCUMENT_ROOT'] ?: '/usr/local/emhttp');
 require_once "$docroot/webGui/include/Helpers.php";
-extract(parse_plugin_cfg('dynamix',true));
+extract(parse_plugin_cfg('dynamix', true));

 // add translations
 $_SERVER['REQUEST_URI'] = '';
@@ -22,8 +22,7 @@ require_once "$docroot/webGui/include/Translations.php";

 $var = parse_ini_file('state/var.ini');
 $unraid = parse_ini_file('/etc/unraid-version');
-$keyfile = !empty(_var($var,'regFILE')) ? trim(base64_encode(@file_get_contents($var['regFILE']))) : '';
-$width = in_array($display['theme'], ['azure','gray']) ? '98.8%' : '100%';
+$keyfile = !empty(_var($var, 'regFILE')) ? trim(base64_encode(@file_get_contents($var['regFILE']))) : '';
 $feedback = '/webGui/images/feedback_';

 $diagn = _('Unable to generate system diagnostics');
@@ -31,61 +30,132 @@ $sorry = _('Sorry, an error occurred');
 $again = _('Please try again later');
 ?>
 <style>
-div.spinner.fixed{z-index:100000}
-div#control_panel{position:absolute;left:0;right:0;top:0;padding-top:8px;line-height:24px;white-space:nowrap}
-div.divide{text-align:center;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
-div.divide label{margin-right:30px}
-div.allpanels{display:none;position:absolute;left:0;right:0;top:40px;bottom:0;overflow:auto}
-div#footer_panel{position:absolute;left:0;right:0;bottom:0;text-align:right}
-textarea.feedback{width:<?=$width?>;height:530px;margin:0;resize:none}
-@media(max-width:960px){textarea.feedback{height:330px}}
-@media(max-height:768px){textarea.feedback{height:330px}}
-input#email{float:left;padding-left:4px}
-p.note,label.note{font-size:1.1rem!important}
-span.spacer{margin:0 4px}
-img{display:inline-block;margin-bottom:30px}
-.center{text-align:center!important}
-.green-text{color:#4f8a10!important}
-.red-text{color:#f0000c!important}
+div.spinner.fixed {
+    z-index: 100000;
+}
+.feedback-control-panel {
+    padding-top: 8px;
+    line-height: 24px;
+    white-space: nowrap;
+    text-align: center;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+
+    label {
+        margin-right: 30px;
+    }
+}
+.feedback-panel {
+    display: none;
+}
+.feedback-panel-textarea {
+    width: 100%;
+    height: 530px;
+    margin: 0;
+    resize: none;
+    box-sizing: border-box;
+}
+@media (max-width: 960px) {
+    .feedback-panel-textarea {
+        height: 330px;
+    }
+}
+@media (max-height: 768px) {
+    .feedback-panel-textarea {
+        height: 330px;
+    }
+}
+.feedback-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 1rem;
+  gap: 1rem;
+}
+.feedback-footer-nav {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+}
+.feedback-email-input {
+    padding-left: 4px;
+}
+.note {
+    font-size: 1.1rem !important;
+}
+.feedback-submission-img {
+    display: inline-block;
+    margin-bottom: 30px;
+}
+.center {
+    text-align: center !important;
+}
+.green-text {
+    color: var(--green-800) !important;
+}
+.red-text {
+    color: var(--red-600) !important;
+}
 </style>

 <div>
-<div id="control_panel" class="divide">
-<label for="opt_featurerequest"><input type="radio" name="mode" id="opt_featurerequest" value="featurerequest" checked="checked"><?=_('Product Suggestion')?></label>
-<label for="opt_bugreport"><input type="radio" name="mode" id="opt_bugreport" value="bugreport"><?=_('Bug Report')?></label>
-<label for="opt_troubleshoot"><input type="radio" name="mode" id="opt_troubleshoot" value="troubleshoot"><?=_('Troubleshoot')?></label>
-<label for="opt_comment"><input type="radio" name="mode" id="opt_comment" value="comment"><?=_('Other Comment')?></label>
-<hr>
-</div>
+  <div class="feedback-control-panel">
+    <label for="opt_featurerequest">
+      <input type="radio" name="mode" id="opt_featurerequest" value="featurerequest" checked="checked">
+      <?=_('Product Suggestion')?>
+    </label>
+    <label for="opt_bugreport">
+      <input type="radio" name="mode" id="opt_bugreport" value="bugreport">
+      <?=_('Bug Report')?>
+    </label>
+    <label for="opt_troubleshoot">
+      <input type="radio" name="mode" id="opt_troubleshoot" value="troubleshoot">
+      <?=_('Troubleshoot')?>
+    </label>
+    <label for="opt_comment">
+      <input type="radio" name="mode" id="opt_comment" value="comment">
+      <?=_('Other Comment')?>
+    </label>
+    <hr>
+  </div>

-<div id="result_panel" class="allpanels"></div>
+  <div id="result_panel" class="feedback-panel"></div>

-<div id="featurerequest_panel" class="allpanels">
-<textarea id="featurerequest" class="feedback"></textarea>
-</div>
+  <div id="featurerequest_panel" class="feedback-panel">
+    <textarea id="featurerequest" class="feedback-panel-textarea"></textarea>
+  </div>

-<div id="bugreport_panel" class="allpanels">
-<textarea id="bugreport" class="feedback"></textarea>
-<label class="note" for="anonymize_bugreport"><input type="checkbox" id="anonymize_bugreport" class="anonymize" value="1"> <?=_('Anonymize diagnostics (may make troubleshooting more difficult)')?></label>
-<p class="note"><b><?=_('NOTE')?>:</b> <i><?=_('Submission of this bug report will automatically send your system diagnostics to Lime Technology')?>.</i></p>
-</div>
+  <div id="bugreport_panel" class="feedback-panel">
+    <textarea id="bugreport" class="feedback-panel-textarea"></textarea>
+    <label class="note" for="anonymize_bugreport">
+      <input type="checkbox" id="anonymize_bugreport" class="anonymize" value="1">
+      <?=_('Anonymize diagnostics (may make troubleshooting more difficult)')?>
+    </label>
+    <p class="note"><b><?=_('NOTE')?>:</b> <i><?=_('Submission of this bug report will automatically send your system diagnostics to Lime Technology')?>.</i></p>
+  </div>

-<div id="troubleshoot_panel" class="allpanels">
-<textarea id="troubleshoot" class="feedback"></textarea>
-<label class="note" for="anonymize_troubleshoot"><input type="checkbox" id="anonymize_troubleshoot" class="anonymize" value="1"><?=_('Anonymize diagnostics (may make troubleshooting more difficult)')?></label>
-<p class="note"><b><?=_('NOTE')?>:</b> <i><?=_('Submission of this troubleshooting request will automatically send your system diagnostics to Lime Technology')?>.</i></p>
-</div>
+  <div id="troubleshoot_panel" class="feedback-panel">
+    <textarea id="troubleshoot" class="feedback-panel-textarea"></textarea>
+    <label class="note" for="anonymize_troubleshoot">
+      <input type="checkbox" id="anonymize_troubleshoot" class="anonymize" value="1">
+      <?=_('Anonymize diagnostics (may make troubleshooting more difficult)')?>
+    </label>
+    <p class="note"><b><?=_('NOTE')?>:</b> <i><?=_('Submission of this troubleshooting request will automatically send your system diagnostics to Lime Technology')?>.</i></p>
+  </div>

-<div id="comment_panel" class="allpanels">
-<textarea id="comment" class="feedback"></textarea>
-</div>
+  <div id="comment_panel" class="feedback-panel">
+    <textarea id="comment" class="feedback-panel-textarea"></textarea>
+  </div>

-<div id="footer_panel">
-<input type="email" id="email" autocomplete="off" spellcheck="false">
-<a href="https://unraid.net" target="_blank"><?=_('Website')?></a><span class="spacer blue-text">|</span>
-<a href="https://forums.unraid.net" target="_blank"><?=_('Forum')?></a><span class="spacer blue-text">|</span>
-<a href="https://docs.unraid.net/" target="_blank"><?=_('Docs')?></a>
-</div>
+  <div class="feedback-footer">
+    <input class="feedback-email-input" type="email" autocomplete="off" spellcheck="false">
+    <nav class="feedback-footer-nav">
+      <a href="https://unraid.net" target="_blank"><?=_('Website')?></a>
+      <a href="https://forums.unraid.net" target="_blank"><?=_('Forum')?></a>
+      <a href="https://docs.unraid.net/" target="_blank"><?=_('Docs')?></a>
+    </nav>
+  </div>
 </div>

 <script>
@@ -136,7 +206,7 @@ String.prototype.md5 = function(){

 function validInput(input) {
  var validRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-  var email = $('input#email');
+  var email = $('.feedback-email-input');
  return input.val().md5() == md5[input.prop('id')] || !(email.prop('required')===false || email.val().match(validRegex));
 }

@@ -167,13 +237,13 @@ function form_submit(url, params, tab, diagnostics) {
    }).fail(function(){
      $('div.spinner.fixed').hide();
      panel.fadeOut('fast').find('textarea').prop('disabled',false);
-      var reply = "<h2 class='center red-text'><?=_('Error')?></h2><p class='center'><img src='<?=$feedback?>error.png'><br><?="$diagn. $again"?>.</p>";
+      var reply = "<h2 class='center red-text'><?=_('Error')?></h2><p class='center'><img class='feedback-submission-img' src='<?=$feedback?>error.png'><br><?="$diagn. $again"?>.</p>";
      $('#result_panel').html(reply).fadeIn('fast');
    });
    return;
  }
  params.description = $(tab).val();
-  params.email = $('input#email').val();
+  params.email = $('.feedback-email-input').val();
  params.timestamp = "<?=time()?>";
  params.osversion = "<?=$unraid['version']?>";
  params.keyfile = "<?=$keyfile?>";
@@ -181,18 +251,18 @@ function form_submit(url, params, tab, diagnostics) {
  $.post(url, params, function(data){
    $('div.spinner.fixed').hide();
    if (data.error) {
-      var reply = "<h2 class='center red-text'><?=_('Error')?></h2><p class='center'><img src='<?=$feedback?>error.png'><br><?="$sorry. $again"?>.</p>";
+      var reply = "<h2 class='center red-text'><?=_('Error')?></h2><p class='center'><img class='feedback-submission-img' src='<?=$feedback?>error.png'><br><?="$sorry. $again"?>.</p>";
      $('#result_panel').html(reply).fadeIn('fast');
    } else {
      var name = tab.substr(1).toLowerCase();
-      var reply = "<h2 class='center green-text'><?=_('Thank You')?></h2><p class='center'><img src='<?=$feedback?>"+name+".png'><br>"+(data.message||'')+"</p>";
+      var reply = "<h2 class='center green-text'><?=_('Thank You')?></h2><p class='center'><img class='feedback-submission-img' src='<?=$feedback?>"+name+".png'><br>"+(data.message||'')+"</p>";
      $('#result_panel').html(reply).fadeIn('fast');
    }
  }).fail(function(jqXHR, textStatus, errorThrown){
    if (jqXHR.responseJSON && jqXHR.responseJSON.error) {
      errorThrown = jqXHR.responseJSON.error;
    }
-    var reply = "<h2 class='center red-text'><?=_('Error')?></h2><p class='center'><img src='<?=$feedback?>error.png'><br><?="$sorry. $again"?>.</p>";
+    var reply = "<h2 class='center red-text'><?=_('Error')?></h2><p class='center'><img class='feedback-submission-img' src='<?=$feedback?>error.png'><br><?="$sorry. $again"?>.</p>";
    $('#result_panel').html(reply).fadeIn('fast');
  }).always(function(){
    $('#spinner_image').fadeOut('fast');
@@ -209,9 +279,9 @@ $(function(){
    var panel = tab+'_panel';
    var enter = ['#troubleshoot'].includes(tab);
    var email = "<?=_('Contact Email Address')?> ("+"<?=_('required')?>"+")";
-    $('input#email').prop('placeholder',email).prop('required','true');
+    $('.feedback-email-input').prop('placeholder',email).prop('required','true');
    $('#submit_button').prop('disabled',validInput($(tab)));
-    $('.allpanels').not(panel).fadeOut('fast');
+    $('.feedback-panel').not(panel).fadeOut('fast');
    $(panel).fadeIn('fast');
  });

@@ -219,7 +289,7 @@ $(function(){
    $('#submit_button').prop('disabled',validInput($(this)));
  });

-  $('input#email').on('input change',function(){
+  $('.feedback-email-input').on('input change',function(){
    var tab = '#'+$('input[name=mode]:checked').val();
    $('#submit_button').prop('disabled',validInput($(tab)));
  });
--- a/emhttp/plugins/dynamix/sheets/BrowseButton.css
+++ b/emhttp/plugins/dynamix/sheets/BrowseButton.css
@@ -200,16 +200,10 @@ input#dfm_target {
    color: var(--input-dfm-target-text-color);
    width: 500px;
 }
-input#dfm_target + .fileTree {
-    background: var(--input-dfm-target-filetree-bg-color);
+/* .fileTree {
    width: 500px;
    max-height: 320px;
-    overflow-y: scroll;
-    overflow-x: hidden;
-    position: absolute;
-    z-index: 100;
-    display: none;
-}
+} */
 i.dfm_filter {
    margin-top: -2px;
 }
--- a/emhttp/plugins/dynamix/sheets/Eth0.css
+++ b/emhttp/plugins/dynamix/sheets/Eth0.css
@@ -1,10 +1,4 @@
 :root {
-    /* Theme-specific shades */
-    --eth0-shade-azure: var(--theme-azure--gray-150);
-    --eth0-shade-gray: var(--theme-gray--black-alt);
-    --eth0-shade-white: var(--gray-150);
-    --eth0-shade-black: var(--gray-800);
-
    /* Input styles - default values (for azure/gray themes) */
    --eth0-narrow-input-width: 188px;
    --eth0-narrow-input-padding: 5px 6px;
@@ -47,25 +41,6 @@ input.form {
    margin-left: 10px;
 }

-/* Theme-specific background shades - consolidated margin/padding */
-div[class^="shade-"] {
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-
-div.shade-white {
-    background-color: var(--eth0-shade-white);
-}
-div.shade-black {
-    background-color: var(--eth0-shade-black);
-}
-div.shade-azure {
-    background-color: var(--eth0-shade-azure);
-}
-div.shade-gray {
-    background-color: var(--eth0-shade-gray);
-}
-
 /* Utility classes */
 select.slim {
    min-width: 47px;
--- a/emhttp/plugins/dynamix/sheets/ShareEdit.css
+++ b/emhttp/plugins/dynamix/sheets/ShareEdit.css
@@ -1,30 +1,3 @@
-:root {
-    --share-edit-shade-azure: #edeaef;
-    --share-edit-shade-gray: #121510;
-    --share-edit-shade-white: var(--gray-150);
-    --share-edit-shade-black: var(--gray-800);
-}
-
-div.shade-white {
-    background-color: var(--share-edit-shade-white); /* Condensed from: #ededed */
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-div.shade-black {
-    background-color: var(--share-edit-shade-black);
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-div.shade-azure {
-    background-color: var(--share-edit-shade-azure);
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-div.shade-gray {
-    background-color: var(--share-edit-shade-gray);
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
 #s1,
 #s2,
 #s3,
--- a/emhttp/plugins/dynamix/sheets/WG0.css
+++ b/emhttp/plugins/dynamix/sheets/WG0.css
@@ -1,11 +1,6 @@
 :root {
    --wg0-span-hshift-margin-right: -7px;
    --wg0-span-label-margin-left: -12px;
-
-    --wg0-shade-azure: #edeaef;
-    --wg0-shade-gray: #121510;
-    --wg0-shade-white: var(--gray-150);
-    --wg0-shade-black: var(--gray-800);
 }

 .Theme--sidebar:root {
@@ -67,27 +62,6 @@ span.label {
    letter-spacing: 1px;
    margin-left: var(--wg0-span-label-margin-left);
 }
-
-div.shade-white {
-    background-color: var(--wg0-shade-white); /* Condensed from: #ededed */
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-div.shade-black {
-    background-color: var(--wg0-shade-black);
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-div.shade-azure {
-    background-color: var(--wg0-shade-azure);
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
-div.shade-gray {
-    background-color: var(--wg0-shade-gray);
-    margin-top: 10px;
-    padding: 8px 0 3px 0;
-}
 div.title {
    margin-bottom: 10px !important;
 }
--- a/emhttp/plugins/dynamix/styles/default-base.css
+++ b/emhttp/plugins/dynamix/styles/default-base.css
@@ -1260,9 +1260,6 @@ div .unraid_mark_8 {
 div.spinner .unraid_mark_7 {
    animation: mark_7 1.5s ease infinite;
 }
-div.domain {
-    margin-top: -20px;
-}
@keyframes mark_2 {
    50% {
        transform: translateY(-40px);
@@ -1510,6 +1507,12 @@ span#wlan0 {
    cursor: pointer;
 }

+.shade {
+    margin-top: 1rem;
+    padding: 1rem 0;
+    background-color: var(--shade-bg-color);
+}
+
 /*
 * Using CSS Nesting, to narrow down the scope of the styles to the .Theme--sidebar class.
 * This allows us to have default-azure & default-gray set css variables
@@ -2160,14 +2163,14 @@ span#wlan0 {
        display: block;
        clear: both;
    }
-    div.vmtemplate:hover {
-        background-color: var(--opac-background-color);
-    }
    div.vmtemplate {
        height: 12rem;
        width: 12rem;
        border: 1px solid var(--table-alt-border-color);
    }
+    div.vmtemplate:hover {
+        background-color: var(--opac-background-color);
+    }
    div.vmtemplate img {
        margin-top: 20px;
    }
--- a/emhttp/plugins/dynamix/styles/default-color-palette.css
+++ b/emhttp/plugins/dynamix/styles/default-color-palette.css
@@ -1,3 +1,7 @@
+/*
+ * Naming convention inspired by Tailwind CSS
+ * @see https://tailwindcss.com/docs/customizing-colors
+ */
 :root {
    --font-sans: clear-sans, sans-serif;
    --font-bitstream: bitstream;
@@ -36,8 +40,8 @@
    --orange-200: #ff9900;
    --orange-300: #e68a00;
    --orange-400: #ce7c10;
-    --orange-500: #ff8c2f;
-    --orange-800: #f15a2c;
+    --orange-500: #ff8c2f; /* Unraid Brand Orange */
+    --orange-800: #f15a2c; /* Unraid Brand Orange Dark */
    --orange-900: #d63301;

    --red-100: #ffddd1;
@@ -45,7 +49,7 @@
    --red-500: #ff3300;
    --red-600: #f0000c; /* Condensed from: #ff0000 red */
    --red-700: #de1100;
-    --red-800: #e22828; /* Condensed from: #e80000 #ef3d47 */
+    --red-800: #e22828; /* Unraid Brand Red, Condensed from: #e80000 #ef3d47 */
    --red-900: #941c00;

    --green-100: #dff2bf;
--- a/emhttp/plugins/dynamix/styles/default-dynamix.css
+++ b/emhttp/plugins/dynamix/styles/default-dynamix.css
@@ -119,26 +119,6 @@
    margin-left: auto;
    margin-right: auto;
 }
-.jGrowl-notification.alert {
-    color: var(--dynamix-jgrowl-alert-text-color);
-    background-color: var(--dynamix-jgrowl-alert-bg-color);
-    border: 1px solid var(--dynamix-jgrowl-alert-border-color);
-}
-.jGrowl-notification.warning {
-    color: var(--dynamix-jgrowl-warning-text-color);
-    background-color: var(--dynamix-jgrowl-warning-bg-color);
-    border: 1px solid var(--dynamix-jgrowl-warning-border-color);
-}
-.jGrowl-notification.normal {
-    color: var(--dynamix-jgrowl-normal-text-color);
-    background-color: var(--dynamix-jgrowl-normal-bg-color);
-    border: 1px solid var(--dynamix-jgrowl-normal-border-color);
-}
-.jGrowl-notification.default {
-    color: var(--dynamix-jgrowl-text-color);
-    background-color: var(--dynamix-jgrowl-bg-color);
-    border: 1px solid var(--dynamix-jgrowl-border-color);
-}
 .jGrowl-notification {
    opacity: 0.96;
    min-height: 1.2rem;
@@ -147,7 +127,34 @@
    margin: 5px 0;
    text-align: left;
    border-radius: 6px;
-    box-shadow: 2px 2px 1px var(--dynamix-jgrowl-shadow-color);
+
+    &.alert {
+        color: var(--dynamix-jgrowl-alert-text-color);
+        background-color: var(--dynamix-jgrowl-alert-bg-color);
+        border: 1px solid var(--dynamix-jgrowl-alert-border-color);
+        box-shadow: 2px 2px 1px var(--dynamix-jgrowl-shadow-color);
+    }
+
+    &.warning {
+        color: var(--dynamix-jgrowl-warning-text-color);
+        background-color: var(--dynamix-jgrowl-warning-bg-color);
+        border: 1px solid var(--dynamix-jgrowl-warning-border-color);
+        box-shadow: 2px 2px 1px var(--dynamix-jgrowl-shadow-color);
+    }
+
+    &.normal {
+        color: var(--dynamix-jgrowl-normal-text-color);
+        background-color: var(--dynamix-jgrowl-normal-bg-color);
+        border: 1px solid var(--dynamix-jgrowl-normal-border-color);
+        box-shadow: 2px 2px 1px var(--dynamix-jgrowl-shadow-color);
+    }
+
+    &.default {
+        color: var(--dynamix-jgrowl-text-color);
+        background-color: var(--dynamix-jgrowl-bg-color);
+        border: 1px solid var(--dynamix-jgrowl-border-color);
+        box-shadow: 2px 2px 1px var(--dynamix-jgrowl-shadow-color);
+    }
 }
 .jGrowl-notification .jGrowl-header {
    font-weight: bold;
@@ -207,67 +214,7 @@
        display: none;
    }
 }
-.ui-dropdownchecklist {
-    background-color: transparent;
-    background-image: linear-gradient(66.6deg, transparent 60%, var(--dynamix-ui-dropdownchecklist-color) 40%),
-        linear-gradient(113.4deg, var(--dynamix-ui-dropdownchecklist-color) 40%, transparent 60%);
-    background-position: calc(100% - 4px), 100%;
-    background-size:
-        4px 6px,
-        4px 6px;
-    background-repeat: no-repeat;
-    border: none;
-    box-shadow: 0 1px 0 var(--dynamix-ui-dropdownchecklist-color);
-    outline: none;
-    height: 2.5rem;
-    line-height: 2.5rem;
-    cursor: pointer;
-}
-.ui-dropdownchecklist-selector {
-    border: none;
-    border-bottom: 1px solid var(--dynamix-ui-dropdownchecklist-color);
-    outline: none;
-    display: inline-block;
-    cursor: pointer;
-    padding: 1px 0;
-}
-.ui-dropdownchecklist-group {
-    font-weight: normal;
-    font-style: italic;
-    padding: 1px 0;
-}
-.ui-dropdownchecklist-selector-wrapper {
-    vertical-align: middle;
-    font-size: 0;
-}
-.ui-state-active {
-    background: transparent;
-}
-.ui-dropdownchecklist-dropcontainer {
-    color: var(--dynamix-ui-dropdownchecklist-color);
-    background-color: var(--dynamix-ui-dropdownchecklist-color-alt1);
-}
-.ui-state-disabled {
-    color: var(--dynamix-ui-dropdownchecklist-color);
-    border-bottom-color: var(--dynamix-ui-dropdownchecklist-color-alt2);
-    opacity: 0.5;
-    cursor: default;
-}
-.ui-dropdownchecklist-indent {
-    padding-left: 7px;
-}
-.ui-dropdownchecklist-text {
-    font-family: clear-sans;
-    font-size: 1.3rem;
-    color: var(--dynamix-ui-dropdownchecklist-color);
-}
-.ui-dropdownchecklist-item {
-    height: 2.2rem;
-    line-height: 2.2rem;
-}
-.ui-dropdownchecklist-item input {
-    vertical-align: top;
-}
+
 #sb-info-inner,
 #sb-loading-inner,
 div.sb-message {
@@ -1450,6 +1397,13 @@ div.icon-zip {
    border-left: 3px solid var(--dynamix-tooltipster-sidetip-box-border-color);
 }
 .fileTree {
+    display: none;
+    width: 300px;
+    max-height: 300px;
+    position: absolute;
+    z-index: 100;
+    overflow-y: scroll;
+    overflow-x: hidden;
    background-color: var(--dynamix-filetree-bg-color);
 }
 #guiSearchBox:placeholder-shown {
@@ -1552,7 +1506,7 @@ div.icon-zip {
 * @see https://developer.mozilla.org/en-US/docs/Web/CSS/Nesting_selector
 * @see https://caniuse.com/?search=nesting
 */
- .Theme--sidebar {
+.Theme--sidebar {
    .jGrowl.top-left {
        top: 90px;
    }
@@ -1565,28 +1519,6 @@ div.icon-zip {
    .jGrowl-notification {
        min-height: 4rem;
    }
-    .ui-dropdownchecklist {
-        height: 3rem;
-        line-height: 3rem;
-    }
-    .ui-dropdownchecklist-selector {
-        padding: 1px 14px 1px 6px;
-    }
-    .ui-dropdownchecklist-group {
-        padding: 1px 14px 1px 6px;
-    }
-    .ui-dropdownchecklist-dropcontainer {
-        border: 1px solid var(--dynamix-ui-dropdownchecklist-dropcontainer-border-color);
-    }
-    .ui-state-disabled {
-        opacity: 0.3;
-    }
-    .ui-dropdownchecklist-indent {
-        padding-left: 9px;
-    }
-    .ui-dropdownchecklist-text {
-        font-size: 1.2rem;
-    }
    table.tablesorter thead tr th {
        font-size: 1.3rem;
        padding: 5px 20px 5px 6px;
--- a/emhttp/plugins/dynamix/styles/dynamix-jquery-ui.css
+++ b/emhttp/plugins/dynamix/styles/dynamix-jquery-ui.css
@@ -8,7 +8,7 @@
    --dynamix-jquery-ui-button-background-start: var(--red-800);
    --dynamix-jquery-ui-button-background-end: var(--orange-500);
    --dynamix-jquery-ui-button-hover-color: var(--gray-100);
-    --dynamix-jquery-ui-default-background: var(--gray-100);
+    --dynamix-jquery-ui-default-background: transparent;
    --dynamix-jquery-ui-border-color: var(--black);
    --dynamix-jquery-ui-header-background: var(--gray-150); /* Condensed from: #e3e3e3 */
    --dynamix-jquery-ui-header-color: var(--black);
@@ -28,7 +28,7 @@
    --dynamix-jquery-ui-button-background-start: var(--red-800);
    --dynamix-jquery-ui-button-background-end: var(--orange-500);
    --dynamix-jquery-ui-button-hover-color: var(--gray-100);
-    --dynamix-jquery-ui-default-background: var(--black);
+    --dynamix-jquery-ui-default-background: transparent;
    --dynamix-jquery-ui-border-color: var(--gray-200); /* Condensed from: #e5e5e5 */
    --dynamix-jquery-ui-header-background: var(--gray-800); /* Condensed from: #2b2b2b */
    --dynamix-jquery-ui-header-color: var(--gray-100);
@@ -42,83 +42,118 @@
    --dynamix-jquery-ui-text-color: var(--gray-100);
 }

-.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button {
-    font-family: clear-sans;
-    font-size: 1.1rem;
-    font-weight: bold;
-    letter-spacing: 2px;
-    text-transform: uppercase;
-    margin: 10px 12px 10px 0;
-    padding: 9px 18px;
-    text-decoration: none;
-    white-space: nowrap;
-    cursor: pointer;
-    outline: none;
-    border-radius: 4px;
-    border: 0;
-    color: var(--dynamix-jquery-ui-button-text-color);
-    background:
-        -webkit-gradient(
-                linear,
-                left top,
-                right top,
-                from(var(--dynamix-jquery-ui-button-background-start)),
-                to(var(--dynamix-jquery-ui-button-background-end))
-            )
-            0 0 no-repeat,
-        -webkit-gradient(
-                linear,
-                left top,
-                right top,
-                from(var(--dynamix-jquery-ui-button-background-start)),
-                to(var(--dynamix-jquery-ui-button-background-end))
-            ) 0 100% no-repeat,
-        -webkit-gradient(
-                linear,
-                left bottom,
-                left top,
-                from(var(--dynamix-jquery-ui-button-background-start)),
-                to(var(--dynamix-jquery-ui-button-background-start))
-            ) 0 100% no-repeat,
-        -webkit-gradient(
-                linear,
-                left bottom,
-                left top,
-                from(var(--dynamix-jquery-ui-button-background-end)),
-                to(var(--dynamix-jquery-ui-button-background-end))
-            ) 100% 100% no-repeat;
-    background:
-        linear-gradient(90deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-end)) 0 0 no-repeat,
-        linear-gradient(90deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-end)) 0 100% no-repeat,
-        linear-gradient(0deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-start)) 0 100% no-repeat,
-        linear-gradient(0deg, var(--dynamix-jquery-ui-button-background-end) 0, var(--dynamix-jquery-ui-button-background-end)) 100% 100% no-repeat;
+.ui-dialog {
+    .ui-dialog-buttonpane {
+        .ui-dialog-buttonset {
+            button {
+                font-family: clear-sans;
+                font-size: 1.1rem;
+                font-weight: bold;
+                letter-spacing: 2px;
+                text-transform: uppercase;
+                margin: 10px 12px 10px 0;
+                padding: 9px 18px;
+                text-decoration: none;
+                white-space: nowrap;
+                cursor: pointer;
+                outline: none;
+                border-radius: 4px;
+                border: 0;
+                color: var(--dynamix-jquery-ui-button-text-color);
+                background:
+                    -webkit-gradient(
+                            linear,
+                            left top,
+                            right top,
+                            from(var(--dynamix-jquery-ui-button-background-start)),
+                            to(var(--dynamix-jquery-ui-button-background-end))
+                        )
+                        0 0 no-repeat,
+                    -webkit-gradient(
+                            linear,
+                            left top,
+                            right top,
+                            from(var(--dynamix-jquery-ui-button-background-start)),
+                            to(var(--dynamix-jquery-ui-button-background-end))
+                        ) 0 100% no-repeat,
+                    -webkit-gradient(
+                            linear,
+                            left bottom,
+                            left top,
+                            from(var(--dynamix-jquery-ui-button-background-start)),
+                            to(var(--dynamix-jquery-ui-button-background-start))
+                        ) 0 100% no-repeat,
+                    -webkit-gradient(
+                            linear,
+                            left bottom,
+                            left top,
+                            from(var(--dynamix-jquery-ui-button-background-end)),
+                            to(var(--dynamix-jquery-ui-button-background-end))
+                        ) 100% 100% no-repeat;
+                background:
+                    linear-gradient(90deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-end)) 0 0 no-repeat,
+                    linear-gradient(90deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-end)) 0 100% no-repeat,
+                    linear-gradient(0deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-start)) 0 100% no-repeat,
+                    linear-gradient(0deg, var(--dynamix-jquery-ui-button-background-end) 0, var(--dynamix-jquery-ui-button-background-end)) 100% 100% no-repeat;
+                background-size:
+                    100% 2px,
+                    100% 2px,
+                    2px 100%,
+                    2px 100%;
+
+                &:hover {
+                    color: var(--dynamix-jquery-ui-button-hover-color);
+                    background: -webkit-gradient(
+                        linear,
+                        left top,
+                        right top,
+                        from(var(--dynamix-jquery-ui-button-background-start)),
+                        to(var(--dynamix-jquery-ui-button-background-end))
+                    );
+                    background: linear-gradient(90deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-end));
+                }
+            }
+        }
+    }
+}
+
+/* Consolidated .ui-dropdownchecklist styles */
+.ui-dropdownchecklist {
+    background-color: transparent;
+    background-image: linear-gradient(66.6deg, transparent 60%, var(--input-border-color) 40%),
+        linear-gradient(113.4deg, var(--input-border-color) 40%, transparent 60%);
+    background-position: calc(100% - 4px), 100%;
    background-size:
-        100% 2px,
-        100% 2px,
-        2px 100%,
-        2px 100%;
-}
-
-.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:hover {
-    color: var(--dynamix-jquery-ui-button-hover-color);
-    background: -webkit-gradient(
-        linear,
-        left top,
-        right top,
-        from(var(--dynamix-jquery-ui-button-background-start)),
-        to(var(--dynamix-jquery-ui-button-background-end))
-    );
-    background: linear-gradient(90deg, var(--dynamix-jquery-ui-button-background-start) 0, var(--dynamix-jquery-ui-button-background-end));
-}
-
-.ui-dropdownchecklist .ui-state-default {
-    background: var(--dynamix-jquery-ui-default-background);
+        4px 6px,
+        4px 6px;
+    background-repeat: no-repeat;
    border: none;
-    box-shadow: none;
+    border-bottom: 1px solid var(--input-border-color);
    outline: none;
+    height: 2.5rem;
+    line-height: 2.5rem;
    cursor: pointer;
-    height: 2.2rem;
-    line-height: 2.2rem;
+
+    .ui-state-default {
+        background: var(--dynamix-jquery-ui-default-background);
+        border: none;
+        box-shadow: none;
+        outline: none;
+        cursor: pointer;
+        height: 2.2rem;
+        line-height: 2.2rem;
+        padding: 0;
+    }
+
+    .ui-widget-content {
+        .ui-state-default {
+            background: var(--dynamix-jquery-ui-default-background);
+        }
+    }
+}
+
+.ui-dropdownchecklist-dropcontainer-wrapper {
+    transform: translateY(-1px);
 }

 .ui-dropdownchecklist-group {
@@ -128,10 +163,12 @@
 }

 .ui-dropdownchecklist-selector {
-    border: 1px solid var(--dynamix-jquery-ui-border-color);
+    border: none;
+    border-bottom: 1px solid var(--dynamix-ui-dropdownchecklist-color);
+    outline: none;
    display: inline-block;
    cursor: pointer;
-    padding: 1px 9px 1px 8px;
+    padding: 1px 0;
 }

 .ui-dropdownchecklist-selector-wrapper {
@@ -139,6 +176,70 @@
    font-size: 0;
 }

+.ui-dropdownchecklist-dropcontainer {
+    color: var(--dynamix-ui-dropdownchecklist-color);
+    background-color: var(--dynamix-ui-dropdownchecklist-color-alt1);
+    border: 1px solid var(--dynamix-jquery-ui-border-color);
+}
+
+.ui-state-disabled {
+    color: var(--dynamix-ui-dropdownchecklist-color);
+    border-bottom-color: var(--dynamix-ui-dropdownchecklist-color-alt2);
+    opacity: 0.5;
+    cursor: default;
+}
+
+.ui-dropdownchecklist-indent {
+    padding-left: 7px;
+}
+
+.ui-dropdownchecklist-text {
+    font-family: clear-sans;
+    font-size: 1.3rem;
+    color: var(--dynamix-ui-dropdownchecklist-color);
+}
+
+.ui-dropdownchecklist-item {
+    height: 2.2rem;
+    line-height: 2.2rem;
+
+    input {
+        vertical-align: top;
+    }
+}
+
+/* Theme-specific styles for sidebar */
+.Theme--sidebar {
+    .ui-dropdownchecklist {
+        height: 3rem;
+        line-height: 3rem;
+        border: 1px solid var(--border-color);
+        background-position: calc(100% - 8px), calc(100% - 4px);
+    }
+
+    .ui-dropdownchecklist-selector {
+        padding: 4px 6px 1px 6px;
+        /* 1px 14px 1px 6px makes the dropdown wider for the share read / write dropdown but
+        IMO not needed because it makes the dropdown too wide when accompany other select inputs */
+    }
+
+    .ui-dropdownchecklist-group {
+        padding: 1px 6px;
+    }
+
+    .ui-dropdownchecklist-dropcontainer {
+        border: 1px solid var(--dynamix-ui-dropdownchecklist-dropcontainer-border-color);
+    }
+
+    .ui-state-disabled {
+        opacity: 0.3;
+    }
+
+    .ui-dropdownchecklist-indent {
+        padding-left: 9px;
+    }
+}
+
 .ui-widget-header {
    border: none;
    background: var(--dynamix-jquery-ui-header-background);
@@ -156,44 +257,21 @@
    background: var(--dynamix-jquery-ui-active-background);
 }

-.ui-dropdownchecklist-dropcontainer {
-    background: var(--dynamix-jquery-ui-dropcontainer-background);
-    border: 1px solid var(--dynamix-jquery-ui-border-color);
-}
+.ui-tailscale {
+    &-row {
+        display: flex;
+        justify-content: space-between;
+        min-width: 300px;
+        width: 100%;
+        flex-wrap: nowrap;
+        overflow-x: auto;
+    }

-.ui-state-disabled {
-    color: var(--dynamix-jquery-ui-disabled-color);
-    border-color: var(--dynamix-jquery-ui-disabled-border-color);
-    background: var(--dynamix-jquery-ui-disabled-background);
-    opacity: 0.5;
-}
+    &-label {
+        flex: 1;
+    }

-.ui-dropdownchecklist-indent {
-    padding-left: 7px;
-}
-
-.ui-dropdownchecklist-text {
-    color: var(--dynamix-jquery-ui-text-color);
-    font-size: 1.3rem;
-}
-
-.ui-dropdownchecklist .ui-widget-content .ui-state-default {
-    background: var(--dynamix-jquery-ui-default-background);
-}
-
-.ui-tailscale-row {
-    display: flex;
-    justify-content: space-between;
-    min-width: 300px;
-    width: 100%;
-    flex-wrap: nowrap;
-    overflow-x: auto;
-}
-
-.ui-tailscale-label {
-    flex: 1;
-}
-
-.ui-tailscale-value {
-    flex: 3;
+    &-value {
+        flex: 3;
+    }
 }
--- a/emhttp/plugins/dynamix/styles/themes/azure.css
+++ b/emhttp/plugins/dynamix/styles/themes/azure.css
@@ -24,7 +24,7 @@

    --background-color: var(--gray-150); /* Originally #e4e2e4 */
    --alt-background-color: var(--gray-700); /* Originally #383a34 */
-    --opac-background-color: var(--gray-895);
+    --opac-background-color: var(--white-opacity-80);
    --mild-background-color: var(--theme-azure--gray-150);
    --usage-bar-background-color: var(--theme-azure--cyan-400);
    --usage-disk-background-color: var(--theme-azure--gray-150);
@@ -85,6 +85,8 @@

    --input-bg-color: var(--mild-background-color);
    --focus-input-bg-color: var(--theme-azure--gray-150);
+
+    --shade-bg-color: var(--theme-azure--gray-150);
    /* /End vars used in default-base */

    /* Set vars for default-dynamix */
--- a/emhttp/plugins/dynamix/styles/themes/black.css
+++ b/emhttp/plugins/dynamix/styles/themes/black.css
@@ -70,7 +70,10 @@

    --input-bg-color: transparent;
    --focus-input-bg-color: var(--mild-background-color);
+
+    --shade-bg-color: var(--gray-800);
    /* /End vars used in default-base */

-    /* dynamix CSS var values set in base-dynamix.css */
+    /* dynamix CSS var values set in default-dynamix.css */
+    --dynamix-filetree-bg-color: var(--gray-900);
 }
--- a/emhttp/plugins/dynamix/styles/themes/gray.css
+++ b/emhttp/plugins/dynamix/styles/themes/gray.css
@@ -81,9 +81,13 @@
    --input-bg-color: var(--theme-gray--black-alt);
    --focus-input-border-color: var(--blue-700);
    --focus-input-background-color: var(--mild-background-color);
+
+    --shade-bg-color: var(--theme-gray--black-alt);
    /* /End vars used in default-base */

    /* Set vars for default-dynamix */
+    --dynamix-filetree-bg-color: var(--gray-900);
+
    --dynamix-ui-dropdownchecklist-color: var(--theme-gray--cyan-300);
    --dynamix-ui-dropdownchecklist-color-alt1: var(--gray-900);
    --dynamix-ui-dropdownchecklist-dropcontainer-border-color: var(--blue-700);
--- a/emhttp/plugins/dynamix/styles/themes/white.css
+++ b/emhttp/plugins/dynamix/styles/themes/white.css
@@ -71,6 +71,8 @@

    --input-bg-color: transparent;
    --focus-input-bg-color: var(--gray-150);
+
+    --shade-bg-color: var(--gray-150);
    /* /End vars used in default-base */

    /* Set vars for default-dynamix */
--- a/etc/rc.d/rc.libvirt
+++ b/etc/rc.d/rc.libvirt
@@ -54,7 +54,7 @@ vmlist(){
  for ARG in ${@: 1}; do
    [[ $ARG == all ]] && STATE="$STATE --all" || STATE="$STATE --state-$ARG"
  done
-  virsh list --uuid $STATE | tail -n +3 | grep -v '^$'
+  virsh list --uuid $STATE | tail -n +1 | grep -v '^$'
 }

 waitfor(){
@@ -348,6 +348,9 @@ case "$1" in
 'status')
  libvirtd_status
  ;;
+'stopvm')
+  stop_running_machines
+  ;;
 *)
  echo "Usage: $BASENAME test|start|stop|restart|status"
  exit 1
--- a/etc/rc.d/rc.wireless
+++ b/etc/rc.d/rc.wireless
@@ -147,6 +147,7 @@ wpa_configuration(){
  [[ -z $2 && -n $CC ]] && echo "country=${CC,,}" >>$WPA
  echo "network={" >>$WPA
  echo "ssid=\"$SSID\"" >>$WPA
+  echo "scan_ssid=1" >>$WPA
  [[ $1 == "PSK" ]] && echo "key_mgmt=WPA-PSK" >>$WPA
  [[ $1 == "SAE" ]] && echo "key_mgmt=SAE" >>$WPA
  [[ $1 =~ "IEEE" && $1 != "IEEE 802.1X/SHA-256" ]] && echo "key_mgmt=WPA-EAP" >>$WPA
@@ -171,56 +172,57 @@ wifi_running(){
 wifi_start(){
  log "Starting $DAEMON..."
  local REPLY
-  if [[ -e $SYSTEM/$PORT ]]; then
-    LINK=shim-$PORT
-    [[ -e $SYSTEM/$LINK ]] || run ip link add link $PORT name $LINK type ipvtap mode l2 bridge
-    run ip link set $PORT up
-    run ip link set $LINK up
-    # set regulatory region (if set) upon start
-    REGION=$(grep -Pom1 '^REGION="\K[^"]+' $CFG)
-    REGION_XX=$(grep -Pom1 '^REGION_XX="\K[^"]+' $CFG)
-    [[ $REGION == '00' ]] && CC=$REGION_XX || CC=$REGION
-    [[ -n $CC ]] && run iw reg set $CC
-    # initialise openssl encryption parameters
-    $OPENSSL load
-    # start active SSID
-    $STARTWIFI
-    if ! carrier_up $PORT; then
-      # try the saved SSIDs
-      for SSID in $(grep -P '^\[.+\]$' $CFG 2>/dev/null | sed 1d | sed -r 's/\[|\]/"/g'); do
-        [[ -n $SSID ]] && $STARTWIFI "$SSID" || break
-        if carrier_up $PORT; then break; fi
-      done
-    fi
-    if wifi_running; then REPLY="Started"; else REPLY="Failed"; fi
-  else
-    REPLY="No Wifi present"
+  if [[ ! -e $SYSTEM/$PORT ]]; then
+    log "$DAEMON...  No Wifi present."
+    return
  fi
+  if [[ $(var WIFI $CFG) != yes ]]; then
+    log "$DAEMON...  Wifi not enabled."
+    return
+  fi
+  LINK=shim-$PORT
+  [[ -e $SYSTEM/$LINK ]] || run ip link add link $PORT name $LINK type ipvtap mode l2 bridge
+  # set regulatory region (if set) upon start
+  REGION=$(var REGION $CFG)
+  REGION_XX=$(var REGION_XX $CFG)
+  [[ $REGION == '00' ]] && CC=$REGION_XX || CC=$REGION
+  [[ -n $CC ]] && run iw reg set $CC
+  # initialise openssl encryption parameters
+  $OPENSSL load
+  # start active SSID
+  $STARTWIFI
+  if ! carrier_up $PORT; then
+    # try the saved SSIDs
+    for SSID in $(grep -P '^\[.+\]$' $CFG | sed 1d | sed -r 's/\[|\]/"/g'); do
+      [[ -n $SSID ]] && $STARTWIFI "$SSID" || break
+      if carrier_up $PORT; then break; fi
+    done
+  fi
+  if wifi_running; then REPLY="Started"; else REPLY="Failed"; fi
  log "$DAEMON...  $REPLY."
 }

 wifi_stop(){
  log "Stopping $DAEMON..."
  local REPLY
-  if [[ -e $SYSTEM/$PORT ]]; then
-    IP=ipv4
-    DHCP=$DHCP4
-    DNS=$DNS4
-    ipaddr_down
-    if [[ -n $DHCP6 ]]; then
-      IP=ipv6
-      DHCP=$DHCP6
-      DNS=$DNS6
-      ipaddr_down
-    fi
-    run pkill wpa_supplicant
-    run iw dev $PORT disconnect
-    run ip addr flush dev $PORT
-    run rm -f $INI
-    if ! wifi_running; then REPLY="Stopped"; else REPLY="Failed"; fi
-  else
-    REPLY="No Wifi present"
+  if [[ ! -e $SYSTEM/$PORT ]]; then
+    log "$DAEMON...  No Wifi present."
+    return
  fi
+  IP=ipv4
+  DHCP=$DHCP4
+  DNS=$DNS4
+  ipaddr_down
+  if [[ -n $DHCP6 ]]; then
+    IP=ipv6
+    DHCP=$DHCP6
+    DNS=$DNS6
+    ipaddr_down
+  fi
+  run pkill wpa_supplicant
+  run iw dev $PORT disconnect
+  run rm -f $INI
+  if ! wifi_running; then REPLY="Stopped"; else REPLY="Failed"; fi
  log "$DAEMON...  $REPLY."
 }