Redesign Quickshell control center
This commit is contained in:
@@ -9,6 +9,8 @@ import Quickshell.Wayland
|
||||
Item {
|
||||
id: root
|
||||
|
||||
UiTokens { id: theme }
|
||||
|
||||
property bool open: false
|
||||
property var selectedPlayer: null
|
||||
property var player: selectedPlayer
|
||||
@@ -51,8 +53,8 @@ Item {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.topMargin: 52
|
||||
radius: 20
|
||||
color: "#f5f2ea"
|
||||
border.color: "#d8d0c2"
|
||||
color: "#11111b"
|
||||
border.color: "#313244"
|
||||
border.width: 1
|
||||
z: 1
|
||||
|
||||
@@ -70,30 +72,20 @@ Item {
|
||||
Layout.fillWidth: true
|
||||
Label {
|
||||
text: "Media"
|
||||
color: "#252321"
|
||||
color: "#cdd6f4"
|
||||
font.pixelSize: 20
|
||||
font.bold: true
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
Label {
|
||||
text: root.player ? root.player.identity : "No player"
|
||||
color: "#7c756c"
|
||||
color: "#9399b2"
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
Rectangle {
|
||||
width: 26
|
||||
height: 26
|
||||
radius: 13
|
||||
color: "#e5e0d7"
|
||||
Label {
|
||||
anchors.centerIn: parent
|
||||
text: "x"
|
||||
color: "#6e675f"
|
||||
}
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: root.dismissed()
|
||||
}
|
||||
CCButton {
|
||||
theme: theme
|
||||
text: "Close"
|
||||
onClicked: root.dismissed()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -107,7 +99,7 @@ Item {
|
||||
Layout.preferredWidth: 132
|
||||
Layout.preferredHeight: 132
|
||||
radius: 14
|
||||
color: "#e5e0d7"
|
||||
color: "#181825"
|
||||
clip: true
|
||||
|
||||
Image {
|
||||
@@ -132,7 +124,7 @@ Item {
|
||||
|
||||
Label {
|
||||
text: root.player ? (root.player.trackTitle || "Unknown track") : ""
|
||||
color: "#252321"
|
||||
color: "#cdd6f4"
|
||||
font.pixelSize: 17
|
||||
font.bold: true
|
||||
elide: Text.ElideRight
|
||||
@@ -140,20 +132,21 @@ Item {
|
||||
}
|
||||
Label {
|
||||
text: root.player ? (root.player.trackArtist || root.player.trackAlbum || "Unknown artist") : ""
|
||||
color: "#7c756c"
|
||||
color: "#9399b2"
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
Item { Layout.fillHeight: true }
|
||||
Label {
|
||||
text: root.player ? root.formatTime(root.player.position) + " / " + root.formatTime(root.player.length) : ""
|
||||
color: "#7c756c"
|
||||
color: "#9399b2"
|
||||
font.pixelSize: 11
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Slider {
|
||||
CCSlider {
|
||||
theme: theme
|
||||
visible: root.player && root.player.length > 0
|
||||
Layout.fillWidth: true
|
||||
from: 0
|
||||
@@ -169,17 +162,20 @@ Item {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
spacing: 14
|
||||
|
||||
Button {
|
||||
CCButton {
|
||||
theme: theme
|
||||
text: "Prev"
|
||||
enabled: !!(root.player && root.player.canGoPrevious)
|
||||
onClicked: root.player.previous()
|
||||
}
|
||||
Button {
|
||||
CCButton {
|
||||
theme: theme
|
||||
text: root.player && root.player.playbackState === MprisPlaybackState.Playing ? "Pause" : "Play"
|
||||
enabled: !!(root.player && root.player.canTogglePlaying)
|
||||
onClicked: root.player.togglePlaying()
|
||||
}
|
||||
Button {
|
||||
CCButton {
|
||||
theme: theme
|
||||
text: "Next"
|
||||
enabled: !!(root.player && root.player.canGoNext)
|
||||
onClicked: root.player.next()
|
||||
@@ -191,13 +187,14 @@ Item {
|
||||
Layout.fillWidth: true
|
||||
Label {
|
||||
text: "Players"
|
||||
color: "#7c756c"
|
||||
color: "#9399b2"
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
Repeater {
|
||||
model: Mpris.players
|
||||
delegate: Button {
|
||||
delegate: CCButton {
|
||||
required property var modelData
|
||||
theme: theme
|
||||
text: modelData.identity
|
||||
onClicked: root.selectedPlayer = modelData
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user