restore gradient glow wash behind border
This commit is contained in:
parent
49513b7ff2
commit
d33b47139a
1 changed files with 18 additions and 0 deletions
|
|
@ -40,6 +40,24 @@ PanelWindow {
|
||||||
|
|
||||||
ctx.clearRect(0, 0, w, h);
|
ctx.clearRect(0, 0, w, h);
|
||||||
|
|
||||||
|
// Glow wash behind the border
|
||||||
|
const glowGrad = ctx.createLinearGradient(0, 0, w, 0);
|
||||||
|
glowGrad.addColorStop(0, M.Theme.base0C.toString());
|
||||||
|
glowGrad.addColorStop(1, M.Theme.base09.toString());
|
||||||
|
ctx.globalAlpha = 0.25;
|
||||||
|
ctx.fillStyle = glowGrad;
|
||||||
|
ctx.fillRect(0, 0, w, h);
|
||||||
|
|
||||||
|
// Erase glow towards bottom
|
||||||
|
ctx.globalAlpha = 1;
|
||||||
|
ctx.globalCompositeOperation = "destination-out";
|
||||||
|
const glowFade = ctx.createLinearGradient(0, 0, 0, h);
|
||||||
|
glowFade.addColorStop(0, "transparent");
|
||||||
|
glowFade.addColorStop(1, "black");
|
||||||
|
ctx.fillStyle = glowFade;
|
||||||
|
ctx.fillRect(0, 0, w, h);
|
||||||
|
ctx.globalCompositeOperation = "source-over";
|
||||||
|
|
||||||
// Horizontal gradient for the border
|
// Horizontal gradient for the border
|
||||||
const grad = ctx.createLinearGradient(0, 0, w, 0);
|
const grad = ctx.createLinearGradient(0, 0, w, 0);
|
||||||
grad.addColorStop(0, M.Theme.base0C.toString());
|
grad.addColorStop(0, M.Theme.base0C.toString());
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue