menue

public/assets/desktop/desktop.css

@@ -310,6 +310,7 @@ h1 {
     bottom: 102px;
     z-index: 90;
     display: grid;
+    align-content: start;
     grid-template-columns: minmax(240px, 280px) minmax(280px, 360px);
     gap: 16px;
     width: min(720px, calc(100% - 48px));
@@ -321,12 +322,35 @@ h1 {
     backdrop-filter: blur(24px);
 }
 
+.start-menu-header {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: 16px;
+    grid-column: 1 / -1;
+    padding-bottom: 10px;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+}
+
+.start-menu-header h2 {
+    margin-bottom: 0;
+}
+
 .start-menu-column,
 .start-menu-block {
     display: grid;
     gap: 12px;
 }
 
+.start-menu-close {
+    border: 0;
+    border-radius: 999px;
+    padding: 10px 14px;
+    background: rgba(255, 255, 255, 0.12);
+    color: inherit;
+    cursor: pointer;
+}
+
 .start-menu-entry {
     display: grid;
     grid-template-columns: 44px minmax(0, 1fr) auto;
@@ -342,6 +366,11 @@ h1 {
     cursor: pointer;
 }
 
+.start-menu-entry:hover,
+.start-menu-close:hover {
+    background: rgba(255, 255, 255, 0.18);
+}
+
 .start-menu-entry strong,
 .start-menu-entry span {
     display: block;

public/assets/desktop/desktop.js

@@ -8,6 +8,7 @@ if (payloadNode) {
     const taskbarRoot = document.getElementById('taskbar-apps');
     const startButton = document.getElementById('start-button');
     const startMenu = document.getElementById('start-menu');
+    const startMenuClose = document.getElementById('start-menu-close');
     const startMenuApps = document.getElementById('start-menu-apps');
     const startMenuWidgets = document.getElementById('start-menu-widgets');
     const startMenuActions = document.getElementById('start-menu-actions');
@@ -439,6 +440,10 @@ if (payloadNode) {
         startButton.setAttribute('aria-expanded', String(willOpen));
     });
 
+    startMenuClose?.addEventListener('click', () => {
+        closeStartMenu();
+    });
+
     document.addEventListener('click', (event) => {
         if (!startMenu || startMenu.hidden) {
             return;