diff --git a/EXAMPLE.md b/EXAMPLE.md index 99b82a1..2a3c2a6 100644 --- a/EXAMPLE.md +++ b/EXAMPLE.md @@ -9,16 +9,6 @@ Path: `~/.config/overzicht/settings.json` ```json { "appearance": { - "rounding": { - "unsharpen": 0, - "verysmall": 0, - "small": 0, - "normal": 0, - "large": 0, - "full": 0, - "screenRounding": 0, - "windowRounding": 0 - }, "font": { "family": { "main": "sans-serif", @@ -58,6 +48,13 @@ Path: `~/.config/overzicht/settings.json` "previewMode": "live", "includeInactiveMonitorPreviews": true, "previewRecaptureDelayMs": 60, + "effects": { + "enableBackdrop": false, + "backdropOpacity": 0.28, + "panelOpacity": 0.92, + "workspaceOpacity": 0.86, + "windowOverlayOpacity": 0.22 + }, "workspaceSpacing": 5, "backgroundPadding": 10, "workspaceNumberBaseSize": 250 diff --git a/README.md b/README.md index aa5b7d7..63f0bcc 100644 --- a/README.md +++ b/README.md @@ -34,6 +34,10 @@ Compared to the quickshell-overview project, the following functionality was rem (`useMatugenColors` and `Appearance.colors.qml` template flow). - Color source selection and Caelestia live sync (`appearance.colorSource`, Caelestia integration, and related live theme sync). +- Configurable corner rounding + (`appearance.rounding`; overview corners are now always square). +- Glass-mode visual styling + (`overview.effects.glassMode` and related glass tint/border/shine settings). ## Flake Outputs @@ -76,8 +80,17 @@ Additional optional settings: - `overview.previewMode` - `overview.includeInactiveMonitorPreviews` - `overview.previewRecaptureDelayMs` +- `overview.effects.enableBackdrop` +- `overview.effects.backdropOpacity` +- `overview.effects.panelOpacity` +- `overview.effects.workspaceOpacity` +- `overview.effects.windowOverlayOpacity` - `hacks.hyprlandEventDebounceMs` +Visual effects notes: + +- `enableBackdrop` adds a dimmed full-screen backdrop behind the overview. + For full JSON examples of both runtime files, see [`EXAMPLE.md`](EXAMPLE.md). ## NixOS Module diff --git a/common/Appearance.qml b/common/Appearance.qml index 8c13e41..fc0b13b 100644 --- a/common/Appearance.qml +++ b/common/Appearance.qml @@ -114,14 +114,14 @@ Singleton { } rounding: QtObject { - property int unsharpen: Config.options.appearance.rounding.unsharpen - property int verysmall: Config.options.appearance.rounding.verysmall - property int small: Config.options.appearance.rounding.small - property int normal: Config.options.appearance.rounding.normal - property int large: Config.options.appearance.rounding.large - property int full: Config.options.appearance.rounding.full - property int screenRounding: Config.options.appearance.rounding.screenRounding - property int windowRounding: Config.options.appearance.rounding.windowRounding + property int unsharpen: 0 + property int verysmall: 0 + property int small: 0 + property int normal: 0 + property int large: 0 + property int full: 0 + property int screenRounding: 0 + property int windowRounding: 0 } font: QtObject { diff --git a/common/Config.qml b/common/Config.qml index b7b5619..8f934b9 100644 --- a/common/Config.qml +++ b/common/Config.qml @@ -56,17 +56,6 @@ Singleton { property QtObject options: QtObject { property QtObject appearance: QtObject { - property QtObject rounding: QtObject { - property int unsharpen: root.optionValue(["appearance", "rounding", "unsharpen"], 0) - property int verysmall: root.optionValue(["appearance", "rounding", "verysmall"], 0) - property int small: root.optionValue(["appearance", "rounding", "small"], 0) - property int normal: root.optionValue(["appearance", "rounding", "normal"], 0) - property int large: root.optionValue(["appearance", "rounding", "large"], 0) - property int full: root.optionValue(["appearance", "rounding", "full"], 0) - property int screenRounding: root.optionValue(["appearance", "rounding", "screenRounding"], 0) - property int windowRounding: root.optionValue(["appearance", "rounding", "windowRounding"], 0) - } - property QtObject font: QtObject { property QtObject family: QtObject { property string main: root.optionValue(["appearance", "font", "family", "main"], "sans-serif") @@ -113,6 +102,13 @@ Singleton { property real workspaceSpacing: root.optionValue(["overview", "workspaceSpacing"], 5) property real backgroundPadding: root.optionValue(["overview", "backgroundPadding"], 10) property real workspaceNumberBaseSize: root.optionValue(["overview", "workspaceNumberBaseSize"], 250) + property QtObject effects: QtObject { + property bool enableBackdrop: root.optionValue(["overview", "effects", "enableBackdrop"], false) + property real backdropOpacity: root.optionValue(["overview", "effects", "backdropOpacity"], 0.28) + property real panelOpacity: root.optionValue(["overview", "effects", "panelOpacity"], 0.92) + property real workspaceOpacity: root.optionValue(["overview", "effects", "workspaceOpacity"], 0.86) + property real windowOverlayOpacity: root.optionValue(["overview", "effects", "windowOverlayOpacity"], 0.22) + } } property QtObject windowPreview: QtObject { diff --git a/modules/overview/Overview.qml b/modules/overview/Overview.qml index d454e8c..909cf6d 100644 --- a/modules/overview/Overview.qml +++ b/modules/overview/Overview.qml @@ -19,6 +19,8 @@ Scope { required property var modelData readonly property HyprlandMonitor monitor: Hyprland.monitorFor(root.screen) property bool monitorIsFocused: Hyprland.focusedMonitor?.id == monitor?.id + property bool backdropEnabled: Config.options.overview.effects.enableBackdrop + property real backdropOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.backdropOpacity)) screen: modelData visible: GlobalStates.overviewOpen @@ -27,15 +29,11 @@ Scope { WlrLayershell.keyboardFocus: WlrKeyboardFocus.Exclusive color: "transparent" - mask: Region { - item: GlobalStates.overviewOpen ? keyHandler : null - } - anchors { top: true bottom: true - left: !(Config?.options.overview.enable ?? true) - right: !(Config?.options.overview.enable ?? true) + left: true + right: true } HyprlandFocusGrab { @@ -68,14 +66,23 @@ Scope { } } - implicitWidth: columnLayout.implicitWidth - implicitHeight: columnLayout.implicitHeight + implicitWidth: screen.width + implicitHeight: screen.height Item { id: keyHandler anchors.fill: parent visible: GlobalStates.overviewOpen focus: GlobalStates.overviewOpen + z: 0 + + Rectangle { + anchors.fill: parent + visible: root.backdropEnabled + color: "#000000" + opacity: root.backdropOpacity + z: 0 + } Keys.onPressed: event => { if (event.key === Qt.Key_Escape || event.key === Qt.Key_Return) { @@ -163,6 +170,7 @@ Scope { id: columnLayout visible: GlobalStates.overviewOpen anchors.centerIn: parent + z: 1 Loader { id: overviewLoader diff --git a/modules/overview/OverviewWidget.qml b/modules/overview/OverviewWidget.qml index 88a38b8..c9d4d3d 100644 --- a/modules/overview/OverviewWidget.qml +++ b/modules/overview/OverviewWidget.qml @@ -37,6 +37,8 @@ Item { property int windowZ: 1 property int windowDraggingZ: 99999 property real workspaceSpacing: Config.options.overview.workspaceSpacing + property real panelOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.panelOpacity)) + property real workspaceOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.workspaceOpacity)) property int draggingFromWorkspace: -1 property int draggingTargetWorkspace: -1 @@ -120,10 +122,11 @@ Item { implicitWidth: workspaceColumnLayout.implicitWidth + padding * 2 implicitHeight: workspaceColumnLayout.implicitHeight + padding * 2 - radius: Appearance.rounding.screenRounding - color: Appearance.colors.colLayer0 + radius: 0 + clip: true + color: ColorUtils.applyAlpha(Appearance.colors.colLayer0, root.panelOpacity) border.width: 1 - border.color: Appearance.colors.colLayer0Border + border.color: ColorUtils.applyAlpha(Appearance.colors.colLayer0Border, root.panelOpacity) ColumnLayout { // Workspaces id: workspaceColumnLayout @@ -153,8 +156,8 @@ Item { implicitWidth: root.workspaceImplicitWidth implicitHeight: root.workspaceImplicitHeight - color: hoveredWhileDragging ? hoveredWorkspaceColor : defaultWorkspaceColor - radius: Appearance.rounding.screenRounding + color: ColorUtils.applyAlpha(hoveredWhileDragging ? hoveredWorkspaceColor : defaultWorkspaceColor, root.workspaceOpacity) + radius: 0 border.width: 2 border.color: hoveredWhileDragging ? hoveredBorderColor : "transparent" @@ -245,7 +248,6 @@ Item { toplevel: modelData monitorData: monitor - // Keep the fork's source-monitor scaling behavior while applying the new workspace mapping logic. property real sourceMonitorWidth: (monitor?.transform % 2 === 1) ? (monitor?.height ?? 1920) / (monitor?.scale ?? 1) - (monitor?.reserved?.[0] ?? 0) - (monitor?.reserved?.[2] ?? 0) : (monitor?.width ?? 1920) / (monitor?.scale ?? 1) - (monitor?.reserved?.[0] ?? 0) - (monitor?.reserved?.[2] ?? 0) property real sourceMonitorHeight: (monitor?.transform % 2 === 1) ? (monitor?.width ?? 1080) / (monitor?.scale ?? 1) - (monitor?.reserved?.[1] ?? 0) - (monitor?.reserved?.[3] ?? 0) : (monitor?.height ?? 1080) / (monitor?.scale ?? 1) - (monitor?.reserved?.[1] ?? 0) - (monitor?.reserved?.[3] ?? 0) @@ -338,7 +340,7 @@ Item { width: root.workspaceImplicitWidth height: root.workspaceImplicitHeight color: "transparent" - radius: Appearance.rounding.screenRounding + radius: 0 border.width: 2 border.color: root.activeBorderColor Behavior on x { diff --git a/modules/overview/OverviewWindow.qml b/modules/overview/OverviewWindow.qml index 1da281e..7da82f9 100644 --- a/modules/overview/OverviewWindow.qml +++ b/modules/overview/OverviewWindow.qml @@ -33,6 +33,7 @@ Item { // Window property bool previewsEnabled: Config.options.overview.previewsEnabled property bool includeInactiveMonitorPreviews: Config.options.overview.includeInactiveMonitorPreviews property int previewRecaptureDelayMs: Config.options.overview.previewRecaptureDelayMs + property real windowOverlayOpacity: Math.max(0, Math.min(1, Config.options.overview.effects.windowOverlayOpacity)) property string previewModeRaw: Config.options.overview.previewMode property string previewMode: { const mode = `${previewModeRaw ?? "live"}`.trim().toLowerCase(); @@ -94,8 +95,8 @@ Item { // Window Rectangle { anchors.fill: parent - radius: Appearance.rounding.windowRounding - color: pressed ? ColorUtils.transparentize(Appearance.colors.colLayer2Active, 0.5) : hovered ? ColorUtils.transparentize(Appearance.colors.colLayer2Hover, 0.7) : ColorUtils.transparentize(Appearance.colors.colLayer2) + radius: 0 + color: pressed ? ColorUtils.applyAlpha(Appearance.colors.colLayer2Active, Math.min(1, root.windowOverlayOpacity + 0.30)) : hovered ? ColorUtils.applyAlpha(Appearance.colors.colLayer2Hover, Math.min(1, root.windowOverlayOpacity + 0.20)) : ColorUtils.applyAlpha(Appearance.colors.colLayer2, root.windowOverlayOpacity) border.color: ColorUtils.transparentize(Appearance.m3colors.m3outline, 0.7) border.width: 1 }