Redesign Quickshell control center

This commit is contained in:
Mikhail Kilin
2026-07-26 16:51:25 +03:00
parent 6cb1d53a70
commit 4b3109a2dd
17 changed files with 1390 additions and 904 deletions

View File

@@ -9,10 +9,13 @@ import Quickshell.Wayland
Item {
id: root
UiTokens { id: theme }
property bool open: false
property bool dnd: false
property bool toastOpen: false
property var latest: null
property var settings
readonly property int count: server.trackedNotifications ? server.trackedNotifications.values.length : 0
signal dismissed()
@@ -32,7 +35,7 @@ Item {
Timer {
id: toastTimer
interval: 5000
interval: root.settings ? root.settings.notificationPopupDuration : 5000
repeat: false
onTriggered: root.toastOpen = false
}
@@ -48,13 +51,12 @@ Item {
Rectangle {
width: Math.min(390, parent.width - 32)
height: 100
height: 112
anchors.top: parent.top
anchors.right: parent.right
anchors.margins: 16
x: root.settings && root.settings.notificationPosition === "top-left" ? 16 : parent.width - width - 16
radius: 16
color: "#f5f2ea"
border.color: "#d8d0c2"
color: "#181825"
border.color: "#313244"
border.width: 1
MouseArea {
@@ -69,16 +71,26 @@ Item {
anchors.fill: parent
anchors.margins: 14
spacing: 3
Label {
text: root.latest ? root.latest.appName : ""
color: "#7c756c"
font.pixelSize: 11
RowLayout {
Layout.fillWidth: true
elide: Text.ElideRight
spacing: 8
Label {
text: root.latest ? root.latest.appName : ""
color: "#9399b2"
font.pixelSize: 11
Layout.fillWidth: true
elide: Text.ElideRight
}
CCButton {
theme: theme
text: "Close"
onClicked: root.toastOpen = false
}
}
Label {
text: root.latest ? root.latest.summary : ""
color: "#252321"
color: "#cdd6f4"
font.pixelSize: 16
font.bold: true
Layout.fillWidth: true
@@ -86,7 +98,7 @@ Item {
}
Label {
text: root.latest ? root.latest.body : ""
color: "#5f5952"
color: "#9399b2"
Layout.fillWidth: true
elide: Text.ElideRight
}
@@ -115,8 +127,8 @@ Item {
anchors.right: parent.right
anchors.margins: 16
radius: 20
color: "#f5f2ea"
border.color: "#d8d0c2"
color: "#11111b"
border.color: "#313244"
border.width: 1
z: 1
@@ -134,16 +146,18 @@ Item {
Layout.fillWidth: true
Label {
text: "Notifications"
color: "#252321"
color: "#cdd6f4"
font.pixelSize: 22
font.bold: true
Layout.fillWidth: true
}
Button {
CCButton {
theme: theme
text: root.dnd ? "DND on" : "DND off"
onClicked: root.dnd = !root.dnd
}
Button {
CCButton {
theme: theme
text: "Close"
onClicked: root.dismissed()
}
@@ -152,7 +166,7 @@ Item {
Label {
visible: root.count === 0
text: "No notifications"
color: "#7c756c"
color: "#9399b2"
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: 18
}
@@ -173,7 +187,7 @@ Item {
Layout.fillWidth: true
implicitHeight: notificationColumn.implicitHeight + 22
radius: 14
color: "#e8e3da"
color: "#181825"
ColumnLayout {
id: notificationColumn
@@ -185,19 +199,20 @@ Item {
Layout.fillWidth: true
Label {
text: modelData.appName
color: "#7c756c"
color: "#9399b2"
font.pixelSize: 11
Layout.fillWidth: true
elide: Text.ElideRight
}
Button {
CCButton {
theme: theme
text: "x"
onClicked: modelData.dismiss()
}
}
Label {
text: modelData.summary
color: "#252321"
color: "#cdd6f4"
font.pixelSize: 15
font.bold: true
Layout.fillWidth: true
@@ -205,7 +220,7 @@ Item {
}
Label {
text: modelData.body
color: "#5f5952"
color: "#9399b2"
Layout.fillWidth: true
wrapMode: Text.Wrap
}