diff --git a/modules/Bar.qml b/modules/Bar.qml index 4134e5b..c39fe40 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: parent.height + height: Math.max(M.Theme.screenRadius + 2, 4) onPaint: { const ctx = getContext("2d"); @@ -42,38 +42,20 @@ PanelWindow { ctx.clearRect(0, 0, w, height); - // 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; + // Opaque backing behind the stroke + ctx.fillStyle = M.Theme.base00.toString(); ctx.beginPath(); - if (r > 0) { + if (r > lw) { 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, h); - ctx.lineTo(0, h); + ctx.lineTo(w, lw); + ctx.lineTo(0, lw); } else { - ctx.rect(0, 0, w, h); + ctx.rect(0, 0, w, lw); } 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()); grad.addColorStop(1, M.Theme.base09.toString());