From 58ead2bb236b7cc63a0cff63c5e0dab031add860 Mon Sep 17 00:00:00 2001 From: lucalise Date: Mon, 19 Jan 2026 18:16:08 -0800 Subject: [PATCH] feat: quickshell multi monitor --- .config/quickshell/Bar.qml | 52 ++++++++ .config/quickshell/components/Clock.qml | 34 ++++++ .config/quickshell/components/Workspaces.qml | 84 +++++++++++++ .config/quickshell/shell.qml | 119 +------------------ nix/modules/desktop.nix | 3 +- 5 files changed, 177 insertions(+), 115 deletions(-) create mode 100644 .config/quickshell/Bar.qml create mode 100644 .config/quickshell/components/Clock.qml create mode 100644 .config/quickshell/components/Workspaces.qml diff --git a/.config/quickshell/Bar.qml b/.config/quickshell/Bar.qml new file mode 100644 index 0000000..357b637 --- /dev/null +++ b/.config/quickshell/Bar.qml @@ -0,0 +1,52 @@ +//qmllint disable unqualified +//qmllint disable unused-imports +//qmllint disable uncreatable-type +import QtQuick +import QtQuick.Layouts +import Quickshell +import "components" + +PanelWindow { + id: root + anchors.top: true + anchors.left: true + anchors.right: true + implicitHeight: 34 + color: "#1a1b26" + required property var modelData + screen: modelData + + property int fontSize: 18 + property color colBg: "#1a1b26" + property color colFg: "#a9b1d6" + property color colMuted: "#444b6a" + property color colCyan: "#0db9d7" + property color colPurple: "#ad8ee6" + property color colRed: "#f7768e" + property color colYellow: "#e0af68" + property color colBlue: "#7aa2f7" + + RowLayout { + anchors.fill: parent + + Rectangle { + Layout.preferredWidth: 30 + Layout.preferredHeight: 28 + color: "transparent" + + Image { + anchors.fill: parent + source: "file:///home/luca/dotfiles/.config/quickshell/icons/nixos.png" + fillMode: Image.PreserveAspectFit + } + } + + Workspaces {} + + Item { + Layout.fillWidth: true + } + + Clock {} + } +} diff --git a/.config/quickshell/components/Clock.qml b/.config/quickshell/components/Clock.qml new file mode 100644 index 0000000..c88c02e --- /dev/null +++ b/.config/quickshell/components/Clock.qml @@ -0,0 +1,34 @@ +import QtQuick +import QtQuick.Layouts + +Item { + id: clockRoot + implicitWidth: timeText.implicitWidth + implicitHeight: timeText.implicitHeight + + property string dateTime: "" + + function updateTime() { + dateTime = Qt.formatDateTime(new Date(), "ddd, MMM dd | HH:mm:ss"); + } + + Timer { + interval: 1000 + running: true + repeat: true + triggeredOnStart: true + onTriggered: clockRoot.updateTime() + } + + Text { + id: timeText + text: clockRoot.dateTime + color: "#a9b1d6" + font { + pixelSize: 16 + family: "Comic Relief" + bold: true + } + anchors.centerIn: parent + } +} diff --git a/.config/quickshell/components/Workspaces.qml b/.config/quickshell/components/Workspaces.qml new file mode 100644 index 0000000..a84a98b --- /dev/null +++ b/.config/quickshell/components/Workspaces.qml @@ -0,0 +1,84 @@ +//qmllint disable unqualified +//qmllint disable unused-imports +//qmllint disable uncreatable-type +import QtQuick +import QtQuick.Layouts +import Quickshell +import Quickshell.Hyprland +import Quickshell.Io + +Repeater { + model: Hyprland.workspaces.values + + delegate: Rectangle { + id: workspaceComponent + Layout.preferredWidth: 30 + Layout.preferredHeight: parent.height + color: "transparent" + + property bool isActive: modelData.focused + property int lastActive: 1 + property int wsId: modelData.id + property bool isHovered: mouseHandler.containsMouse + + states: [ + State { + name: "active" + when: isActive + PropertyChanges { + target: workspaceComponent + color: Qt.rgba(1, 1, 1, 0.2) + } + PropertyChanges { + target: underline + color: root.colPurple + } + }, + State { + name: "hovered" + when: isHovered && !isActive + PropertyChanges { + target: workspaceComponent + color: Qt.rgba(1, 1, 1, 0.1) + } + PropertyChanges { + target: underline + color: "#7aa2f7" + } + } + ] + + transitions: Transition { + ColorAnimation { + duration: 200 + } + } + + Text { + text: modelData.id + color: isActive ? "#a9b1d6" : "#7aa2f7" + font { + pixelSize: root.fontSize + bold: true + family: "Comic Relief" + } + anchors.centerIn: parent + } + + Rectangle { + id: underline + width: 30 + height: 3 + color: root.colBg + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + } + + MouseArea { + id: mouseHandler + hoverEnabled: true + anchors.fill: parent + onClicked: Hyprland.dispatch("workspace " + modelData.id) + } + } +} diff --git a/.config/quickshell/shell.qml b/.config/quickshell/shell.qml index bf08f1c..9009455 100644 --- a/.config/quickshell/shell.qml +++ b/.config/quickshell/shell.qml @@ -4,121 +4,12 @@ import QtQuick import QtQuick.Layouts import Quickshell -import Quickshell.Wayland -import Quickshell.Hyprland -import Quickshell.Io -PanelWindow { - id: root - anchors.top: true - anchors.left: true - anchors.right: true - implicitHeight: 34 - color: "#1a1b26" - - property int fontSize: 18 - property color colBg: "#1a1b26" - property color colFg: "#a9b1d6" - property color colMuted: "#444b6a" - property color colCyan: "#0db9d7" - property color colPurple: "#ad8ee6" - property color colRed: "#f7768e" - property color colYellow: "#e0af68" - property color colBlue: "#7aa2f7" - - RowLayout { - anchors.fill: parent - - Rectangle { - Layout.preferredWidth: 30 - Layout.preferredHeight: 28 - color: "transparent" - - Image { - anchors.fill: parent - source: "file:///home/luca/dotfiles/.config/quickshell/icons/nixos.png" - fillMode: Image.PreserveAspectFit - } - } - - Repeater { - model: Hyprland.workspaces.values - - delegate: Rectangle { - id: workspaceComponent - Layout.preferredWidth: 30 - Layout.preferredHeight: parent.height - color: "transparent" - - property bool isActive: modelData.focused - property int lastActive: 1 - property int wsId: modelData.id - property bool isHovered: mouseHandler.containsMouse - - states: [ - State { - name: "active" - when: isActive - PropertyChanges { - target: workspaceComponent - color: Qt.rgba(1, 1, 1, 0.2) - } - PropertyChanges { - target: underline - color: root.colPurple - } - }, - State { - name: "hovered" - when: isHovered && !isActive - PropertyChanges { - target: workspaceComponent - color: Qt.rgba(1, 1, 1, 0.1) - } - PropertyChanges { - target: underline - color: "#7aa2f7" - } - } - ] - - transitions: Transition { - ColorAnimation { - duration: 200 - } - } - - Text { - text: modelData.id - color: isActive ? "#a9b1d6" : "#7aa2f7" - font { - pixelSize: root.fontSize - bold: true - family: "Comic Relief" - } - anchors.centerIn: parent - } - - Rectangle { - id: underline - width: 30 - height: 3 - color: root.colBg - anchors.bottom: parent.bottom - anchors.horizontalCenter: parent.horizontalCenter - } - - MouseArea { - id: mouseHandler - hoverEnabled: true - anchors.fill: parent - onClicked: Hyprland.dispatch("workspace " + modelData.id) - } - } - } - - Item { - Layout.fillWidth: true +Scope { + Variants { + model: Quickshell.screens + delegate: Component { + Bar {} } } } diff --git a/nix/modules/desktop.nix b/nix/modules/desktop.nix index 3e009b1..b79b9a4 100644 --- a/nix/modules/desktop.nix +++ b/nix/modules/desktop.nix @@ -259,7 +259,8 @@ "__GLX_VENDOR_LIBRARY_NAME,nvidia" ]; exec-once = [ - "status-bar" + # "status-bar" + "qs" "wl-clip-persist --clipboard regular" ]; monitor = [