From 01f4ecf90f47bb0c4d3c3a9690ee04c0c6f3b7b8 Mon Sep 17 00:00:00 2001
From: Benjamin Palko <benjaminpalko@hotmail.com>
Date: Wed, 27 Aug 2025 11:34:56 -0400
Subject: [PATCH] styled slider

---
 components/StyledSlider.qml     | 26 ++++++++++++++++++++++++++
 modules/storybook/Storybook.qml | 13 +++++++++++++
 2 files changed, 39 insertions(+)
 create mode 100644 components/StyledSlider.qml

diff --git a/components/StyledSlider.qml b/components/StyledSlider.qml
new file mode 100644
index 0000000..343cc6e
--- /dev/null
+++ b/components/StyledSlider.qml
@@ -0,0 +1,26 @@
+import qs.config
+import QtQuick
+import QtQuick.Controls
+
+Slider {
+    id: control
+
+    background: Rectangle {
+        x: control.leftPadding
+        y: control.topPadding + control.availableHeight / 2 - height / 2
+        implicitWidth: 200
+        implicitHeight: 24
+        width: control.availableWidth
+        height: implicitHeight
+        radius: 8
+        color: Theme.palette.base100
+
+        Rectangle {
+            width: control.visualPosition * parent.width
+            height: parent.height
+            color: Theme.palette.primary
+            radius: 8
+        }
+    }
+    handle: null
+}
diff --git a/modules/storybook/Storybook.qml b/modules/storybook/Storybook.qml
index 08f9538..f2565dc 100644
--- a/modules/storybook/Storybook.qml
+++ b/modules/storybook/Storybook.qml
@@ -69,6 +69,19 @@ StyledWindow {
                 }
             }
 
+            ColumnLayout {
+                StyledText {
+                    text: "Slider"
+                    font.pixelSize: 18
+                }
+                StyledSlider {
+                    id: slider
+                    from: 0
+                    to: 100
+                    value: 50
+                }
+            }
+
             ColumnLayout {
                 StyledText {
                     text: "Drawer"