fix: card size in SP mode

.gitignore

@@ -27,10 +27,12 @@ yarn-error.log*
 
 # local env files
 .env*.local
+.env
 
 # vercel
 .vercel
 
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+

src/app/page.tsx

@@ -1,6 +1,6 @@
 import modulesData from "@/modules.json"
-import ModuleCard from "@/src/app/components/card/module"
-import Navbar from "./components/navbar"
+import ModuleCard from "../components/card/module"
+import Navbar from "../components/navbar"
 
 export default function Home() {
   return (

src/app/vote/page.tsx

@@ -1,6 +1,6 @@
-import projectsData from "./buildNStake.json"
-import ModuleCard from "@/src/app/components/card/module"
-import Navbar from "../components/navbar"
+import projectsData from "@/src/constants/buildNStake.json"
+import ModuleCard from "@/src/components/card/module"
+import Navbar from "@/src/components/navbar"
 
 export default function Vote() {
   return (

src/app/components/card/module/index.tsx → src/components/card/module/index.tsx

@@ -28,12 +28,12 @@ const ModuleCard = ({ url, name, image, description, validatorKey, verified, tag
 
   return (
     <>
-      <div className="card card-compact w-96 bg-base-100 shadow-xl m-4">
+      <div className="card card-compact w-[355px] sm:w-96 bg-base-100 shadow-xl m-4">
         <div className="mockup-browser border bg-base-300 h-full">
                   {/*  hover:bg-inherit transition ease-in-out */}
         {disabled && (
           <div className="absolute inset-0 bg-black bg-opacity-50 backdrop-filter backdrop-blur-lg flex items-center justify-center">
-            <div className="text-white text-2xl font-bold">{name}</div>
+            <div className="text-white text-2xl font-bold text-center">{name}</div>
           </div>
         )}
          <div className="mockup-browser-toolbar">

src/app/components/modal/index.tsx → src/components/modal/index.tsx

@@ -3,7 +3,7 @@ import { InjectedAccountWithMeta } from "@polkadot/extension-inject/types"
 import React, { useState } from "react"
 import Modal from "react-responsive-modal"
 import { AiFillCheckCircle } from "react-icons/ai"
-import { infoToast } from "@/src/app/components/toast"
+import { infoToast } from "../toast"
 import { FaTimes } from "react-icons/fa"
 
 const WalletModal = ({

src/constants/buildNStake.json

@@ -0,0 +1,58 @@
+[
+    {
+        "name": "BUILD N STAKE - Coming Soon",
+        "url": "https://comhub.app/",
+        "image": "/images/comai-webp.webp",
+        "description": "coming soon",
+        "validatorKey": "vali::unknown",
+        "verified": false,
+        "tags": ["docs"],
+        "disabled": true
+
+    },
+    {
+        "name": "YOUR APP HERE",
+        "url": "https://comhub.app/",
+        "image": "/images/comai-webp.webp",
+        "description": "coming soon",
+        "validatorKey": "vali::unknown",
+        "verified": false,
+        "tags": ["docs"],
+        "disabled": true
+
+    },
+    {
+        "name": "REGISTER",
+        "url": "https://comhub.app/",
+        "image": "/images/comai-webp.webp",
+        "description": "coming soon",
+        "validatorKey": "vali::unknown",
+        "verified": false,
+        "tags": ["docs"],
+        "disabled": true
+
+    },
+    {
+        "name": "BUILD",
+        "url": "https://comhub.app/",
+        "image": "/images/comai-webp.webp",
+        "description": "coming soon",
+        "validatorKey": "vali::unknown",
+        "verified": false,
+        "tags": ["docs"],
+        "disabled": true
+
+    },
+    {
+        "name": "STAKE",
+        "url": "https://comhub.app/",
+        "image": "/images/comai-webp.webp",
+        "description": "coming soon",
+        "validatorKey": "vali::unknown",
+        "verified": false,
+        "tags": ["docs"],
+        "disabled": true
+
+    }
+
+]

src/context/index.tsx

@@ -7,8 +7,8 @@ import {
   InjectedAccountWithMeta,
   InjectedExtension,
 } from "@polkadot/extension-inject/types"
-import WalletModal from "@/src/app/components/modal"
-import { errorToast, successToast } from "@/src/app/components/toast"
+import WalletModal from "@/src/components/modal"
+import { errorToast, successToast } from "@/src/components/toast"
 
 interface PolkadotApiState {
   web3Accounts: (() => Promise<InjectedAccountWithMeta[]>) | null
@@ -74,6 +74,7 @@ export const PolkadotProvider: React.FC<PolkadotProviderProps> = ({
     return () => {
       api?.disconnect()
     }
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [wsEndpoint])
 
   useEffect(() => {