refactor: wip refactor on color scheme, make screenshots suck less, etc.

2025-11-04 22:49:50 -05:00 · 2025-10-06 12:36:40 -04:00 · 2025-10-06 12:36:40 -04:00 · 21969cf5a9
commit 21969cf5a9
parent 0052b00904
8 changed files with 214 additions and 49 deletions
--- a/shell/widgets/OptionSlider.qml
+++ b/shell/widgets/OptionSlider.qml
@ -0,0 +1,98 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import qs
+
+Item {
+    id: root
+
+    property list<string> values
+    property int index: 0
+
+    implicitWidth: 300
+    implicitHeight: 40
+
+    MouseArea {
+        id: mouseArea
+        anchors.fill: parent
+
+        property real halfHandle: handle.width / 2
+        property real activeWidth: groove.width - handle.width
+        property real valueOffset: mouseArea.halfHandle + (root.index / (root.values.length - 1)) * mouseArea.activeWidth
+
+        Repeater {
+            model: root.values
+
+            Item {
+                id: delegate
+                required property int index
+                required property string modelData
+
+                anchors.top: groove.bottom
+                anchors.topMargin: 2
+                x: mouseArea.halfHandle + (delegate.index / (root.values.length - 1)) * mouseArea.activeWidth
+
+                Rectangle {
+                    id: mark
+                    color: ShellSettings.colors.active_translucent
+                    width: 1
+                    height: groove.height
+                }
+
+                Text {
+                    anchors.top: mark.bottom
+
+                    x: delegate.index === 0 ? -4 : delegate.index === root.values.length - 1 ? -this.width + 4 : -(this.width / 2)
+
+                    text: delegate.modelData
+                    color: ShellSettings.colors.active
+                }
+            }
+        }
+
+        Rectangle {
+            id: grooveFill
+
+            anchors {
+                left: groove.left
+                top: groove.top
+                bottom: groove.bottom
+            }
+
+            radius: 5
+            color: ShellSettings.colors.active_translucent
+            width: mouseArea.valueOffset
+        }
+
+        Rectangle {
+            id: groove
+
+            anchors {
+                left: parent.left
+                right: parent.right
+            }
+
+            y: 5
+            implicitHeight: 7
+            color: "transparent"
+            border.color: ShellSettings.colors.active_translucent
+            border.width: 1
+            radius: 5
+        }
+
+        Rectangle {
+            id: handle
+            anchors.verticalCenter: groove.verticalCenter
+            height: 15
+            width: height
+            radius: height * 0.5
+            x: mouseArea.valueOffset - width * 0.5
+        }
+    }
+
+    Binding {
+        when: mouseArea.pressed
+        root.index: Math.max(0, Math.min(root.values.length - 1, Math.round((mouseArea.mouseX / root.width) * (root.values.length - 1))))
+        restoreMode: Binding.RestoreBinding
+    }
+}