Add gradient shader and apply it to piano scene background (#20)

Author: brylie

app/gradient_shader.gdshader

@@ -0,0 +1,14 @@
+shader_type canvas_item;
+
+// These uniform variables let us control the colors from GDScript if needed
+uniform vec4 top_color : source_color = vec4(0.95, 0.95, 0.98, 1.0);  // Light blue-gray
+uniform vec4 bottom_color : source_color = vec4(0.90, 0.90, 0.95, 1.0);  // Slightly darker blue-gray
+
+void fragment() {
+    // UV.y gives us the vertical position (0 at top, 1 at bottom)
+    // We use mix() to smoothly blend between the two colors
+    vec4 gradient_color = mix(top_color, bottom_color, UV.y);
+
+    // Apply the color to this pixel
+    COLOR = gradient_color;
+}

app/scenes/piano.tscn

@@ -1,10 +1,16 @@
-[gd_scene load_steps=6 format=3 uid="uid://deocrbvduwvbf"]
+[gd_scene load_steps=8 format=3 uid="uid://deocrbvduwvbf"]
 
 [ext_resource type="Script" path="res://scripts/piano.gd" id="1_16djv"]
 [ext_resource type="Script" path="res://scripts/note_display.gd" id="2_4lvi2"]
 [ext_resource type="Script" path="res://scripts/piano_keys.gd" id="3_33fs1"]
 [ext_resource type="PackedScene" uid="uid://qnn08ykran7h" path="res://scenes/metronome.tscn" id="3_m4k2l"]
 [ext_resource type="Script" path="res://scripts/exercise_manager.gd" id="5_r2n4b"]
+[ext_resource type="Shader" path="res://gradient_shader.gdshader" id="6_v0a7s"]
+
+[sub_resource type="ShaderMaterial" id="ShaderMaterial_s2q7l"]
+shader = ExtResource("6_v0a7s")
+shader_parameter/top_color = Color(0.241298, 0.45667, 0.596276, 1)
+shader_parameter/bottom_color = Color(0.428372, 0.418785, 0.605246, 1)
 
 [node name="Piano" type="Control"]
 layout_mode = 3
@@ -15,6 +21,16 @@ grow_horizontal = 2
 grow_vertical = 2
 script = ExtResource("1_16djv")
 
+[node name="Background" type="ColorRect" parent="."]
+material = SubResource("ShaderMaterial_s2q7l")
+layout_mode = 1
+anchors_preset = 15
+anchor_right = 1.0
+anchor_bottom = 1.0
+grow_horizontal = 2
+grow_vertical = 2
+mouse_filter = 2
+
 [node name="NoteDisplay" type="RichTextLabel" parent="."]
 layout_mode = 1
 anchors_preset = 10