kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

tiny reload popup design tweaks

Browse Source
This commit is contained in:
end-4
2026-03-11 22:09:54 +01:00
parent be87a1ae79
commit 5e16f2bc10
1 changed files with 152 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dots/.config/quickshell/ii/ReloadPopup.qml
+48 -36
View File
@@ -1,13 +1,15 @@
pragma ComponentBehavior: Bound
import QtQuick
import QtQuick.Effects
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import Quickshell
import Quickshell.Wayland
Scope {
id: root
property bool failed;
property string errorString;
property bool failed
property string errorString
property real progressHeight: 3
// Connect to the Quickshell global to listen for the reload signals.
Connections {
@@ -39,22 +41,31 @@ Scope {
anchors.top: true
margins.top: 0
implicitWidth: rect.width + shadow.radius * 2
implicitHeight: rect.height + shadow.radius * 2
implicitWidth: rect.width + 8 * 2
implicitHeight: rect.height + 8 * 2
WlrLayershell.namespace: "quickshell:reloadPopup"
// color blending is a bit odd as detailed in the type reference.
color: "transparent"
RectangularShadow {
anchors.fill: rect
radius: rect.radius
blur: 6.3
offset: Qt.vector2d(0.0, 1.0)
spread: 1
color: "#55000000"
}
Rectangle {
id: rect
anchors.centerIn: parent
color: failed ? "#ffe99195" : "#ffD1E8D5"
color: root.failed ? "#ffe99195" : "#ffD1E8D5"
implicitHeight: layout.implicitHeight + 30
implicitWidth: layout.implicitWidth + 30
radius: 12
radius: 8
// Fills the whole area of the rectangle, making any clicks go to it,
// which dismiss the popup.
@@ -62,7 +73,7 @@ Scope {
id: mouseArea
anchors.fill: parent
onPressed: {
popupLoader.active = false
popupLoader.active = false;
}
// makes the mouse area track mouse hovering, so the hide animation
@@ -80,19 +91,21 @@ Scope {
}
Text {
id: title
renderType: Text.NativeRendering
font.family: "Google Sans Flex"
font.pointSize: 14
text: root.failed ? "Quickshell: Reload failed" : "Quickshell reloaded"
color: failed ? "#ff93000A" : "#ff0C1F13"
color: root.failed ? "#ff93000A" : "#ff0C1F13"
}
Text {
id: info
renderType: Text.NativeRendering
font.family: "JetBrains Mono NF"
font.pointSize: 11
text: root.errorString
color: failed ? "#ff93000A" : "#ff0C1F13"
color: root.failed ? "#ff93000A" : "#ff0C1F13"
// When visible is false, it also takes up no space.
visible: root.errorString != ""
}
@@ -101,22 +114,26 @@ Scope {
// A progress bar on the bottom of the screen, showing how long until the
// popup is removed.
Rectangle {
z: 2
id: bar
color: failed ? "#ff93000A" : "#ff0C1F13"
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.margins: 10
height: 5
z: 2
color: root.failed ? "#ff93000A" : "#ff0C1F13"
property real maxWidth: Math.max(title.width, info.width)
anchors {
left: parent.left
leftMargin: (parent.width - maxWidth) / 2
bottom: parent.bottom
bottomMargin: 10
}
height: root.progressHeight
radius: 9999
PropertyAnimation {
id: anim
target: bar
property: "width"
from: rect.width - bar.anchors.margins * 2
from: Math.max(title.width, info.width)
to: 0
duration: failed ? 10000 : 1000
duration: root.failed ? 10000 : 1000
onFinished: popupLoader.active = false
// Pause the animation when the mouse is hovering over the popup,
@@ -127,15 +144,21 @@ Scope {
}
// Its bg
Rectangle {
z: 1
id: bar_bg
color: failed ? "#30af1b25" : "#4027643e"
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.margins: 10
height: 5
z: 1
color: root.failed ? "#30af1b25" : "#4027643e"
property real maxWidth: Math.max(title.width, info.width)
anchors {
left: parent.left
right: parent.right
leftMargin: (parent.width - maxWidth) / 2
rightMargin: anchors.leftMargin
bottom: parent.bottom
bottomMargin: 10
}
height: root.progressHeight
radius: 9999
width: rect.width - bar.anchors.margins * 2
width: bar.width
}
// We could set `running: true` inside the animation, but the width of the
@@ -144,17 +167,6 @@ Scope {
// properties and children have been initialized.
Component.onCompleted: anim.start()
}
DropShadow {
id: shadow
anchors.fill: rect
horizontalOffset: 0
verticalOffset: 2
radius: 6
samples: radius * 2 + 1 // Ideally should be 2 * radius + 1, see qt docs
color: "#44000000"
source: rect
}
}
}
}