From 0bc8d5f13a787bab2e8d6c4a64aea748409491ba Mon Sep 17 00:00:00 2001 From: lucy Date: Tue, 15 Sep 2026 21:33:50 +0200 Subject: [PATCH] overhaul style --- Colors.qml | 3 +++ modules/applets/WallPicker.qml | 8 +++++--- modules/bar/Bar.qml | 4 +++- modules/bar/Ws.qml | 10 +++++----- modules/overlays/Top.qml | 4 +--- settings/Config.qml | 1 + settings/settings.json | 11 ++++++----- widgets/BarComponent.qml | 5 ++++- widgets/StyledIcon.qml | 9 +++------ widgets/StyledText.qml | 2 +- 10 files changed, 32 insertions(+), 25 deletions(-) diff --git a/Colors.qml b/Colors.qml index 0aa2ace..6396983 100644 --- a/Colors.qml +++ b/Colors.qml @@ -8,6 +8,9 @@ import qs.settings Singleton { id: root property alias c: colors + property string accent: colors[Config.cfg.appearance.accent] + property string font: colors.base05 + FileView { id: colorView path: Qt.resolvedUrl(Quickshell.shellDir + "/schemes/" + Config.cfg.appearance.currentTheme) diff --git a/modules/applets/WallPicker.qml b/modules/applets/WallPicker.qml index 773e9c5..cef6dd3 100644 --- a/modules/applets/WallPicker.qml +++ b/modules/applets/WallPicker.qml @@ -9,6 +9,8 @@ import qs.settings Rectangle { id: wallPicker color: "transparent" + radius: Config.cfg.appearance.rounding + clip: true MouseArea { anchors.fill: parent acceptedButtons: Qt.AllButtons @@ -16,7 +18,7 @@ Rectangle { Rectangle { id: container anchors.fill: parent - color: Colors.c.base00 + color: Colors.c.base01 radius: Config.cfg.appearance.rounding GridView { id: wallpaperLayout @@ -24,7 +26,7 @@ Rectangle { snapMode: GridView.SnapOneRow flow: GridView.FlowTopToBottom cellHeight: container.height - cellWidth: container.width / 6 + cellWidth: 300 anchors.fill: parent anchors.centerIn: parent anchors.margins: 10 @@ -33,7 +35,7 @@ Rectangle { id: wallTile clip: true required property var modelData - radius: Config.cfg.appearance.rounding / 1.5 + radius: Config.cfg.appearance.rounding - 10 color: 'transparent' implicitWidth: wallpaperLayout.cellWidth - 20 implicitHeight: wallpaperLayout.cellHeight - 20 diff --git a/modules/bar/Bar.qml b/modules/bar/Bar.qml index 4ea203e..31490ea 100644 --- a/modules/bar/Bar.qml +++ b/modules/bar/Bar.qml @@ -23,11 +23,13 @@ Variants { margins.left: Config.cfg.bar.floating ? 10 : 0 margins.right: Config.cfg.bar.floating ? 10 : 0 Rectangle { - color: Colors.c.base01 + color: Colors.c.base00 radius: Config.cfg.bar.floating ? Config.cfg.appearance.rounding : 0 anchors.fill: parent implicitHeight: parent.height anchors.centerIn: parent + border.width: 1 + border.color: Colors.c.base03 RowLayout { anchors.leftMargin: 4 anchors.left: parent.left diff --git a/modules/bar/Ws.qml b/modules/bar/Ws.qml index 1e276fb..0aa82a9 100644 --- a/modules/bar/Ws.qml +++ b/modules/bar/Ws.qml @@ -17,12 +17,13 @@ BarComponent { spacing: 4 Repeater { model: WindowManager.screenProjection(root.barScreen).windowsets - delegate: BarComponent { + delegate: Rectangle { id: wsContainer required property var modelData + radius: Config.cfg.appearance.rounding implicitWidth: 16 implicitHeight: implicitWidth - color: modelData.active ? Colors.c.base0D : 'transparent' + color: modelData.active ? Colors.accent : 'transparent' MouseArea { id: clickHandler anchors.fill: parent @@ -34,9 +35,8 @@ BarComponent { id: wsText anchors.centerIn: parent text: parent.modelData.name - color: parent.modelData.shouldDisplay ? parent.modelData.active ? Colors.c.base00 : Colors.c.base0D : Colors.c.base05 - opacity: parent.modelData.shouldDisplay ? 1.0 : 0.3 - font.bold: true + color: parent.modelData.shouldDisplay ? parent.modelData.active ? Colors.c.base00 : Colors.font : Colors.font + opacity: parent.modelData.shouldDisplay ? 1.0 : 0.2 } } } diff --git a/modules/overlays/Top.qml b/modules/overlays/Top.qml index 78ca7b1..a6ebd64 100644 --- a/modules/overlays/Top.qml +++ b/modules/overlays/Top.qml @@ -88,7 +88,6 @@ Variants { height: contentHeight interactive: false visible: count > 0 && Compositor.focusedScreen === root.modelData - model: NotiServer.notifications spacing: 6 delegate: NotiCard { @@ -106,8 +105,7 @@ Variants { anchors.bottom: parent.bottom anchors.left: parent.left anchors.right: parent.right - anchors.margins: 20 - implicitWidth: 1000 + anchors.margins: 30 implicitHeight: 200 Behavior on opacity { NumberAnimation { diff --git a/settings/Config.qml b/settings/Config.qml index c5d24cd..93b009b 100644 --- a/settings/Config.qml +++ b/settings/Config.qml @@ -28,6 +28,7 @@ Singleton { adapter: JsonAdapter { id: cfg property JsonObject appearance: JsonObject { + property string accent: "base0D" property string font: "Iosevka" property int fontSize: 14 property int iconSize: 16 diff --git a/settings/settings.json b/settings/settings.json index 35b66eb..e1d381d 100644 --- a/settings/settings.json +++ b/settings/settings.json @@ -1,18 +1,19 @@ { "appearance": { - "currentTheme": "base16-catppuccin-mocha.json", - "font": "Roboto", + "accent": "base0D", + "currentTheme": "base16-gruvbox-dark.json", + "font": "Inter", "fontSize": 14, - "iconSize": 18, + "iconSize": 16, "rounding": 24 }, "bar": { "floating": true, "height": 40, - "opacity": 1 + "opacity": 0.2 }, "wallpaper": { "wallDir": "/home/lucy/.walls/", - "wallpaper": "/home/lucy/.walls/walkingcastle.png" + "wallpaper": "/home/lucy/.walls/lain_wallpaper.png" } } diff --git a/widgets/BarComponent.qml b/widgets/BarComponent.qml index 8a1a5b6..69c743b 100644 --- a/widgets/BarComponent.qml +++ b/widgets/BarComponent.qml @@ -4,8 +4,11 @@ import qs import qs.settings Rectangle { + property color accent: Colors.c.base02 property bool active: false - color: active ? Colors.c.base03 : Colors.c.base02 + color: active ? Colors.c.base02 : Colors.c.base01 implicitHeight: Config.cfg.bar.height - 8 radius: Config.cfg.appearance.rounding - 4 + border.width: 1 + border.color: Colors.c.base03 } diff --git a/widgets/StyledIcon.qml b/widgets/StyledIcon.qml index 837b25f..7aa514a 100644 --- a/widgets/StyledIcon.qml +++ b/widgets/StyledIcon.qml @@ -5,20 +5,17 @@ import QtQuick.Effects import qs import qs.settings - IconImage { id: root required property string iconName property bool fill: true - source: Qt.resolvedUrl( - fill ? Quickshell.shellDir + "/assets/phosphor-icons/fill/" + iconName + "-fill.svg" : - Quickshell.shellDir + "/assets/phosphor-icons/regular/" + iconName + ".svg") + source: Qt.resolvedUrl(fill ? Quickshell.shellDir + "/assets/phosphor-icons/fill/" + iconName + "-fill.svg" : Quickshell.shellDir + "/assets/phosphor-icons/regular/" + iconName + ".svg") width: Config.cfg.appearance.iconSize height: Config.cfg.appearance.iconSize layer.enabled: true layer.effect: MultiEffect { - colorization: 0.5 - colorizationColor: Colors.c.base0D + colorization: 1.0 + colorizationColor: Colors.font brightness: 1.0 } } diff --git a/widgets/StyledText.qml b/widgets/StyledText.qml index ee01d6a..1666628 100644 --- a/widgets/StyledText.qml +++ b/widgets/StyledText.qml @@ -3,7 +3,7 @@ import qs import qs.settings Text { - color: Colors.c.base05 + color: Colors.font font.family: Config.cfg.appearance.font font.pixelSize: Config.cfg.appearance.fontSize }