Redesign Quickshell control center
This commit is contained in:
@@ -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
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user