spoiler for mouse settings

web/kvm/index.html

@@ -250,6 +250,9 @@
               </tr>
             </table>
           </div>
+          <details>
+            <summary>Mouse settings</summary>
+            <div class="spoiler">
               <table class="kv">
                 <tr>
                   <td>Mouse polling rate:</td>
@@ -283,6 +286,10 @@
                         </div>
                       </td>
                 </tr>
+              </table>
+            </div>
+          </details>
+          <table class="kv">
             <tr class="feature-disabled" id="hid-connect">
                   <td>Connect HID to Server:</td>
                   <td align="right">

web/kvm/navbar-system.pug

@@ -64,6 +64,9 @@ li(class="right")
 				tr(id="hid-outputs-mouse", class="feature-disabled")
 					td Mouse #[a(target="_blank" href="https://docs.pikvm.org/mouse") mode]:
 					td #[div(id="hid-outputs-mouse-box" class="radio-box")]
+		details
+			summary Mouse settings
+			div(class="spoiler")
 				table(class="kv")
 					tr
 						td Mouse polling rate:
@@ -77,6 +80,7 @@ li(class="right")
 						+menu_switch_notable("hid-mouse-squash-switch", "Squash relative mouse moves", true, true)
 					tr
 						+menu_switch_notable("hid-mouse-reverse-scrolling-switch", "Reverse mouse scrolling", true, false)
+		table(class="kv")
 			tr(id="hid-connect" class="feature-disabled")
 				+menu_switch_notable("hid-connect-switch", "Connect HID to Server", true, true)
 			tr

web/share/css/navbar.css

@@ -127,9 +127,16 @@ ul#navbar li div.menu details summary {
 	cursor: pointer;
 	outline: none;
 	text-decoration: underline;
-	margin: 0 15px 0 15px;
+	margin: 8px 15px 8px 15px;
 	font-size: 12px;
 }
+ul#navbar li div.menu details div.spoiler {
+	margin-left: 20px !important;
+	border-left: var(--border-default-thin);
+}
+ul#navbar li div.menu details summary::marker {
+	color: var(--cs-marker-fg);
+}
 
 ul#navbar li div.menu div.buttons {
 	background-color: var(--cs-control-default-bg);

web/share/css/vars.css

@@ -66,6 +66,7 @@
 	--cs-key-pressed-fg: #6c7481;
 	--cs-key-holded-bg: #436a8a;
 
+	--cs-marker-fg: #5b90bb;
 	--cs-corner-bg: #5b90bb;
 
 	--shadow-micro: 1px 2px 4px 0 rgba(0, 0, 0, 0.4);