diff --git a/src/components/footer/subscribe.js b/src/components/footer/subscribe.js
new file mode 100644
index 0000000..07b9009
--- /dev/null
+++ b/src/components/footer/subscribe.js
@@ -0,0 +1,52 @@
+import { useState } from 'react';
+import { tw } from 'twind';
+import { Z_STREAM_ERROR } from 'zlib';
+
+const Subscribe = () => {
+ const [email, setEmail] = useState("");
+ const [subscribed, setSubscribed] = useState();
+ const [error, setError] = useState();
+
+ const subscribe = async () => {
+ try {
+ const formData = new FormData();
+ formData.append("api_key", "JlUKxDNJAmbFF44byOHTNQ");
+ formData.append("email", email);
+ const response = await fetch('https://api.convertkit.com/v3/forms/3697685/subscribe', {
+ method: "POST",
+ body: formData
+ });
+ const subscribeJson = await response.json();
+ if (subscribeJson) {
+ setSubscribed(true);
+ }
+ }
+ catch (err) {
+ setError(err);
+
+ }
+ };
+ return (
+
+ Sign up for our newsletter.
+ {
+
+ error ?
+ Couldn't process your subscription, please reload and try again.
+
+
:
+
+ subscribed ?
+
+ Success! Now check your email to confirm your subscription.
+
+
+
+ :
+ setEmail(e.target.value)} className={tw(`rounded-md border-gray-400 w-full sm:w-auto border h-12 px-2 text-black`)} />
+
+
}
+
+ );
+};
+export default Subscribe;
\ No newline at end of file
diff --git a/src/twind.config.js b/src/twind.config.js
index 3ba779a..8af0a2d 100755
--- a/src/twind.config.js
+++ b/src/twind.config.js
@@ -24,19 +24,22 @@ export default {
maxHeight: {
'128': '32rem',
},
+ spacing: {
+ '128': '32rem'
+ },
screens: {
'sm': '640px',
// => @media (min-width: 640px) { ... }
-
+
'md': '768px',
// => @media (min-width: 768px) { ... }
-
+
'lg': '1024px',
// => @media (min-width: 1024px) { ... }
-
+
'xl': '1280px',
// => @media (min-width: 1280px) { ... }
-
+
'2xl': '1536px',
// => @media (min-width: 1536px) { ... }
},