basic gradient handling

7 files changed, 110 insertions, 0 deletions

diff --git a/tests/data/gradient-stop.svg b/tests/data/gradient-stop.svg
new file mode 100644
index 0000000..49d60a0
--- /dev/null
+++ b/tests/data/gradient-stop.svg
@@ -0,0 +1,14 @@
+<svg
+  viewBox="0 0 10 10"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <linearGradient id="myGradient" gradientTransform="rotate(90)">
+      <stop offset="5%" stop-color="gold" />
+      <stop offset="95%" stop-color="red" />
+    </linearGradient>
+  </defs>
+
+  <!-- using my linear gradient -->
+  <circle cx="5" cy="5" r="4" fill="url('#myGradient')" />
+</svg>
diff --git a/tests/data/linear-gradient-rotated.svg b/tests/data/linear-gradient-rotated.svg
new file mode 100644
index 0000000..b27f80b
--- /dev/null
+++ b/tests/data/linear-gradient-rotated.svg
@@ -0,0 +1,14 @@
+<svg
+  viewBox="0 0 100 100"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <linearGradient id="myGradient" gradientTransform="rotate(80)">
+      <stop offset="5%" stop-color="gold" />
+      <stop offset="95%" stop-color="red" />
+    </linearGradient>
+  </defs>
+
+  <!-- using my linear gradient -->
+  <circle cx="50" cy="50" r="40" fill="url(#myGradient)" />
+</svg>
diff --git a/tests/data/linear-gradient.svg b/tests/data/linear-gradient.svg
new file mode 100644
index 0000000..b9bb348
--- /dev/null
+++ b/tests/data/linear-gradient.svg
@@ -0,0 +1,20 @@
+<svg
+  viewBox="0 0 500 500"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <linearGradient
+      id="grad"
+      x1="0"
+      y1="0"
+      x2="20"
+      y2="20"
+      spreadMethod="repeat"
+      gradientUnits="userSpaceOnUse">
+      <stop offset="20%" stop-color="red" />
+      <stop offset="80%" stop-color="gold" />
+    </linearGradient>
+  </defs>
+  <rect width="100%" height="25%" fill="url(#grad)" />
+  <rect width="100%" height="65%" fill="url(#grad)" y="30%" />
+</svg>
diff --git a/tests/data/linear-gradient2.svg b/tests/data/linear-gradient2.svg
new file mode 100644
index 0000000..1eaad6a
--- /dev/null
+++ b/tests/data/linear-gradient2.svg
@@ -0,0 +1,20 @@
+<svg
+  viewBox="0 0 500 500"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <linearGradient
+      id="grad"
+      x1="0"
+      y1="0"
+      x2="20"
+      y2="20"
+      spreadMethod="repeat"
+      gradientUnits="userSpaceOnUse">
+      <stop offset="50%" stop-color="red" />
+      <stop offset="50%" stop-color="gold" />
+    </linearGradient>
+  </defs>
+  <rect width="100%" height="25%" fill="url(#grad)" />
+  <rect width="100%" height="65%" fill="url(#grad)" y="30%" />
+</svg>
diff --git a/tests/data/linear-gradient3.svg b/tests/data/linear-gradient3.svg
new file mode 100644
index 0000000..7415dc4
--- /dev/null
+++ b/tests/data/linear-gradient3.svg
@@ -0,0 +1,14 @@
+<svg
+  viewBox="0 0 10 10"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <linearGradient id="myGradient" >
+      <stop offset="5%" stop-color="gold" />
+      <stop offset="95%" stop-color="red" />
+    </linearGradient>
+  </defs>
+
+  <!-- using my linear gradient -->
+  <circle cx="5" cy="5" r="4" fill="url(#myGradient)" />
+</svg>
diff --git a/tests/data/radial-gradient.svg b/tests/data/radial-gradient.svg
new file mode 100644
index 0000000..eca8adc
--- /dev/null
+++ b/tests/data/radial-gradient.svg
@@ -0,0 +1,14 @@
+<svg
+  viewBox="0 0 10 10"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <radialGradient id="myGradient">
+      <stop offset="10%" stop-color="gold" />
+      <stop offset="85%" stop-color="red" />
+    </radialGradient>
+  </defs>
+
+  <!-- using my radial gradient -->
+  <circle cx="5" cy="5" r="4" fill="url(#myGradient)" />
+</svg>
diff --git a/tests/data/radial-gradient2.svg b/tests/data/radial-gradient2.svg
new file mode 100644
index 0000000..aa9e786
--- /dev/null
+++ b/tests/data/radial-gradient2.svg
@@ -0,0 +1,14 @@
+<svg
+  viewBox="0 0 100 100"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <radialGradient id="myGradient">
+      <stop offset="10%" stop-color="gold" />
+      <stop offset="95%" stop-color="red" />
+    </radialGradient>
+  </defs>
+
+  <!-- using my radial gradient -->
+  <circle cx="50" cy="50" r="40" fill="url(#myGradient)" />
+</svg>