From 971e44aaf14eebd9182048ce1853f0c4529d208a Mon Sep 17 00:00:00 2001 From: Damocles Date: Sun, 12 Apr 2026 20:26:25 +0200 Subject: [PATCH 1/2] bar: offset content below gradient, fade gradient to bar bottom --- modules/Bar.qml | 31 ++++++++++++++++++++++++------- 1 file changed, 24 insertions(+), 7 deletions(-) diff --git a/modules/Bar.qml b/modules/Bar.qml index d334d36..4134e5b 100644 --- a/modules/Bar.qml +++ b/modules/Bar.qml @@ -31,7 +31,7 @@ PanelWindow { anchors.top: parent.top anchors.left: parent.left anchors.right: parent.right - height: Math.max(M.Theme.screenRadius + 2, 4) + height: parent.height onPaint: { const ctx = getContext("2d"); @@ -42,21 +42,37 @@ PanelWindow { ctx.clearRect(0, 0, w, height); - // Opaque backing behind the stroke so it's not transparent - ctx.fillStyle = M.Theme.base00.toString(); + // Vertical fade from stroke color into bar background + const h = height; + const vGrad = ctx.createLinearGradient(0, 0, 0, h); + const hGrad = ctx.createLinearGradient(0, 0, w, 0); + hGrad.addColorStop(0, M.Theme.base0C.toString()); + hGrad.addColorStop(1, M.Theme.base09.toString()); + + // Draw the fade: full opacity at top, transparent at bottom + ctx.globalAlpha = 0.15; + ctx.fillStyle = hGrad; ctx.beginPath(); - if (r > lw) { + if (r > 0) { ctx.moveTo(0, r); ctx.arc(r, r, r, Math.PI, -Math.PI / 2); ctx.lineTo(w - r, 0); ctx.arc(w - r, r, r, -Math.PI / 2, 0); - ctx.lineTo(w, lw); - ctx.lineTo(0, lw); + ctx.lineTo(w, h); + ctx.lineTo(0, h); } else { - ctx.rect(0, 0, w, lw); + ctx.rect(0, 0, w, h); } ctx.fill(); + // Fade out towards bottom + ctx.globalAlpha = 1; + const fadeGrad = ctx.createLinearGradient(0, lw, 0, h); + fadeGrad.addColorStop(0, "transparent"); + fadeGrad.addColorStop(1, M.Theme.base00.toString()); + ctx.fillStyle = fadeGrad; + ctx.fillRect(0, lw, w, h - lw); + // Gradient stroke const grad = ctx.createLinearGradient(0, 0, w, 0); grad.addColorStop(0, M.Theme.base0C.toString()); @@ -80,6 +96,7 @@ PanelWindow { Item { anchors.fill: parent + anchors.topMargin: 3 anchors.leftMargin: Math.max(M.Theme.barPadding, M.Theme.screenRadius) anchors.rightMargin: Math.max(M.Theme.barPadding, M.Theme.screenRadius) From 4a5b629b8d415552610dbed3b2454a96ed669162 Mon Sep 17 00:00:00 2001 From: Damocles Date: Sun, 12 Apr 2026 20:26:49 +0200 Subject: [PATCH 2/2] screen corner radius back to 15 --- modules/Theme.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/Theme.qml b/modules/Theme.qml index e89dbfa..6c9e834 100644 --- a/modules/Theme.qml +++ b/modules/Theme.qml @@ -34,7 +34,7 @@ QtObject { property int barSpacing: 12 property int moduleSpacing: 4 property int radius: 4 - property int screenRadius: 20 + property int screenRadius: 15 property FileView _themeFile: FileView { path: (Quickshell.env("XDG_CONFIG_HOME") || (Quickshell.env("HOME") + "/.config")) + "/nova-shell/theme.json"