diff --git a/src/App.tsx b/src/App.tsx
index eedc362..9991819 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,6 +2,7 @@ import './App.css';
import '@rainbow-me/rainbowkit/styles.css';
import React from 'react';
+import { useMediaQuery } from '@mui/material';
import CssBaseline from '@mui/material/CssBaseline';
import { ThemeProvider } from '@mui/material/styles';
import {
@@ -14,6 +15,7 @@ import { Navigate, Route, Routes } from 'react-router-dom';
import { baseSepolia } from 'viem/chains';
import { useAccount } from 'wagmi';
+import MobileScreensContainer from './components/layouts/MobileScreensContainer';
import { CustomSnackbar } from './components/shared/CustomSnackbar';
import useSiweAuth from './hooks/useSiweAuth';
import DefaultLayout from './layouts/DefaultLayout';
@@ -36,11 +38,17 @@ const queryClient = new QueryClient({
});
const App: React.FC = () => {
+ const isSmallScreen = useMediaQuery(theme.breakpoints.down('md'));
+
const { authStatus, authenticationAdapter } = useSiweAuth();
const { chainId } = useAccount();
globalThis.Buffer = Buffer;
+ if (isSmallScreen) {
+ return ;
+ }
+
return (
{
+ return (
+
+
+ We are currently not optimized for mobile devices. Please check back on
+ a desktop or larger screen.
+
+
+ );
+};
+
+export default MobileScreensContainer;