From c665c0ca98d72c172893e8bbd9c893aaa2b9f46e Mon Sep 17 00:00:00 2001 From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com> Date: Mon, 5 May 2025 10:19:46 +1000 Subject: feat: border + colour changes --- modules/background/Background.qml | 34 +++++++++++++++++++++++ modules/background/Border.qml | 57 +++++++++++++++++++++++++++++++++++++++ modules/bar/Panel.qml | 2 +- modules/bar/Pills.qml | 9 +++---- modules/launcher/AppList.qml | 2 +- modules/launcher/Background.qml | 2 +- modules/launcher/Content.qml | 4 +-- modules/launcher/ContentList.qml | 4 +-- modules/launcher/Launcher.qml | 1 + modules/osd/Background.qml | 2 +- modules/osd/Osd.qml | 1 + 11 files changed, 105 insertions(+), 13 deletions(-) create mode 100644 modules/background/Background.qml create mode 100644 modules/background/Border.qml (limited to 'modules') diff --git a/modules/background/Background.qml b/modules/background/Background.qml new file mode 100644 index 0000000..edd7613 --- /dev/null +++ b/modules/background/Background.qml @@ -0,0 +1,34 @@ +import "root:/widgets" +import "root:/config" +import Quickshell +import Quickshell.Wayland +import QtQuick +import QtQuick.Effects + +Variants { + model: Quickshell.screens + + Scope { + id: scope + + required property ShellScreen modelData + + Border { + screen: scope.modelData + } + + StyledWindow { + id: win + + screen: scope.modelData + name: "background" + exclusionMode: ExclusionMode.Ignore + layer: WlrLayer.Background + + anchors.top: true + anchors.bottom: true + anchors.left: true + anchors.right: true + } + } +} diff --git a/modules/background/Border.qml b/modules/background/Border.qml new file mode 100644 index 0000000..752a814 --- /dev/null +++ b/modules/background/Border.qml @@ -0,0 +1,57 @@ +import "root:/widgets" +import "root:/config" +import Quickshell +import QtQuick +import QtQuick.Effects + +StyledWindow { + id: win + + name: "border" + exclusionMode: ExclusionMode.Ignore + + mask: Region { + x: BackgroundConfig.border.thickness + y: BackgroundConfig.border.thickness + width: win.screen.width - BackgroundConfig.border.thickness * 2 + height: win.screen.height - BackgroundConfig.border.thickness * 2 + intersection: Intersection.Xor + } + + anchors.top: true + anchors.bottom: true + anchors.left: true + anchors.right: true + + StyledRect { + id: rect + + anchors.fill: parent + color: Appearance.alpha(Appearance.colours.m3surface, false) + visible: false + } + + Item { + id: mask + + anchors.fill: parent + layer.enabled: true + visible: false + + Rectangle { + anchors.fill: parent + anchors.margins: BackgroundConfig.border.thickness + radius: BackgroundConfig.border.rounding + } + } + + MultiEffect { + anchors.fill: parent + maskEnabled: true + maskInverted: true + maskSource: mask + source: rect + maskThresholdMin: 0.5 + maskSpreadAtMin: 1 + } +} diff --git a/modules/bar/Panel.qml b/modules/bar/Panel.qml index a43b0c2..741fa13 100644 --- a/modules/bar/Panel.qml +++ b/modules/bar/Panel.qml @@ -16,7 +16,7 @@ StyledRect { } vertical: BarConfig.vertical - color: Appearance.alpha(Appearance.colours.m3surfaceContainer, false) + color: Appearance.alpha(Appearance.colours.m3surface, false) anchors.fill: parent BoxLayout { diff --git a/modules/bar/Pills.qml b/modules/bar/Pills.qml index e326827..bb9d08f 100644 --- a/modules/bar/Pills.qml +++ b/modules/bar/Pills.qml @@ -20,10 +20,9 @@ BoxLayout { spacing: Appearance.padding.large anchors.fill: parent - anchors.leftMargin: get(BarConfig.sizes.floatingGapLarge, BarConfig.sizes.floatingGap) - anchors.topMargin: get(BarConfig.sizes.floatingGap, BarConfig.sizes.floatingGapLarge) - anchors.rightMargin: get(BarConfig.sizes.floatingGapLarge, 0) - anchors.bottomMargin: get(0, BarConfig.sizes.floatingGapLarge) + anchors.margins: BarConfig.sizes.floatingGap + anchors.rightMargin: get(BarConfig.sizes.floatingGap, 0) + anchors.bottomMargin: get(0, BarConfig.sizes.floatingGap) Pill { OsIcon { @@ -126,7 +125,7 @@ BoxLayout { } component Pill: PaddedRect { - color: Appearance.alpha(Appearance.colours.m3surfaceContainer, false) + color: Appearance.alpha(Appearance.colours.m3surface, false) radius: Appearance.rounding.full padding: BarConfig.vertical ? [Appearance.padding.large, 0] : [0, Appearance.padding.large] diff --git a/modules/launcher/AppList.qml b/modules/launcher/AppList.qml index 2f352ba..5dfdf8b 100644 --- a/modules/launcher/AppList.qml +++ b/modules/launcher/AppList.qml @@ -39,7 +39,7 @@ ListView { highlight: StyledRect { radius: Appearance.rounding.normal - color: Appearance.alpha(Appearance.colours.m3surfaceContainerHighest, true) + color: Appearance.alpha(Appearance.colours.m3surfaceContainerHigh, true) } delegate: isAction ? actionItem : appItem diff --git a/modules/launcher/Background.qml b/modules/launcher/Background.qml index 0e9f7dd..7bffd26 100644 --- a/modules/launcher/Background.qml +++ b/modules/launcher/Background.qml @@ -16,7 +16,7 @@ Shape { ShapePath { strokeWidth: -1 - fillColor: Appearance.colours.m3surfaceContainer + fillColor: Appearance.colours.m3surface startY: root.wrapperHeight diff --git a/modules/launcher/Content.qml b/modules/launcher/Content.qml index 315835e..41904f7 100644 --- a/modules/launcher/Content.qml +++ b/modules/launcher/Content.qml @@ -24,7 +24,7 @@ Item { StyledRect { id: listWrapper - color: Appearance.alpha(Appearance.colours.m3surfaceContainerHigh, true) + color: Appearance.alpha(Appearance.colours.m3surfaceContainer, true) radius: root.rounding implicitWidth: list.width + root.padding * 2 @@ -61,7 +61,7 @@ Item { placeholderText: qsTr(`Type "${LauncherConfig.actionPrefix}" for commands`) background: StyledRect { - color: Appearance.alpha(Appearance.colours.m3surfaceContainerHigh, true) + color: Appearance.alpha(Appearance.colours.m3surfaceContainer, true) radius: root.rounding } diff --git a/modules/launcher/ContentList.qml b/modules/launcher/ContentList.qml index 74c229a..253bcf0 100644 --- a/modules/launcher/ContentList.qml +++ b/modules/launcher/ContentList.qml @@ -139,7 +139,7 @@ Item { id: icon text: "manage_search" - color: Appearance.colours.m3outline + color: Appearance.colours.m3onSurfaceVariant font.pointSize: Appearance.font.size.extraLarge anchors.verticalCenter: parent.verticalCenter @@ -153,7 +153,7 @@ Item { anchors.verticalCenter: parent.verticalCenter text: qsTr("No results") - color: Appearance.colours.m3outline + color: Appearance.colours.m3onSurfaceVariant font.pointSize: Appearance.font.size.larger font.weight: 500 } diff --git a/modules/launcher/Launcher.qml b/modules/launcher/Launcher.qml index 34e592a..26549f5 100644 --- a/modules/launcher/Launcher.qml +++ b/modules/launcher/Launcher.qml @@ -25,6 +25,7 @@ Scope { item: wrapper } + margins.bottom: BackgroundConfig.border.thickness anchors.top: true anchors.left: true anchors.bottom: true diff --git a/modules/osd/Background.qml b/modules/osd/Background.qml index e0383f5..d8a35b0 100644 --- a/modules/osd/Background.qml +++ b/modules/osd/Background.qml @@ -16,7 +16,7 @@ Shape { ShapePath { strokeWidth: -1 - fillColor: Appearance.colours.m3surfaceContainer + fillColor: Appearance.colours.m3surface startX: root.wrapperWidth diff --git a/modules/osd/Osd.qml b/modules/osd/Osd.qml index 3f6d8bc..d173a44 100644 --- a/modules/osd/Osd.qml +++ b/modules/osd/Osd.qml @@ -64,6 +64,7 @@ Variants { item: wrapper } + margins.right: BackgroundConfig.border.thickness anchors.left: true anchors.right: true height: wrapper.height -- cgit v1.2.3-freya