From ee7d1aded8b50bb0c3cb6f9a298b1527de62d4bf Mon Sep 17 00:00:00 2001
From: Lucemans <luc@lucemans.nl>
Date: Sat, 7 Oct 2023 09:10:35 +0000
Subject: [PATCH] Introduce Custom Widths

---
 app/[slug]/page.tsx                | 2 +-
 components/POAPModal/POAPModal.tsx | 4 ++--
 hooks/useIYKRef.ts                 | 2 +-
 tailwind.config.js                 | 7 ++++++-
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/app/[slug]/page.tsx b/app/[slug]/page.tsx
index 81d4a16..90ff809 100644
--- a/app/[slug]/page.tsx
+++ b/app/[slug]/page.tsx
@@ -31,7 +31,7 @@ export default async function ({
 
     return (
         <div className="w-full mt-4 lg:mt-10 px-6 py-8 pb-64">
-            <div className="w-full max-w-md mx-auto flex flex-col gap-8">
+            <div className="w-full max-w-md2 mx-auto flex flex-col gap-8">
                 <div className="text-center px-4">
                     <img
                         src="/frensday_2.svg"
diff --git a/components/POAPModal/POAPModal.tsx b/components/POAPModal/POAPModal.tsx
index 9989891..18528ef 100644
--- a/components/POAPModal/POAPModal.tsx
+++ b/components/POAPModal/POAPModal.tsx
@@ -21,8 +21,8 @@ export const POAPModal: FC<{
     if (dismissed || !hasRendered) return;
 
     return (
-        <div className="fixed bottom-0 inset-x-0 px-3 pb-4">
-            <div className="w-full max-w-md mx-auto">
+        <div className="fixed bottom-0 inset-x-0 px-2 pb-4">
+            <div className="w-full max-w-md3 mx-auto">
                 <div className="p-4 text-center relative">
                     <img
                         src="/creeper.svg"
diff --git a/hooks/useIYKRef.ts b/hooks/useIYKRef.ts
index 4e6f987..1e80bd6 100644
--- a/hooks/useIYKRef.ts
+++ b/hooks/useIYKRef.ts
@@ -53,6 +53,6 @@ export const useIYKRef = async (reference?: string) => {
 
     const result: IYKRefResponse = await response.json();
 
-    // return DEBUG_VALUE;
+    // return DEBUG_VALUE as IYKRefResponse;
     return result;
 };
diff --git a/tailwind.config.js b/tailwind.config.js
index c14b080..f03c4cf 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -10,7 +10,12 @@ module.exports = {
         './src/**/*.{js,ts,jsx,tsx,mdx}',
     ],
     theme: {
-        extend: {},
+        extend: {
+            maxWidth: {
+                md2: '420px',
+                md3: '458px',
+            },
+        },
     },
     plugins: [],
 };