diff --git a/quickshell/Common/SettingsData.qml b/quickshell/Common/SettingsData.qml index 757d9d80..c65f8d42 100644 --- a/quickshell/Common/SettingsData.qml +++ b/quickshell/Common/SettingsData.qml @@ -215,7 +215,9 @@ Singleton { property int selectedGpuIndex: 0 property var enabledGpuPciIds: [] property bool showSystemTray: true - property bool systemTrayMonochromeIcons: false + property string systemTrayIconTintMode: "none" + property int systemTrayIconTintSaturation: 50 + property int systemTrayIconTintStrength: 135 property bool showClock: true property bool showNotificationButton: true property bool showBattery: true diff --git a/quickshell/Common/settings/SettingsSpec.js b/quickshell/Common/settings/SettingsSpec.js index da07ea0d..b4a4ca8a 100644 --- a/quickshell/Common/settings/SettingsSpec.js +++ b/quickshell/Common/settings/SettingsSpec.js @@ -81,7 +81,9 @@ var SPEC = { selectedGpuIndex: { def: 0 }, enabledGpuPciIds: { def: [] }, showSystemTray: { def: true }, - systemTrayMonochromeIcons: { def: false }, + systemTrayIconTintMode: { def: "none" }, + systemTrayIconTintSaturation: { def: 50 }, + systemTrayIconTintStrength: { def: 135 }, showClock: { def: true }, showNotificationButton: { def: true }, showBattery: { def: true }, diff --git a/quickshell/Modules/DankBar/Widgets/SystemTrayBar.qml b/quickshell/Modules/DankBar/Widgets/SystemTrayBar.qml index c251ac82..63ea0fee 100644 --- a/quickshell/Modules/DankBar/Widgets/SystemTrayBar.qml +++ b/quickshell/Modules/DankBar/Widgets/SystemTrayBar.qml @@ -152,6 +152,59 @@ BasePill { item: item })) readonly property var hiddenBarItems: allSortedTrayItems.filter(item => SessionData.isHiddenTrayId(root.getTrayItemKey(item))) + readonly property string trayIconTintMode: { + const configuredMode = SettingsData.systemTrayIconTintMode || "none"; + switch (configuredMode) { + case "monochrome": + case "primary": + case "secondary": + return configuredMode; + default: + return "none"; + } + } + readonly property bool trayIconTintEnabled: trayIconTintMode !== "none" + readonly property real trayIconTintSaturationAmount: { + const raw = SettingsData.systemTrayIconTintSaturation; + const value = (raw === undefined || raw === null) ? 50 : raw; + return Math.max(0, Math.min(100, value)) / 100; + } + readonly property real trayIconTintStrengthAmount: { + const raw = SettingsData.systemTrayIconTintStrength; + const value = (raw === undefined || raw === null) ? 135 : raw; + return Math.max(0, Math.min(200, value)) / 100; + } + readonly property real trayIconSaturation: { + switch (trayIconTintMode) { + case "monochrome": + return -1; + case "primary": + case "secondary": + return -root.trayIconTintSaturationAmount; + default: + return 0; + } + } + readonly property real trayIconColorization: { + switch (trayIconTintMode) { + case "primary": + case "secondary": + return root.trayIconTintStrengthAmount; + default: + return 0; + } + } + readonly property color trayIconTintColor: { + switch (trayIconTintMode) { + case "primary": + return Theme.primary; + case "secondary": + return Theme.secondary; + default: + return Theme.surfaceText; + } + } + readonly property bool reverseInlineHorizontal: !useOverflowPopup && !isVerticalOrientation && section === "right" readonly property bool reverseInlineVertical: !useOverflowPopup && isVerticalOrientation && section === "right" readonly property var displayedMainBarItems: reverseInlineHorizontal ? [...mainBarItems].reverse() : mainBarItems @@ -367,9 +420,11 @@ BasePill { smooth: true mipmap: true visible: status === Image.Ready - layer.enabled: SettingsData.systemTrayMonochromeIcons + layer.enabled: root.trayIconTintEnabled layer.effect: MultiEffect { - saturation: -1 + saturation: root.trayIconSaturation + colorization: root.trayIconColorization + colorizationColor: root.trayIconTintColor } } @@ -586,9 +641,11 @@ BasePill { smooth: true mipmap: true visible: status === Image.Ready - layer.enabled: SettingsData.systemTrayMonochromeIcons + layer.enabled: root.trayIconTintEnabled layer.effect: MultiEffect { - saturation: -1 + saturation: root.trayIconSaturation + colorization: root.trayIconColorization + colorizationColor: root.trayIconTintColor } } @@ -718,9 +775,11 @@ BasePill { smooth: true mipmap: true visible: status === Image.Ready - layer.enabled: SettingsData.systemTrayMonochromeIcons + layer.enabled: root.trayIconTintEnabled layer.effect: MultiEffect { - saturation: -1 + saturation: root.trayIconSaturation + colorization: root.trayIconColorization + colorizationColor: root.trayIconTintColor } } @@ -1223,9 +1282,11 @@ BasePill { smooth: true mipmap: true visible: status === Image.Ready - layer.enabled: SettingsData.systemTrayMonochromeIcons + layer.enabled: root.trayIconTintEnabled layer.effect: MultiEffect { - saturation: -1 + saturation: root.trayIconSaturation + colorization: root.trayIconColorization + colorizationColor: root.trayIconTintColor } } diff --git a/quickshell/Modules/Settings/DankBarTab.qml b/quickshell/Modules/Settings/DankBarTab.qml index 89ea029d..1c8cc229 100644 --- a/quickshell/Modules/Settings/DankBarTab.qml +++ b/quickshell/Modules/Settings/DankBarTab.qml @@ -1066,13 +1066,103 @@ Item { }) } - SettingsToggleCard { + SettingsCard { iconName: "filter_b_and_w" - title: I18n.tr("Monochrome System Tray Icons") - description: I18n.tr("Desaturate all system tray icons for a uniform monochrome look") + title: I18n.tr("System Tray Icon Tint") + settingKey: "trayIconTint" visible: selectedBarConfig?.enabled - checked: SettingsData.systemTrayMonochromeIcons - onToggled: checked => SettingsData.set("systemTrayMonochromeIcons", checked) + + StyledText { + text: I18n.tr("Choose monochrome or a theme color tint for system tray icons") + font.pixelSize: Theme.fontSizeSmall + color: Theme.surfaceVariantText + wrapMode: Text.WordWrap + width: parent.width + horizontalAlignment: Text.AlignLeft + } + + SettingsButtonGroupRow { + text: I18n.tr("Mode") + model: [I18n.tr("None"), I18n.tr("Monochrome"), I18n.tr("Primary"), I18n.tr("Secondary")] + currentIndex: { + let mode = SettingsData.systemTrayIconTintMode || "none"; + switch (mode) { + case "monochrome": + return 1; + case "primary": + return 2; + case "secondary": + return 3; + default: + return 0; + } + } + onSelectionChanged: (index, selected) => { + if (!selected) + return; + + let mode = "none"; + switch (index) { + case 1: + mode = "monochrome"; + break; + case 2: + mode = "primary"; + break; + case 3: + mode = "secondary"; + break; + } + + SettingsData.set("systemTrayIconTintMode", mode); + } + } + + SettingsSliderRow { + id: trayTintSaturationSlider + text: I18n.tr("Tint Saturation") + description: I18n.tr("Controls how much original icon color is removed before applying tint") + visible: { + const mode = SettingsData.systemTrayIconTintMode || "none"; + return mode === "primary" || mode === "secondary"; + } + value: SettingsData.systemTrayIconTintSaturation ?? 50 + minimum: 0 + maximum: 100 + unit: "%" + defaultValue: 50 + onSliderDragFinished: finalValue => SettingsData.set("systemTrayIconTintSaturation", finalValue) + + Binding { + target: trayTintSaturationSlider + property: "value" + value: SettingsData.systemTrayIconTintSaturation ?? 50 + restoreMode: Binding.RestoreBinding + } + } + + SettingsSliderRow { + id: trayTintStrengthSlider + text: I18n.tr("Tint Strength") + description: I18n.tr("Controls how strongly the selected tint color is applied") + visible: { + const mode = SettingsData.systemTrayIconTintMode || "none"; + return mode === "primary" || mode === "secondary"; + } + value: SettingsData.systemTrayIconTintStrength ?? 135 + minimum: 0 + maximum: 200 + unit: "%" + defaultValue: 135 + onSliderDragFinished: finalValue => SettingsData.set("systemTrayIconTintStrength", finalValue) + + Binding { + target: trayTintStrengthSlider + property: "value" + value: SettingsData.systemTrayIconTintStrength ?? 135 + restoreMode: Binding.RestoreBinding + } + } } SettingsToggleCard { diff --git a/quickshell/translations/settings_search_index.json b/quickshell/translations/settings_search_index.json index f1adda07..2f8ed534 100644 --- a/quickshell/translations/settings_search_index.json +++ b/quickshell/translations/settings_search_index.json @@ -914,6 +914,31 @@ ], "icon": "visibility_off" }, + { + "section": "trayIconTint", + "label": "System Tray Icon Tint", + "tabIndex": 3, + "category": "Dank Bar", + "keywords": [ + "bar", + "dank", + "icon", + "icons", + "monochrome", + "panel", + "primary", + "secondary", + "saturation", + "status", + "statusbar", + "strength", + "taskbar", + "tint", + "tray" + ], + "icon": "filter_b_and_w", + "description": "Choose monochrome or a theme color tint for system tray icons" + }, { "section": "workspaceDragReorder", "label": "Drag to Reorder",