fix(ui): resolve ui inconsistencies and missing i18n strings (#2719)

* Update WorkspacesTab.qml

* Update SettingsButtonGroupRow.qml

* Update WallpaperTab.qml

* Update WidgetsTabSection.qml

* add missing tooltips

* Update WallpaperTab.qml

* Update WorkspacesTab.qml

quickshell/Modules/Settings/DankDashTab.qml

@@ -12,6 +12,10 @@ Item {
     focus: true
     property string highlightedId: ""
 
+    DankTooltipV2 {
+        id: sharedTooltip
+    }
+
     readonly property var __presentation: ({
             "overview": {
                 "icon": "dashboard",
@@ -261,6 +265,12 @@ Item {
                                 hoverEnabled: true
                                 cursorShape: Qt.PointingHandCursor
                                 onClicked: SettingsData.resetDashTabs()
+                                onEntered: {
+                                    sharedTooltip.show(I18n.tr("Reset"), resetButton, 0, 0, "bottom");
+                                }
+                                onExited: {
+                                    sharedTooltip.hide();
+                                }
                             }
 
                             Behavior on color {
@@ -528,6 +538,13 @@ Item {
                                             root.highlightedId = rowItem.modelData;
                                             SettingsData.setDashTabEnabled(rowItem.modelData, !rowItem.isEnabled);
                                         }
+                                        onEntered: {
+                                            const tooltipText = rowItem.isEnabled ? I18n.tr("Hide") : I18n.tr("Show");
+                                            sharedTooltip.show(tooltipText, visibilityButton, 0, 0, "bottom");
+                                        }
+                                        onExited: {
+                                            sharedTooltip.hide();
+                                        }
                                     }
                                 }
                             }

quickshell/Modules/Settings/WallpaperTab.qml

@@ -302,54 +302,109 @@ Item {
 
                 Item {
                     width: parent.width
-                    height: fillModeGroup.height
+                    height: fillModeColumn.height
                     visible: root.currentWallpaper !== "" && !root.currentWallpaper.startsWith("#")
 
-                    DankButtonGroup {
+                    Column {
-                        id: fillModeGroup
+                        id: fillModeColumn
-                        property var internalModes: ["Stretch", "Fit", "Fill", "Scrolling", "Tile", "TileVertically", "TileHorizontally", "Pad"]
                         anchors.horizontalCenter: parent.horizontalCenter
-                        model: [I18n.tr("Stretch", "wallpaper fill mode"), I18n.tr("Fit", "wallpaper fill mode"), I18n.tr("Fill", "wallpaper fill mode"), I18n.tr("Scroll", "wallpaper fill mode"), I18n.tr("Tile", "wallpaper fill mode"), I18n.tr("Tile V", "wallpaper fill mode"), I18n.tr("Tile H", "wallpaper fill mode"), I18n.tr("Pad", "wallpaper fill mode")]
+                        spacing: Theme.spacingS
-                        selectionMode: "single"
+
-                        buttonHeight: 28
+                        property var firstRowModes: ["Stretch", "Fit", "Fill", "Scrolling"]
-                        minButtonWidth: 48
+                        property var secondRowModes: ["Tile", "TileVertically", "TileHorizontally", "Pad"]
-                        buttonPadding: Theme.spacingS
+
-                        checkIconSize: 0
+                        function currentMode() {
-                        textSize: Theme.fontSizeSmall
+                            return SessionData.perMonitorWallpaper ? SessionData.getMonitorWallpaperFillMode(selectedMonitorName) : SettingsData.wallpaperFillMode;
-                        checkEnabled: false
-                        currentIndex: {
-                            var mode = SessionData.perMonitorWallpaper ? SessionData.getMonitorWallpaperFillMode(selectedMonitorName) : SettingsData.wallpaperFillMode;
-                            return internalModes.indexOf(mode);
                         }
-                        onSelectionChanged: (index, selected) => {
+
-                            if (!selected)
+                        function selectMode(mode) {
-                                return;
                             if (SessionData.perMonitorWallpaper) {
-                                SessionData.setMonitorWallpaperFillMode(selectedMonitorName, internalModes[index]);
+                                SessionData.setMonitorWallpaperFillMode(selectedMonitorName, mode);
                             } else {
-                                SettingsData.set("wallpaperFillMode", internalModes[index]);
+                                SettingsData.set("wallpaperFillMode", mode);
                             }
                         }
 
-                        Connections {
+                        DankButtonGroup {
-                            target: SettingsData
+                            id: fillModeGroupFirstRow
-                            function onWallpaperFillModeChanged() {
+                            property var internalModes: fillModeColumn.firstRowModes
-                                if (SessionData.perMonitorWallpaper)
+                            anchors.horizontalCenter: parent.horizontalCenter
+                            model: [I18n.tr("Stretch", "wallpaper fill mode"), I18n.tr("Fit", "wallpaper fill mode"), I18n.tr("Fill", "wallpaper fill mode"), I18n.tr("Scroll", "wallpaper fill mode")]
+                            selectionMode: "single"
+                            buttonHeight: 28
+                            minButtonWidth: 48
+                            buttonPadding: Theme.spacingS
+                            checkIconSize: 0
+                            textSize: Theme.fontSizeSmall
+                            checkEnabled: false
+                            currentIndex: {
+                                var mode = fillModeColumn.currentMode();
+                                var idx = internalModes.indexOf(mode);
+                                return idx >= 0 ? idx : -1;
+                            }
+                            onSelectionChanged: (index, selected) => {
+                                if (!selected)
                                     return;
-                                fillModeGroup.currentIndex = fillModeGroup.internalModes.indexOf(SettingsData.wallpaperFillMode);
+                                fillModeColumn.selectMode(internalModes[index]);
                             }
                         }
 
-                        Connections {
+                        DankButtonGroup {
-                            target: root
+                            id: fillModeGroupSecondRow
-                            function onSelectedMonitorNameChanged() {
+                            property var internalModes: fillModeColumn.secondRowModes
-                                if (!SessionData.perMonitorWallpaper)
+                            anchors.horizontalCenter: parent.horizontalCenter
-                                    return;
+                            model: [I18n.tr("Tile", "wallpaper fill mode"), I18n.tr("Tile V", "wallpaper fill mode"), I18n.tr("Tile H", "wallpaper fill mode"), I18n.tr("Pad", "wallpaper fill mode")]
-                                fillModeGroup.currentIndex = Qt.binding(() => {
+                            selectionMode: "single"
-                                    var mode = SessionData.perMonitorWallpaper ? SessionData.getMonitorWallpaperFillMode(selectedMonitorName) : SettingsData.wallpaperFillMode;
+                            buttonHeight: 28
-                                    return fillModeGroup.internalModes.indexOf(mode);
+                            minButtonWidth: 48
-                                });
+                            buttonPadding: Theme.spacingS
+                            checkIconSize: 0
+                            textSize: Theme.fontSizeSmall
+                            checkEnabled: false
+                            currentIndex: {
+                                var mode = fillModeColumn.currentMode();
+                                var idx = internalModes.indexOf(mode);
+                                return idx >= 0 ? idx : -1;
                             }
+                            onSelectionChanged: (index, selected) => {
+                                if (!selected)
+                                    return;
+                                fillModeColumn.selectMode(internalModes[index]);
+                            }
+                        }
+                    }
+
+                    Connections {
+                        target: SettingsData
+                        function onWallpaperFillModeChanged() {
+                            if (SessionData.perMonitorWallpaper)
+                                return;
+                            fillModeGroupFirstRow.currentIndex = Qt.binding(() => {
+                                var idx = fillModeGroupFirstRow.internalModes.indexOf(SettingsData.wallpaperFillMode);
+                                return idx >= 0 ? idx : -1;
+                            });
+                            fillModeGroupSecondRow.currentIndex = Qt.binding(() => {
+                                var idx = fillModeGroupSecondRow.internalModes.indexOf(SettingsData.wallpaperFillMode);
+                                return idx >= 0 ? idx : -1;
+                            });
+                        }
+                    }
+
+                    Connections {
+                        target: root
+                        function onSelectedMonitorNameChanged() {
+                            if (!SessionData.perMonitorWallpaper)
+                                return;
+                            fillModeGroupFirstRow.currentIndex = Qt.binding(() => {
+                                var mode = SessionData.getMonitorWallpaperFillMode(selectedMonitorName);
+                                var idx = fillModeGroupFirstRow.internalModes.indexOf(mode);
+                                return idx >= 0 ? idx : -1;
+                            });
+                            fillModeGroupSecondRow.currentIndex = Qt.binding(() => {
+                                var mode = SessionData.getMonitorWallpaperFillMode(selectedMonitorName);
+                                var idx = fillModeGroupSecondRow.internalModes.indexOf(mode);
+                                return idx >= 0 ? idx : -1;
+                            });
                         }
                     }
                 }
@@ -373,7 +428,7 @@ Item {
                         },
                         {
                             "value": "primary",
-                            "label": I18n.tr("Primary Theme Color")
+                            "label": I18n.tr("Primary")
                         },
                         {
                             "value": "surface",

quickshell/Modules/Settings/Widgets/SettingsButtonGroupRow.qml

@@ -78,7 +78,7 @@ Item {
     signal selectionChanged(int index, bool selected)
 
     width: parent?.width ?? 0
-    height: 60
+    height: Math.max(60, textColumn.implicitHeight + Theme.spacingM * 2)
 
     Row {
         id: contentRow
@@ -88,6 +88,7 @@ Item {
         spacing: Theme.spacingM
 
         Column {
+            id: textColumn
             width: parent.width - buttonGroup.width - Theme.spacingM
             anchors.verticalCenter: parent.verticalCenter
             spacing: Theme.spacingXS

quickshell/Modules/Settings/Widgets/SettingsSliderCard.qml

@@ -26,6 +26,11 @@ StyledRect {
 
     signal sliderValueChanged(int newValue)
     signal sliderDragFinished(int finalValue)
+
+    DankTooltipV2 {
+        id: sharedTooltip
+    }
+
     width: parent?.width ?? 0
     height: Theme.spacingL * 2 + contentColumn.height
     radius: Theme.cornerRadius
@@ -121,6 +126,12 @@ StyledRect {
                     root.sliderValueChanged(root.defaultValue);
                     root.sliderDragFinished(root.defaultValue);
                 }
+                onEntered: {
+                    sharedTooltip.show(I18n.tr("Reset"), resetButton, 0, 0, "bottom");
+                }
+                onExited: {
+                    sharedTooltip.hide();
+                }
             }
         }
 

quickshell/Modules/Settings/Widgets/SettingsSliderRow.qml

@@ -72,6 +72,11 @@ Item {
 
     signal sliderValueChanged(int newValue)
     signal sliderDragFinished(int finalValue)
+
+    DankTooltipV2 {
+        id: sharedTooltip
+    }
+
     width: parent?.width ?? 0
     height: headerRow.height + Theme.spacingXS + slider.height
 
@@ -135,6 +140,12 @@ Item {
                         root.sliderValueChanged(root.defaultValue);
                         root.sliderDragFinished(root.defaultValue);
                     }
+                    onEntered: {
+                        sharedTooltip.show(I18n.tr("Reset"), resetButton, 0, 0, "bottom");
+                    }
+                    onExited: {
+                        sharedTooltip.hide();
+                    }
                 }
             }
         }

quickshell/Modules/Settings/WidgetsTabSection.qml

@@ -57,12 +57,30 @@ Column {
     readonly property real rowHeight: 72
     readonly property real rowSpacing: Theme.spacingS
 
+    property var rowHeights: []
+
+    function rowHeightAt(i) {
+        if (i < 0 || i >= rowHeights.length || rowHeights[i] === undefined)
+            return rowHeight;
+        return Math.max(rowHeight, rowHeights[i]);
+    }
+
+    function cumulativeHeightUpTo(pos) {
+        var y = 0;
+        var n = Math.min(pos, items.length);
+        for (var i = 0; i < n; i++)
+            y += rowHeightAt(i) + rowSpacing;
+        return y;
+    }
+
     readonly property real totalHeight: {
         const n = items.length;
-        let base = n * (rowHeight + rowSpacing);
+        let base = cumulativeHeightUpTo(n);
+        if (n > 0)
+            base -= rowSpacing;
         if (gapIndex >= 0)
             base += (rowHeight + rowSpacing);
-        return Math.max(0, base - rowSpacing);
+        return Math.max(0, base);
     }
 
     function resetWorkingOrder() {
@@ -76,15 +94,21 @@ Column {
         var pos = workingOrder.indexOf(i);
         if (pos < 0)
             pos = i;
-        var y = pos * (rowHeight + rowSpacing);
+        var y = cumulativeHeightUpTo(pos);
         if (gapIndex >= 0 && pos >= gapIndex)
             y += (rowHeight + rowSpacing);
         return y;
     }
 
     function slotIndexForY(localY) {
-        var idx = Math.round(localY / (rowHeight + rowSpacing));
+        var y = 0;
-        return Math.max(0, Math.min(idx, items.length));
+        for (var i = 0; i < items.length; i++) {
+            var h = rowHeightAt(i) + rowSpacing;
+            if (y + h / 2 > localY)
+                return i;
+            y += h;
+        }
+        return items.length;
     }
 
     function slotIndexForGlobalY(rootItem, gy) {
@@ -102,7 +126,7 @@ Column {
     function updateDragTarget(centerY) {
         if (draggingIndex < 0)
             return;
-        var pos = Math.floor(centerY / (rowHeight + rowSpacing));
+        var pos = slotIndexForY(centerY);
         pos = Math.max(0, Math.min(pos, items.length - 1));
         var arr = workingOrder.slice();
         var d = arr.indexOf(draggingIndex);
@@ -201,10 +225,27 @@ Column {
                 readonly property bool highlighted: root.highlightedId !== "" && root.highlightedId === modelData.id && root.highlightedSection === root.sectionId
 
                 width: reorderArea.width
-                height: root.rowHeight
+                height: Math.max(root.rowHeight, textColumn.implicitHeight + 28)
                 z: dragging ? 100 : (highlighted ? 3 : 1)
                 opacity: (dragging && root.crossSectionActive) ? 0 : 1
 
+                onHeightChanged: {
+                    var arr = root.rowHeights.slice();
+                    while (arr.length <= rowIndex)
+                        arr.push(root.rowHeight);
+                    if (arr[rowIndex] !== height) {
+                        arr[rowIndex] = height;
+                        root.rowHeights = arr;
+                    }
+                }
+                Component.onCompleted: {
+                    var arr = root.rowHeights.slice();
+                    while (arr.length <= rowIndex)
+                        arr.push(root.rowHeight);
+                    arr[rowIndex] = height;
+                    root.rowHeights = arr;
+                }
+
                 Binding {
                     target: delegateItem
                     property: "y"
@@ -235,13 +276,12 @@ Column {
                     id: itemBackground
 
                     anchors.fill: parent
-                    anchors.margins: 2
                     scale: delegateItem.dragging ? 1.02 : 1.0
                     transformOrigin: Item.Center
                     radius: delegateItem.dragging ? Theme.cornerRadius + 6 : Theme.cornerRadius
-                    color: delegateItem.dragging ? Theme.secondaryContainer : Theme.withAlpha(Theme.surfaceContainer, 0.8)
+                    color: delegateItem.dragging ? Theme.secondaryContainer : Theme.withAlpha(Theme.surfaceContainer, modelData.enabled ? 0.7 : 0.4)
                     border.color: delegateItem.dragging ? Theme.primary : Theme.outlineHeavy
-                    border.width: delegateItem.dragging ? 2 : 0
+                    border.width: delegateItem.dragging ? 2 : 1
 
                     Behavior on scale {
                         NumberAnimation {
@@ -266,29 +306,61 @@ Column {
                         }
                     }
 
-                    DankIcon {
+                    Rectangle {
-                        name: "drag_indicator"
+                        anchors.fill: parent
-                        size: Theme.iconSize - 4
+                        radius: parent.radius
-                        color: Theme.outline
+                        color: Theme.primary
-                        anchors.left: parent.left
+                        opacity: (dragArea.containsMouse && !delegateItem.dragging) ? 0.06 : 0
-                        anchors.leftMargin: Theme.spacingM + 8
+                        Behavior on opacity {
-                        anchors.verticalCenter: parent.verticalCenter
+                            NumberAnimation {
-                        opacity: 0.8
+                                duration: Theme.shortDuration
+                            }
+                        }
                     }
 
                     DankIcon {
+                        id: dragHandle
+                        name: "drag_indicator"
+                        size: Theme.iconSize - 4
+                        color: delegateItem.dragging ? Theme.primary : Theme.outline
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingM
+                        anchors.verticalCenter: parent.verticalCenter
+                        opacity: modelData.enabled ? ((dragArea.containsMouse || delegateItem.dragging || delegateItem.highlighted) ? 1.0 : 0.45) : 0
+                        visible: opacity > 0.01
+
+                        Behavior on opacity {
+                            NumberAnimation {
+                                duration: Theme.shortDuration
+                            }
+                        }
+                        Behavior on color {
+                            ColorAnimation {
+                                duration: Theme.shortDuration
+                            }
+                        }
+                    }
+
+                    DankIcon {
+                        id: tabIcon
                         name: modelData.icon
                         size: Theme.iconSize
                         color: modelData.enabled ? Theme.primary : Theme.outline
                         anchors.left: parent.left
-                        anchors.leftMargin: Theme.spacingM * 2 + 40
+                        anchors.leftMargin: Theme.spacingM * 2 + Theme.iconSize - 4
                         anchors.verticalCenter: parent.verticalCenter
+
+                        Behavior on color {
+                            ColorAnimation {
+                                duration: Theme.shortDuration
+                            }
+                        }
                     }
 
                     Column {
                         id: textColumn
-                        anchors.left: parent.left
+                        anchors.left: tabIcon.right
-                        anchors.leftMargin: Theme.spacingM * 3 + 40 + Theme.iconSize
+                        anchors.leftMargin: Theme.spacingM
                         anchors.right: actionButtons.left
                         anchors.rightMargin: Theme.spacingM
                         anchors.verticalCenter: parent.verticalCenter
@@ -339,6 +411,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), gpuMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 gpuContextMenu.widgetData = modelData;
                                 gpuContextMenu.sectionId = root.sectionId;
@@ -405,6 +483,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), diskMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 diskUsageContextMenu.widgetData = modelData;
                                 diskUsageContextMenu.sectionId = root.sectionId;
@@ -496,7 +580,7 @@ Column {
                             }
                             onEntered: {
                                 var currentEnabled = modelData.minimumWidth !== undefined ? modelData.minimumWidth : true;
-                                const tooltipText = currentEnabled ? "Force Padding" : "Dynamic Width";
+                                const tooltipText = currentEnabled ? I18n.tr("Force Padding") : I18n.tr("Dynamic Width");
                                 sharedTooltip.show(tooltipText, minimumWidthButton, 0, 0, "bottom");
                             }
                             onExited: {
@@ -515,7 +599,7 @@ Column {
                                 root.hideWhenIdleChanged(root.sectionId, index, modelData.hideWhenIdle !== true);
                             }
                             onEntered: {
-                                const tooltipText = modelData.hideWhenIdle === true ? "Hide when no updates: ON" : "Hide when no updates: OFF";
+                                const tooltipText = modelData.hideWhenIdle === true ? I18n.tr("Hide when no updates: ON") : I18n.tr("Hide when no updates: OFF");
                                 sharedTooltip.show(tooltipText, hideWhenIdleButton, 0, 0, "bottom");
                             }
                             onExited: {
@@ -530,6 +614,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), memMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 memUsageContextMenu.widgetData = modelData;
                                 memUsageContextMenu.sectionId = root.sectionId;
@@ -564,6 +654,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), focusedWindowMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 focusedWindowContextMenu.widgetData = modelData;
                                 focusedWindowContextMenu.sectionId = root.sectionId;
@@ -597,6 +693,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), musicMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 musicContextMenu.widgetData = modelData;
                                 musicContextMenu.sectionId = root.sectionId;
@@ -630,6 +732,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), runningAppsMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 runningAppsContextMenu.widgetData = modelData;
                                 runningAppsContextMenu.sectionId = root.sectionId;
@@ -663,6 +771,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), batteryMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 batteryContextMenu.widgetData = modelData;
                                 batteryContextMenu.sectionId = root.sectionId;
@@ -748,7 +862,7 @@ Column {
                                                 return false;
                                             }
                                         })();
-                                    const tooltipText = isCompact ? "Full Size" : "Compact";
+                                    const tooltipText = isCompact ? I18n.tr("Full Size") : I18n.tr("Compact");
                                     sharedTooltip.show(tooltipText, compactModeButton, 0, 0, "bottom");
                                 }
                                 onExited: {
@@ -764,6 +878,12 @@ Column {
                                 iconSize: 18
                                 iconColor: Theme.outline
 
+                                onEntered: {
+                                    sharedTooltip.show(I18n.tr("Options"), kbdLayoutCtxMenuButton, 0, 0, "bottom");
+                                }
+                                onExited: {
+                                    sharedTooltip.hide();
+                                }
                                 onClicked: {
                                     kbdLayoutCtxMenu.widgetData = modelData;
                                     kbdLayoutCtxMenu.sectionId = root.sectionId;
@@ -797,6 +917,12 @@ Column {
                                 iconName: "more_vert"
                                 iconSize: 18
                                 iconColor: Theme.outline
+                                onEntered: {
+                                    sharedTooltip.show(I18n.tr("Options"), appsDockMenuButton, 0, 0, "bottom");
+                                }
+                                onExited: {
+                                    sharedTooltip.hide();
+                                }
                                 onClicked: {
                                     appsDockContextMenu.widgetData = modelData;
                                     appsDockContextMenu.sectionId = root.sectionId;
@@ -830,6 +956,12 @@ Column {
                                 iconName: "more_vert"
                                 iconSize: 18
                                 iconColor: Theme.outline
+                                onEntered: {
+                                    sharedTooltip.show(I18n.tr("Options"), trayMenuButton, 0, 0, "bottom");
+                                }
+                                onExited: {
+                                    sharedTooltip.hide();
+                                }
                                 onClicked: {
                                     trayContextMenu.widgetData = modelData;
                                     trayContextMenu.sectionId = root.sectionId;
@@ -894,6 +1026,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), ccMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 controlCenterContextMenu.widgetData = modelData;
                                 controlCenterContextMenu.sectionId = root.sectionId;
@@ -929,6 +1067,12 @@ Column {
                             iconName: "more_vert"
                             iconSize: 18
                             iconColor: Theme.outline
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Options"), privacyMenuButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                             onClicked: {
                                 privacyContextMenu.widgetData = modelData;
                                 privacyContextMenu.sectionId = root.sectionId;
@@ -967,7 +1111,7 @@ Column {
                                 root.itemEnabledChanged(root.sectionId, modelData.id, !modelData.enabled);
                             }
                             onEntered: {
-                                const tooltipText = modelData.enabled ? "Hide" : "Show";
+                                const tooltipText = modelData.enabled ? I18n.tr("Hide") : I18n.tr("Show");
                                 sharedTooltip.show(tooltipText, visibilityButton, 0, 0, "bottom");
                             }
                             onExited: {
@@ -1013,6 +1157,7 @@ Column {
                         }
 
                         DankActionButton {
+                            id: removeWidgetButton
                             buttonSize: 32
                             iconName: "close"
                             iconSize: 18
@@ -1020,6 +1165,12 @@ Column {
                             onClicked: {
                                 root.removeWidget(root.sectionId, index);
                             }
+                            onEntered: {
+                                sharedTooltip.show(I18n.tr("Remove"), removeWidgetButton, 0, 0, "bottom");
+                            }
+                            onExited: {
+                                sharedTooltip.hide();
+                            }
                         }
                     }
 
@@ -2317,6 +2468,7 @@ Column {
                                             anchors.rightMargin: Theme.spacingM
                                             anchors.verticalCenter: parent.verticalCenter
                                             spacing: Theme.spacingS
+                                            clip: true
 
                                             Item {
                                                 width: 16
@@ -2376,6 +2528,8 @@ Column {
                                                 color: Theme.surfaceText
                                                 font.weight: Font.Normal
                                                 anchors.verticalCenter: parent.verticalCenter
+                                                elide: Text.ElideRight
+                                                width: parent.width - 16 - Theme.spacingS - 16 - Theme.spacingS
                                             }
                                         }
 
@@ -2433,8 +2587,8 @@ Column {
         property string sectionId: ""
         property int widgetIndex: -1
 
-        width: 200
+        width: 240
-        height: 160
+        height: menuPrivacyColumn.implicitHeight + Theme.spacingS * 2
         padding: 0
         modal: true
         focus: true
@@ -2494,8 +2648,11 @@ Column {
                     Row {
                         anchors.left: parent.left
                         anchors.leftMargin: Theme.spacingS
+                        anchors.right: micToggle.left
+                        anchors.rightMargin: Theme.spacingS
                         anchors.verticalCenter: parent.verticalCenter
                         spacing: Theme.spacingS
+                        clip: true
 
                         DankIcon {
                             name: "mic"
@@ -2510,6 +2667,8 @@ Column {
                             color: Theme.surfaceText
                             font.weight: Font.Normal
                             anchors.verticalCenter: parent.verticalCenter
+                            elide: Text.ElideRight
+                            width: parent.width - 16 - Theme.spacingS
                         }
                     }
 
@@ -2546,8 +2705,11 @@ Column {
                     Row {
                         anchors.left: parent.left
                         anchors.leftMargin: Theme.spacingS
+                        anchors.right: cameraToggle.left
+                        anchors.rightMargin: Theme.spacingS
                         anchors.verticalCenter: parent.verticalCenter
                         spacing: Theme.spacingS
+                        clip: true
 
                         DankIcon {
                             name: "camera_video"
@@ -2562,6 +2724,8 @@ Column {
                             color: Theme.surfaceText
                             font.weight: Font.Normal
                             anchors.verticalCenter: parent.verticalCenter
+                            elide: Text.ElideRight
+                            width: parent.width - 16 - Theme.spacingS
                         }
                     }
 
@@ -2598,8 +2762,11 @@ Column {
                     Row {
                         anchors.left: parent.left
                         anchors.leftMargin: Theme.spacingS
+                        anchors.right: screenshareToggle.left
+                        anchors.rightMargin: Theme.spacingS
                         anchors.verticalCenter: parent.verticalCenter
                         spacing: Theme.spacingS
+                        clip: true
 
                         DankIcon {
                             name: "screen_share"
@@ -2614,6 +2781,8 @@ Column {
                             color: Theme.surfaceText
                             font.weight: Font.Normal
                             anchors.verticalCenter: parent.verticalCenter
+                            elide: Text.ElideRight
+                            width: parent.width - 16 - Theme.spacingS
                         }
                     }