diff --git a/Modals/Settings/SettingsSidebar.qml b/Modals/Settings/SettingsSidebar.qml index 30ef4360..6b717a87 100644 --- a/Modals/Settings/SettingsSidebar.qml +++ b/Modals/Settings/SettingsSidebar.qml @@ -58,84 +58,93 @@ Rectangle { color: Theme.surfaceContainer radius: Theme.cornerRadius - Column { + DankFlickable { anchors.fill: parent - anchors.leftMargin: Theme.spacingS - anchors.rightMargin: Theme.spacingS - anchors.bottomMargin: Theme.spacingS - anchors.topMargin: Theme.spacingM + 2 - spacing: Theme.spacingXS + clip: true + contentHeight: sidebarColumn.implicitHeight - ProfileSection { - parentModal: sidebarContainer.parentModal - } + Column { + id: sidebarColumn - Rectangle { - width: parent.width - Theme.spacingS * 2 - height: 1 - color: Theme.outline - opacity: 0.2 - } - - Item { width: parent.width - height: Theme.spacingL - } + anchors.leftMargin: Theme.spacingS + anchors.rightMargin: Theme.spacingS + anchors.bottomMargin: Theme.spacingS + anchors.topMargin: Theme.spacingM + 2 + spacing: Theme.spacingXS - Repeater { - id: sidebarRepeater - - model: sidebarContainer.sidebarItems - - delegate: Rectangle { - required property int index - required property var modelData - - property bool isActive: sidebarContainer.currentIndex === index + ProfileSection { + parentModal: sidebarContainer.parentModal + } + Rectangle { width: parent.width - Theme.spacingS * 2 - height: 44 - radius: Theme.cornerRadius - color: isActive ? Theme.primary : tabMouseArea.containsMouse ? Theme.surfaceHover : "transparent" + height: 1 + color: Theme.outline + opacity: 0.2 + } - Row { - anchors.left: parent.left - anchors.leftMargin: Theme.spacingM - anchors.verticalCenter: parent.verticalCenter - spacing: Theme.spacingM + Item { + width: parent.width + height: Theme.spacingL + } - DankIcon { - name: modelData.icon || "" - size: Theme.iconSize - 2 - color: parent.parent.isActive ? Theme.primaryText : Theme.surfaceText + Repeater { + id: sidebarRepeater + + model: sidebarContainer.sidebarItems + + delegate: Rectangle { + required property int index + required property var modelData + + property bool isActive: sidebarContainer.currentIndex === index + + width: sidebarColumn.width - Theme.spacingS * 2 + height: 44 + radius: Theme.cornerRadius + color: isActive ? Theme.primary : tabMouseArea.containsMouse ? Theme.surfaceHover : "transparent" + + Row { + anchors.left: parent.left + anchors.leftMargin: Theme.spacingM anchors.verticalCenter: parent.verticalCenter + spacing: Theme.spacingM + + DankIcon { + name: modelData.icon || "" + size: Theme.iconSize - 2 + color: parent.parent.isActive ? Theme.primaryText : Theme.surfaceText + anchors.verticalCenter: parent.verticalCenter + } + + StyledText { + text: modelData.text || "" + font.pixelSize: Theme.fontSizeMedium + color: parent.parent.isActive ? Theme.primaryText : Theme.surfaceText + font.weight: parent.parent.isActive ? Font.Medium : Font.Normal + anchors.verticalCenter: parent.verticalCenter + } + } - StyledText { - text: modelData.text || "" - font.pixelSize: Theme.fontSizeMedium - color: parent.parent.isActive ? Theme.primaryText : Theme.surfaceText - font.weight: parent.parent.isActive ? Font.Medium : Font.Normal - anchors.verticalCenter: parent.verticalCenter + MouseArea { + id: tabMouseArea + + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.PointingHandCursor + onClicked: () => { + sidebarContainer.currentIndex = index; + } } - } + Behavior on color { + ColorAnimation { + duration: Theme.shortDuration + easing.type: Theme.standardEasing + } - MouseArea { - id: tabMouseArea - - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.PointingHandCursor - onClicked: () => { - sidebarContainer.currentIndex = index; - } - } - - Behavior on color { - ColorAnimation { - duration: Theme.shortDuration - easing.type: Theme.standardEasing } }