Triangles fade from bottom and behave better on antialiased mask edges

.gitignore

@@ -0,0 +1 @@
+*.qsb

default.vert

@@ -0,0 +1,12 @@
+#version 440
+layout(location = 0) in vec4 qt_Vertex;
+layout(location = 1) in vec2 qt_MultiTexCoord0;
+layout(location = 0) out vec2 coord;
+layout(std140, binding = 0) uniform buf {
+    mat4 qt_Matrix;
+    float qt_Opacity;
+};
+void main() {
+    coord = qt_MultiTexCoord0;
+    gl_Position = qt_Matrix * qt_Vertex;
+}

shell.qml

@@ -155,7 +155,7 @@ PanelWindow {
                     gradient: Gradient {
                         orientation: Gradient.Horizontal
                         GradientStop {
-                            color: Qt.darker(button.color, 8)
+                            color: Qt.darker(button.color, 16)
                             position: 0
                         }
                         GradientStop {
@@ -205,17 +205,24 @@ PanelWindow {
                         onObjectAdded: (index, obj) => obj.parent = triangles
                     }
                 }
-                MultiEffect {
+                Rectangle {
-                    source: triangles
+                    id: triMask
+                    x: triangles.x
+                    y: triangles.y
+                    width: triangles.width
+                    height: triangles.height
+                    visible: false
+                    layer.enabled: true
+                    radius: root.radius
+                    color: "red"
+                }
+                ShaderEffect {
                     anchors.fill: triangles
-                    maskEnabled: true
+                    property var src: triangles
-                    maskSource: ShaderEffectSource { sourceItem: Rectangle {
+                    property var mask: triMask
-                        x: triangles.x
+                    vertexShader: "default.vert.qsb"
-                        y: triangles.y
+                    fragmentShader: "trifade.frag.qsb"
-                        width: triangles.width
+
-                        height: triangles.height
-                        radius: root.radius
-                    } }
                 }
 
                 Item {

trifade.frag

@@ -0,0 +1,14 @@
+#version 440
+layout(location = 0) in vec2 coord;
+layout(location = 0) out vec4 fragColor;
+layout(std140, binding = 0) uniform buf {
+    mat4 qt_Matrix;
+    float qt_Opacity;
+};
+layout(binding = 1) uniform sampler2D src;
+layout(binding = 2) uniform sampler2D mask;
+void main() {
+    vec4 tex = texture(src, coord);
+    float a = texture(mask, coord).a * tex.a * (1-coord.y);
+    fragColor = vec4(tex.r * a, tex.g * a, tex.b * a, a);
+}