aboutsummaryrefslogtreecommitdiffstats
path: root/desktop/modules/user/UserPage.qml
diff options
context:
space:
mode:
authorDanilo M. <danix@danix.xyz>2026-10-16 10:19:46 +0200
committerDanilo M. <danix@danix.xyz>2026-10-16 10:19:46 +0200
commit1e0cb0bc16d5971e6e42c105622443d955ccdf5e (patch)
treeb28783d823f1511d78d5dd30ae8d54e9fe4a572f /desktop/modules/user/UserPage.qml
parent22db61bebaba4fdc58110f8bcc07313d330ac658 (diff)
downloadquickshell-1e0cb0bc16d5971e6e42c105622443d955ccdf5e.tar.gz
quickshell-1e0cb0bc16d5971e6e42c105622443d955ccdf5e.zip
feat(shared): one faded glow for hovers across the shells
Hover and attention effects were solid: a flat accent ring round the user page's avatar, a flat quarter-disc in the hot corner, and thick accent or white borders on window cards, keycaps and knobs. Glow.qml is a RectangularShadow in the accent, fading out from the shape's edge and in over 140ms, linked into desktop, window-switcher and keybinds like Theme.qml, and all five places use it. Selection borders in the appearance tabs stay: they mark state, not hover. The avatar also gains the hover cue in the first place: the hand cursor never showed under a hyprcursor-only theme, so without it the picture gave no sign it could be clicked. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Diffstat (limited to 'desktop/modules/user/UserPage.qml')
-rw-r--r--desktop/modules/user/UserPage.qml54
1 files changed, 37 insertions, 17 deletions
diff --git a/desktop/modules/user/UserPage.qml b/desktop/modules/user/UserPage.qml
index feaf85f..fabb3e4 100644
--- a/desktop/modules/user/UserPage.qml
+++ b/desktop/modules/user/UserPage.qml
@@ -142,31 +142,51 @@ Column {
onAccepted: form.set("avatar", decodeURIComponent(selectedFile.toString().replace(/^file:\/\//, "")))
}
- ClippingRectangle {
+ // The picture glows on hover. The glow is what says "clickable":
+ // the hand cursor never shows here, since the cursor theme only ships
+ // hyprcursors and Qt finds no hand in it.
+ Item {
anchors.horizontalCenter: parent.horizontalCenter
- width: 160
- height: 160
- radius: 80
- color: Theme.surfaceAlt
+ width: 176
+ height: 176
- Image {
- id: pic
- anchors.fill: parent
- source: form.draft.avatar ? "file://" + form.draft.avatar.split("/").map(encodeURIComponent).join("/") : ""
- fillMode: Image.PreserveAspectCrop
- sourceSize: Qt.size(320, 320)
- cache: false
+ Glow {
+ anchors.centerIn: parent
+ width: 160
+ height: 160
+ radius: 80
+ on: avatarArea.containsMouse
}
- Text {
+
+ ClippingRectangle {
anchors.centerIn: parent
- visible: pic.status !== Image.Ready
- text: "\uf007"
- font { family: Theme.iconFamily; pixelSize: 64 }
- color: Theme.subtext
+ width: 160
+ height: 160
+ radius: 80
+ color: Theme.surfaceAlt
+
+ Image {
+ id: pic
+ anchors.fill: parent
+ source: form.draft.avatar ? "file://" + form.draft.avatar.split("/").map(encodeURIComponent).join("/") : ""
+ fillMode: Image.PreserveAspectCrop
+ sourceSize: Qt.size(320, 320)
+ cache: false
+ }
+ Text {
+ anchors.centerIn: parent
+ visible: pic.status !== Image.Ready
+ text: "\uf007"
+ font { family: Theme.iconFamily; pixelSize: 64 }
+ color: Theme.subtext
+ }
}
+
MouseArea {
+ id: avatarArea
anchors.fill: parent
enabled: !form.busy
+ hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: picker.open()
}