update settings schema

This commit is contained in:
kossLAN 2025-06-10 21:46:33 -04:00
parent b55f89a00d
commit 9aa51c86da
Signed by: kossLAN
SSH key fingerprint: SHA256:bdV0x+wdQHGJ6LgmstH3KV8OpWY+OOFmJcPcB0wQPV8
25 changed files with 342 additions and 103 deletions

View file

@ -5,7 +5,8 @@ import Quickshell
import Quickshell.Io import Quickshell.Io
Singleton { Singleton {
property alias settings: jsonAdapter property alias settings: jsonAdapter.settings
property alias colors: jsonAdapter.colors
FileView { FileView {
path: `${Quickshell.env("XDG_DATA_HOME")}/quickshell/settings.json` path: `${Quickshell.env("XDG_DATA_HOME")}/quickshell/settings.json`
@ -16,9 +17,12 @@ Singleton {
JsonAdapter { JsonAdapter {
id: jsonAdapter id: jsonAdapter
property QtObject settings: QtObject {
property int barHeight: 25 property int barHeight: 25
property string wallpaperUrl: Qt.resolvedUrl("root:resources/wallpapers/pixelart0.jpg") property string wallpaperUrl: Qt.resolvedUrl("root:resources/wallpapers/pixelart0.jpg")
property string colorScheme: "scheme-fruit-salad" property string colorScheme: "scheme-fruit-salad"
}
property var colors: { property var colors: {
"background": "#131313", "background": "#131313",

View file

@ -5,7 +5,7 @@ import ".."
Text { Text {
id: windowText id: windowText
text: ToplevelManager.activeToplevel?.title ?? "" text: ToplevelManager.activeToplevel?.title ?? ""
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
font.pointSize: 11 font.pointSize: 11
visible: text !== "" visible: text !== ""
elide: Text.ElideRight elide: Text.ElideRight

View file

@ -11,7 +11,7 @@ import ".."
PanelWindow { PanelWindow {
id: root id: root
color: ShellSettings.settings.colors["surface"] color: ShellSettings.colors["surface"]
implicitHeight: ShellSettings.settings.barHeight implicitHeight: ShellSettings.settings.barHeight
property alias popup: popupWindow property alias popup: popupWindow
@ -75,6 +75,19 @@ PanelWindow {
// bar: root // bar: root
// } // }
// Text {
// text: "home"
// color: "white"
// font.family: "Material Symbols Rounded"
// renderType: Text.NativeRendering
// textFormat: Text.PlainText
// font.pointSize: 12
//
// font.variableAxes: {
// "FILL": 1
// }
// }
BatteryIndicator { BatteryIndicator {
id: batteryIndicator id: batteryIndicator
popup: root.popup popup: root.popup
@ -89,7 +102,7 @@ PanelWindow {
Clock { Clock {
id: clock id: clock
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
} }
} }
} }

View file

@ -33,15 +33,15 @@ RowLayout {
} }
color: { color: {
let value = Qt.color(ShellSettings.settings.colors["secondary"]).darker(2); let value = Qt.color(ShellSettings.colors["secondary"]).darker(2);
if (!modelData?.id || !Hyprland.focusedMonitor?.activeWorkspace?.id) if (!modelData?.id || !Hyprland.focusedMonitor?.activeWorkspace?.id)
return value; return value;
if (workspaceButton.containsMouse) { if (workspaceButton.containsMouse) {
value = ShellSettings.settings.colors["on_primary"]; value = ShellSettings.colors["on_primary"];
} else if (Hyprland.focusedMonitor.activeWorkspace.id == modelData.id) { } else if (Hyprland.focusedMonitor.activeWorkspace.id == modelData.id) {
value = ShellSettings.settings.colors["primary"]; value = ShellSettings.colors["primary"];
} }
return value; return value;

View file

@ -59,7 +59,7 @@ Item {
Rectangle { Rectangle {
id: highlight id: highlight
color: batteryButton.containsMouse ? ShellSettings.settings.colors["primary"] : "transparent" color: batteryButton.containsMouse ? ShellSettings.colors["primary"] : "transparent"
// radius: width / 2 // radius: width / 2
radius: 10 radius: 10
@ -96,7 +96,7 @@ Item {
Rectangle { Rectangle {
id: batteryBackground id: batteryBackground
color: Qt.color(ShellSettings.settings.colors["surface"]).lighter(4) color: Qt.color(ShellSettings.colors["surface"]).lighter(4)
opacity: 0.75 opacity: 0.75
anchors { anchors {
fill: parent fill: parent
@ -107,7 +107,7 @@ Item {
Rectangle { Rectangle {
id: batteryPercentage id: batteryPercentage
width: (parent.width - 4) * UPower.displayDevice.percentage width: (parent.width - 4) * UPower.displayDevice.percentage
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
anchors { anchors {
left: batteryBackground.left left: batteryBackground.left

View file

@ -48,7 +48,7 @@ PopupWindow {
// Add drop shadow effect // Add drop shadow effect
// Rectangle { // Rectangle {
// id: shadowSource // id: shadowSource
// color: ShellSettings.settings.colors["surface"] // color: ShellSettings.colors["surface"]
// radius: 8 // radius: 8
// opacity: container.opacity // opacity: container.opacity
// width: container.width // width: container.width
@ -97,7 +97,7 @@ PopupWindow {
Rectangle { Rectangle {
id: container id: container
color: ShellSettings.settings.colors["surface"] color: ShellSettings.colors["surface"]
radius: 18 radius: 18
opacity: 0 opacity: 0
width: parent.width - 10 width: parent.width - 10
@ -133,7 +133,7 @@ PopupWindow {
// //
// Rectangle { // Rectangle {
// radius: 20 // radius: 20
// color: ShellSettings.settings.colors["surface_container_high"] // color: ShellSettings.colors["surface_container_high"]
// Layout.fillWidth: true // Layout.fillWidth: true
// Layout.fillHeight: true // Layout.fillHeight: true
// //
@ -153,7 +153,7 @@ PopupWindow {
// //
// Text { // Text {
// text: "kossLAN" // text: "kossLAN"
// color: ShellSettings.settings.colors["inverse_surface"] // color: ShellSettings.colors["inverse_surface"]
// font.pointSize: 12 // font.pointSize: 12
// verticalAlignment: Text.AlignVCenter // verticalAlignment: Text.AlignVCenter
// Layout.fillWidth: true // Layout.fillWidth: true
@ -165,7 +165,7 @@ PopupWindow {
// //
// Rectangle { // Rectangle {
// radius: 20 // radius: 20
// color: ShellSettings.settings.colors["surface_container_high"] // color: ShellSettings.colors["surface_container_high"]
// Layout.preferredWidth: powerButtons.implicitWidth + 10 // Layout.preferredWidth: powerButtons.implicitWidth + 10
// Layout.fillHeight: true // Layout.fillHeight: true
// //
@ -195,7 +195,7 @@ PopupWindow {
// //
// Rectangle { // Rectangle {
// radius: 20 // radius: 20
// color: ShellSettings.settings.colors["surface_bright"] // color: ShellSettings.colors["surface_bright"]
// Layout.preferredWidth: 2 // Layout.preferredWidth: 2
// Layout.fillHeight: true // Layout.fillHeight: true
// Layout.topMargin: 4 // Layout.topMargin: 4
@ -217,7 +217,7 @@ PopupWindow {
Layout.fillWidth: true Layout.fillWidth: true
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
radius: 12 radius: 12
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 30 Layout.preferredHeight: 30
@ -232,7 +232,7 @@ PopupWindow {
Repeater { Repeater {
model: [1, 2, 3, 4, 5] model: [1, 2, 3, 4, 5]
delegate: Rectangle { delegate: Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
radius: width / 2 radius: width / 2
Layout.preferredWidth: 45 Layout.preferredWidth: 45
Layout.preferredHeight: 45 Layout.preferredHeight: 45
@ -250,14 +250,14 @@ PopupWindow {
Layout.preferredHeight: 55 Layout.preferredHeight: 55
Rectangle { Rectangle {
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
radius: width / 2 radius: width / 2
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
} }
Rectangle { Rectangle {
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
radius: width / 2 radius: width / 2
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
@ -270,14 +270,14 @@ PopupWindow {
Layout.preferredHeight: 55 Layout.preferredHeight: 55
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
radius: width / 2 radius: width / 2
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
} }
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
radius: width / 2 radius: width / 2
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true

View file

@ -9,7 +9,7 @@ Rectangle {
id: root id: root
required property PwNode node required property PwNode node
required property var isSink required property var isSink
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
PwObjectTracker { PwObjectTracker {
id: defaultSourceTracker id: defaultSourceTracker
@ -27,7 +27,7 @@ Rectangle {
spacing: 10 spacing: 10
Text { Text {
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
text: { text: {
// Taken from quickshell-examples // Taken from quickshell-examples

View file

@ -42,7 +42,7 @@ Rectangle {
anchors.fill: parent anchors.fill: parent
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
Widgets.IconButton { Widgets.IconButton {
id: arrowButton id: arrowButton
@ -80,7 +80,7 @@ Rectangle {
Rectangle { Rectangle {
id: divider id: divider
color: ShellSettings.settings.colors["surface_bright"] color: ShellSettings.colors["surface_bright"]
height: 2 height: 2
width: parent.width width: parent.width
anchors.top: headerSection.bottom anchors.top: headerSection.bottom
@ -140,7 +140,7 @@ Rectangle {
height: root.baseHeight height: root.baseHeight
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
IconImage { IconImage {
implicitSize: 32 implicitSize: 32

View file

@ -19,7 +19,7 @@ Item {
} }
Rectangle { Rectangle {
color: mouseArea.containsMouse ? ShellSettings.settings.colors["primary"] : "transparent" color: mouseArea.containsMouse ? ShellSettings.colors["primary"] : "transparent"
radius: 5 radius: 5
anchors { anchors {
@ -61,7 +61,7 @@ Item {
} }
Rectangle { Rectangle {
color: mouseArea.containsMouse ? ShellSettings.settings.colors["inverse_primary"] : ShellSettings.settings.colors["inverse_surface"] color: mouseArea.containsMouse ? ShellSettings.colors["inverse_primary"] : ShellSettings.colors["inverse_surface"]
anchors.fill: parent anchors.fill: parent
} }
} }

View file

@ -102,7 +102,7 @@ PopupWindow {
WrapperRectangle { WrapperRectangle {
id: popupContainer id: popupContainer
color: ShellSettings.settings.colors["surface"] color: ShellSettings.colors["surface"]
radius: 12 radius: 12
margin: 8 margin: 8
clip: true clip: true

View file

@ -77,7 +77,7 @@ RowLayout {
Rectangle { Rectangle {
id: trayContainer id: trayContainer
color: trayButton.containsMouse ? ShellSettings.settings.colors["primary"] : "transparent" color: trayButton.containsMouse ? ShellSettings.colors["primary"] : "transparent"
radius: width / 2 radius: width / 2
implicitHeight: parent.height - 2 implicitHeight: parent.height - 2
implicitWidth: parent.height - 2 implicitWidth: parent.height - 2

View file

@ -31,7 +31,7 @@ ColumnLayout {
return "transparent"; return "transparent";
if (entryArea.containsMouse) if (entryArea.containsMouse)
return ShellSettings.settings.colors["primary"]; return ShellSettings.colors["primary"];
return "transparent"; return "transparent";
} }
@ -92,13 +92,13 @@ ColumnLayout {
text: root.menuData?.text ?? "" text: root.menuData?.text ?? ""
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
color: { color: {
let color = Qt.color(ShellSettings.settings.colors["inverse_surface"]); let color = Qt.color(ShellSettings.colors["inverse_surface"]);
if (!root.menuData?.enabled) if (!root.menuData?.enabled)
return color.darker(2); return color.darker(2);
if (entryArea.containsMouse) if (entryArea.containsMouse)
return Qt.color(ShellSettings.settings.colors["inverse_primary"]); return Qt.color(ShellSettings.colors["inverse_primary"]);
return color; return color;
} }
@ -141,7 +141,7 @@ ColumnLayout {
WrapperRectangle { WrapperRectangle {
id: subTrayMenu id: subTrayMenu
color: ShellSettings.settings.colors["surface_container"] color: ShellSettings.colors["surface_container"]
radius: 8 radius: 8
visible: false visible: false
Layout.fillWidth: true Layout.fillWidth: true

View file

@ -12,7 +12,7 @@ ColumnLayout {
Rectangle { Rectangle {
visible: (root.modelData?.isSeparator ?? false) visible: (root.modelData?.isSeparator ?? false)
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 2 Layout.preferredHeight: 2
Layout.leftMargin: 8 Layout.leftMargin: 8

View file

@ -44,7 +44,7 @@ Singleton {
Rectangle { Rectangle {
id: container id: container
color: ShellSettings.settings.colors["surface"] color: ShellSettings.colors["surface"]
radius: 18 radius: 18
anchors { anchors {
@ -71,8 +71,8 @@ Singleton {
Layout.fillWidth: true Layout.fillWidth: true
implicitHeight: searchbox.implicitHeight + 15 implicitHeight: searchbox.implicitHeight + 15
radius: 10 radius: 10
color: ShellSettings.settings.colors["surface_container"] color: ShellSettings.colors["surface_container"]
border.color: ShellSettings.settings.colors["secondary"] border.color: ShellSettings.colors["secondary"]
RowLayout { RowLayout {
id: searchbox id: searchbox
@ -82,7 +82,7 @@ Singleton {
TextInput { TextInput {
id: search id: search
Layout.fillWidth: true Layout.fillWidth: true
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
focus: true focus: true
Keys.forwardTo: [list] Keys.forwardTo: [list]
@ -256,7 +256,7 @@ Singleton {
highlight: Rectangle { highlight: Rectangle {
radius: 12 radius: 12
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
} }
keyNavigationEnabled: true keyNavigationEnabled: true
@ -297,7 +297,7 @@ Singleton {
} }
Text { Text {
text: modelData.name text: modelData.name
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
} }
} }

View file

@ -19,7 +19,7 @@ Item {
Rectangle { Rectangle {
id: container id: container
radius: 10 radius: 10
color: ShellSettings.settings.colors["surface_container"] color: ShellSettings.colors["surface_container"]
anchors.fill: parent anchors.fill: parent
Item { Item {
@ -110,7 +110,7 @@ Item {
Text { Text {
id: appName id: appName
text: root.notification.appName text: root.notification.appName
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
font.pointSize: 11 font.pointSize: 11
font.bold: true font.bold: true
elide: Text.ElideRight elide: Text.ElideRight
@ -124,7 +124,7 @@ Item {
Text { Text {
id: summaryText id: summaryText
text: root.notification.summary text: root.notification.summary
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
font.pointSize: 11 font.pointSize: 11
elide: Text.ElideRight elide: Text.ElideRight
maximumLineCount: 1 maximumLineCount: 1
@ -156,7 +156,7 @@ Item {
ctx.beginPath(); ctx.beginPath();
ctx.arc(centerX, centerY, radius, -Math.PI / 2, -Math.PI / 2 + 2 * Math.PI * progress); ctx.arc(centerX, centerY, radius, -Math.PI / 2, -Math.PI / 2 + 2 * Math.PI * progress);
ctx.strokeStyle = ShellSettings.settings.colors["primary"]; ctx.strokeStyle = ShellSettings.colors["primary"];
ctx.lineWidth = 2; ctx.lineWidth = 2;
ctx.stroke(); ctx.stroke();
} }
@ -204,7 +204,7 @@ Item {
Text { Text {
id: bodyText id: bodyText
text: root.notification.body text: root.notification.body
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
font.pointSize: 11 font.pointSize: 11
wrapMode: Text.Wrap wrapMode: Text.Wrap
elide: Text.ElideRight elide: Text.ElideRight

View file

@ -140,7 +140,7 @@ Singleton {
required property int index required property int index
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: groupContent.implicitHeight + 24 Layout.preferredHeight: groupContent.implicitHeight + 24
color: ShellSettings.settings.colors["surface_container"] color: ShellSettings.colors["surface_container"]
antialiasing: true antialiasing: true
topLeftRadius: index === 0 ? 25 : 5 topLeftRadius: index === 0 ? 25 : 5
@ -207,7 +207,7 @@ Singleton {
text: summaryGroup.modelData.summary text: summaryGroup.modelData.summary
font.pixelSize: 16 font.pixelSize: 16
font.weight: Font.Medium font.weight: Font.Medium
color: ShellSettings.settings.colors["on_surface"] color: ShellSettings.colors["on_surface"]
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
maximumLineCount: 2 maximumLineCount: 2
elide: Text.ElideRight elide: Text.ElideRight
@ -218,7 +218,7 @@ Singleton {
Text { Text {
text: "now" text: "now"
font.pixelSize: 14 font.pixelSize: 14
color: ShellSettings.settings.colors["on_surface_variant"] color: ShellSettings.colors["on_surface_variant"]
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
} }
} }
@ -242,7 +242,7 @@ Singleton {
Layout.fillWidth: true Layout.fillWidth: true
text: bodyDelegate.modelData.body text: bodyDelegate.modelData.body
font.pixelSize: 14 font.pixelSize: 14
color: ShellSettings.settings.colors["on_surface_variant"] color: ShellSettings.colors["on_surface_variant"]
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
maximumLineCount: 4 maximumLineCount: 4
elide: Text.ElideRight elide: Text.ElideRight

View file

@ -37,7 +37,7 @@ Singleton {
activeAsync: persist.windowOpen activeAsync: persist.windowOpen
FloatingWindow { FloatingWindow {
color: ShellSettings.settings.colors["surface"] color: ShellSettings.colors["surface"]
implicitWidth: 840 implicitWidth: 840
implicitHeight: 845 implicitHeight: 845
@ -90,7 +90,7 @@ Singleton {
} }
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container"] color: ShellSettings.colors["surface_container"]
radius: 20 radius: 20
Layout.fillWidth: true Layout.fillWidth: true
Layout.fillHeight: true Layout.fillHeight: true
@ -122,7 +122,7 @@ Singleton {
width: 100 width: 100
height: 100 height: 100
color: paletteSelect.containsMouse ? ShellSettings.settings.colors["surface_container_highest"] : ShellSettings.settings.colors["surface_container_high"] color: paletteSelect.containsMouse ? ShellSettings.colors["surface_container_highest"] : ShellSettings.colors["surface_container_high"]
radius: 20 radius: 20
MouseArea { MouseArea {
@ -214,7 +214,7 @@ Singleton {
} }
Rectangle { Rectangle {
color: ShellSettings.settings.colors["surface_container_high"] color: ShellSettings.colors["surface_container_high"]
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 1 Layout.preferredHeight: 1
} }
@ -251,7 +251,7 @@ Singleton {
radius: 20 radius: 20
border { border {
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
width: 2 width: 2
} }

View file

@ -1,5 +1,6 @@
//@ pragma UseQApplication //@ pragma UseQApplication
//@ pragma IconTheme Papirus-Dark //@ pragma IconTheme Papirus-Dark
import Quickshell import Quickshell
import QtQuick import QtQuick
import "bar" as Bar import "bar" as Bar

View file

@ -52,10 +52,28 @@ Scope {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
radius: width / 2 radius: width / 2
color: ShellSettings.settings.colors["surface"] color: ShellSettings.colors["surface"]
Item { ColumnLayout {
spacing: 10
anchors {
fill: parent
margins: 8
}
Rectangle {
radius: width / 2
Layout.fillWidth: true
Layout.preferredHeight: width
}
Rectangle {
id: sliderContainer id: sliderContainer
color: "gray"
Layout.fillWidth: true
Layout.fillHeight: true
layer.enabled: true layer.enabled: true
layer.effect: OpacityMask { layer.effect: OpacityMask {
source: Rectangle { source: Rectangle {
@ -73,14 +91,9 @@ Scope {
} }
} }
anchors {
fill: parent
margins: 8
}
Rectangle { Rectangle {
radius: width / 2 radius: width / 2
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
implicitHeight: Math.max(parent.width, parent.height * (Pipewire.defaultAudioSink?.audio.volume ?? 0)) implicitHeight: Math.max(parent.width, parent.height * (Pipewire.defaultAudioSink?.audio.volume ?? 0))
anchors { anchors {
@ -101,12 +114,13 @@ Scope {
} }
} }
} }
}
// Rectangle { // Rectangle {
// anchors.fill: parent // anchors.fill: parent
// radius: 8 // radius: 8
// color: { // color: {
// let color = ShellSettings.settings.colors["surface"]; // let color = ShellSettings.colors["surface"];
// return Qt.rgba(color.r, color.g, color.b, 0.8); // return Qt.rgba(color.r, color.g, color.b, 0.8);
// } // }
// //
@ -128,7 +142,7 @@ Scope {
// implicitHeight: 10 // implicitHeight: 10
// radius: 20 // radius: 20
// color: { // color: {
// let color = ShellSettings.settings.colors["inverse_surface"]; // let color = ShellSettings.colors["inverse_surface"];
// return Qt.rgba(color.r, color.g, color.b, 0.5); // return Qt.rgba(color.r, color.g, color.b, 0.5);
// } // }
// //
@ -143,7 +157,7 @@ Scope {
// } // }
// //
// Rectangle { // Rectangle {
// color: ShellSettings.settings.colors["primary"] // color: ShellSettings.colors["primary"]
// anchors { // anchors {
// left: parent.left // left: parent.left
// top: parent.top // top: parent.top

View file

@ -61,7 +61,7 @@ Scope {
onRead: data => { onRead: data => {
console.log(ShellSettings.settings.colorScheme); console.log(ShellSettings.settings.colorScheme);
try { try {
ShellSettings.settings.colors = JSON.parse(data)['colors']['dark']; ShellSettings.colors = JSON.parse(data)['colors']['dark'];
} catch (e) {} } catch (e) {}
} }
} }

View file

@ -10,8 +10,8 @@ Item {
property var padding: 0 property var padding: 0
property var radius: 20 property var radius: 20
property var activeRectangle: true property var activeRectangle: true
property var color: ShellSettings.settings.colors["inverse_surface"] property var color: ShellSettings.colors["inverse_surface"]
property var activeColor: ShellSettings.settings.colors["inverse_primary"] property var activeColor: ShellSettings.colors["inverse_primary"]
signal clicked signal clicked
implicitWidth: implicitSize implicitWidth: implicitSize
@ -19,7 +19,7 @@ Item {
Rectangle { Rectangle {
id: iconBackground id: iconBackground
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
radius: root.radius radius: root.radius
visible: iconButton.containsMouse && root.activeRectangle visible: iconButton.containsMouse && root.activeRectangle
anchors.fill: parent anchors.fill: parent

View file

@ -0,0 +1,3 @@
import QtQuick
Rectangle {}

View file

@ -8,13 +8,13 @@ import ".."
Slider { Slider {
id: slider id: slider
implicitHeight: 8 implicitHeight: 8
property var accentColor: ShellSettings.settings.colors["primary"] property var accentColor: ShellSettings.colors["primary"]
background: Rectangle { background: Rectangle {
id: sliderContainer id: sliderContainer
width: slider.availableWidth width: slider.availableWidth
height: slider.implicitHeight height: slider.implicitHeight
color: ShellSettings.settings.colors["inverse_surface"] color: ShellSettings.colors["inverse_surface"]
radius: 4 radius: 4
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter

View file

@ -2,7 +2,7 @@ import QtQuick
import ".." import ".."
Rectangle { Rectangle {
color: ShellSettings.settings.colors["primary"] color: ShellSettings.colors["primary"]
radius: 5 radius: 5
width: 7.5 width: 7.5
height: 7.5 height: 7.5

204
widgets/TextButton.qml Normal file
View file

@ -0,0 +1,204 @@
import QtQuick
import Qt5Compat.GraphicalEffects
import Quickshell
import Quickshell.Widgets
import ".."
Item {
id: root
property string icon
property bool enabled: true
property bool highlight: true
property bool clickable: false
property bool useMask: true
property bool useVariableFill: false
property real size: 18
property real outerSize: size
property color hoverColor: ShellSettings.colors["inverse_primary"]
property color iconColor: ShellSettings.colors["primary"]
property real buttonRadius: 6
property real padding: 4
property real fillValue: 0.0
property real fillTarget: 0.0
property real fillHover: 1.0
property real fillNormal: 0.0
property int fillDuration: 300
signal clicked(var mouse)
implicitWidth: outerSize + (padding * 2)
implicitHeight: outerSize + (padding * 2)
Rectangle {
id: backgroundRect
anchors.fill: parent
radius: root.buttonRadius
color: mouseArea.containsMouse && root.highlight ? root.hoverColor : "transparent"
visible: root.highlight
Behavior on color {
ColorAnimation {
duration: 200
easing.type: Easing.InOutCubic
}
}
}
NumberAnimation {
id: fillAnimation
target: root
property: "fillValue"
duration: root.fillDuration
easing.type: Easing.OutCubic
to: root.fillTarget
}
Text {
id: variableFillIcon
visible: root.useVariableFill
anchors.centerIn: parent
font.family: "Material Symbols Outlined"
renderType: Text.NativeRendering
textFormat: Text.PlainText
font.pointSize: root.size * 0.8
text: root.icon
color: root.enabled ?? root.iconColor
opacity: root.enabled ? 1.0 : 0.5
font.variableAxes: {
"FILL": root.fillValue.toFixed(1)
}
Behavior on color {
ColorAnimation {
duration: 200
easing.type: Easing.InOutCubic
}
}
}
Item {
id: maskedIcon
visible: root.useMask && !root.useVariableFill
anchors.centerIn: parent
width: root.size
height: root.size
smooth: true
layer.enabled: true
layer.effect: OpacityMask {
source: Rectangle {
width: root.size
height: root.size
color: "white"
}
maskSource: IconImage {
mipmap: true
implicitSize: root.size
source: Quickshell.iconPath(root.icon)
opacity: root.enabled ? 1.0 : 0.5
smooth: true
}
}
transform: Translate {
x: mouseArea.containsMouse ? -1 : 0
y: mouseArea.containsMouse ? -2 : 0
Behavior on x {
NumberAnimation {
duration: 450
easing.type: Easing.OutElastic
easing.amplitude: 1.0
easing.period: 0.3
}
}
Behavior on y {
NumberAnimation {
duration: 450
easing.type: Easing.OutElastic
easing.amplitude: 1.0
easing.period: 0.3
}
}
}
Rectangle {
anchors.fill: parent
color: root.enabled ?? root.iconColor
Behavior on color {
ColorAnimation {
duration: 200
easing.type: Easing.InOutCubic
}
}
}
}
IconImage {
id: unmaskedIcon
visible: !root.useMask && !root.useVariableFill
anchors.centerIn: parent
source: Quickshell.iconPath(root.icon)
implicitSize: root.size
opacity: root.enabled ? 1.0 : 0.5
transform: Translate {
x: mouseArea.containsMouse ? -1 : 0
y: mouseArea.containsMouse ? -2 : 0
Behavior on x {
NumberAnimation {
duration: 350
easing.type: Easing.OutElastic
easing.amplitude: 1.0
easing.period: 0.6
}
}
Behavior on y {
NumberAnimation {
duration: 350
easing.type: Easing.OutElastic
easing.amplitude: 1.0
easing.period: 0.6
}
}
}
Behavior on opacity {
NumberAnimation {
duration: 200
easing.type: Easing.InOutCubic
}
}
}
MouseArea {
id: mouseArea
anchors.fill: parent
cursorShape: root.clickable ? Qt.PointingHandCursor : ""
enabled: root.clickable && root.enabled
hoverEnabled: true
acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
onClicked: function (mouse) {
root.clicked(mouse);
}
onContainsMouseChanged: {
if (root.useVariableFill) {
root.fillTarget = containsMouse ? root.fillHover : root.fillNormal;
fillAnimation.restart();
}
}
}
Component.onCompleted: {
if (useVariableFill) {
fillValue = fillNormal;
}
}
}