about summary refs log tree commit diff
path: root/src/components/GradientFill.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/GradientFill.tsx')
-rw-r--r--src/components/GradientFill.tsx27
1 files changed, 27 insertions, 0 deletions
diff --git a/src/components/GradientFill.tsx b/src/components/GradientFill.tsx
new file mode 100644
index 000000000..dc14aa72b
--- /dev/null
+++ b/src/components/GradientFill.tsx
@@ -0,0 +1,27 @@
+import React from 'react'
+import LinearGradient from 'react-native-linear-gradient'
+
+import {atoms as a, tokens} from '#/alf'
+
+export function GradientFill({
+  gradient,
+}: {
+  gradient:
+    | typeof tokens.gradients.sky
+    | typeof tokens.gradients.midnight
+    | typeof tokens.gradients.sunrise
+    | typeof tokens.gradients.sunset
+    | typeof tokens.gradients.bonfire
+    | typeof tokens.gradients.summer
+    | typeof tokens.gradients.nordic
+}) {
+  return (
+    <LinearGradient
+      colors={gradient.values.map(c => c[1])}
+      locations={gradient.values.map(c => c[0])}
+      start={{x: 0, y: 0}}
+      end={{x: 1, y: 1}}
+      style={[a.absolute, a.inset_0]}
+    />
+  )
+}