From ac242797999b70c2f199453f58a797abd292ddfc Mon Sep 17 00:00:00 2001
From: Benjamin Palko <benjaminpalko@hotmail.com>
Date: Sun, 31 Aug 2025 18:49:03 -0400
Subject: [PATCH] basic menu styling

---
 components/StyledMenu.qml       | 12 ++++++++++++
 components/StyledMenuItem.qml   |  9 +++++++++
 modules/storybook/Storybook.qml | 30 ++++++++++++++++++++++++++++++
 3 files changed, 51 insertions(+)
 create mode 100644 components/StyledMenu.qml
 create mode 100644 components/StyledMenuItem.qml

diff --git a/components/StyledMenu.qml b/components/StyledMenu.qml
new file mode 100644
index 0000000..a9f48f7
--- /dev/null
+++ b/components/StyledMenu.qml
@@ -0,0 +1,12 @@
+import qs.config
+import QtQuick
+import QtQuick.Controls
+
+Menu {
+    id: root
+
+    palette.window: Theme.palette.base100
+    palette.base: Theme.palette.base100
+
+    closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
+}
diff --git a/components/StyledMenuItem.qml b/components/StyledMenuItem.qml
new file mode 100644
index 0000000..fe078d2
--- /dev/null
+++ b/components/StyledMenuItem.qml
@@ -0,0 +1,9 @@
+import qs.config
+import QtQuick
+import QtQuick.Controls
+
+MenuItem {
+    palette.text: Theme.palette.basecontent
+    palette.highlight: Theme.palette.primary
+    palette.highlightedText: Theme.palette.primarycontent
+}
diff --git a/modules/storybook/Storybook.qml b/modules/storybook/Storybook.qml
index fdb308f..be143ed 100644
--- a/modules/storybook/Storybook.qml
+++ b/modules/storybook/Storybook.qml
@@ -114,6 +114,36 @@ StyledWindow {
                 }
             }
 
+            ColumnLayout {
+                StyledText {
+                    text: "Menu"
+                    font.pixelSize: 18
+                }
+                Button {
+                    id: fileButton
+                    text: "File"
+                    onPressed: menu.visible ? menu.close() : menu.open()
+
+                    StyledMenu {
+                        id: menu
+                        y: fileButton.height
+
+                        StyledMenuItem {
+                            text: "New..."
+                        }
+                        StyledMenuItem {
+                            text: "Open..."
+                        }
+                        StyledMenuItem {
+                            text: "Save"
+                        }
+                        StyledMenuItem {
+                            text: "Close"
+                        }
+                    }
+                }
+            }
+
             ColumnLayout {
                 StyledText {
                     text: "Drawer"