only access on desktop

This commit is contained in:
Christopher Arraya 2024-01-13 21:04:03 -05:00
parent c55ab3d49e
commit e80c356154

View File

@ -22,13 +22,38 @@ export default function RootLayout({
}) { }) {
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<head /> <head>
<style>
{`
@media (max-width: 768px) {
.desktop-content {
display: none;
}
.mobile-message {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
text-align: center;
font-size: 20px;
}
}
@media (min-width: 769px) {
.mobile-message {
display: none;
}
}
`}
</style>
</head>
<body <body
className={cn( className={cn(
"min-h-screen bg-background font-sans antialiased", "min-h-screen bg-background font-sans antialiased",
fontSans.variable fontSans.variable
)} )}
> >
<div className="desktop-content">
<ThemeProvider <ThemeProvider
attribute="class" attribute="class"
defaultTheme="system" defaultTheme="system"
@ -38,6 +63,10 @@ export default function RootLayout({
{children} {children}
<Toaster /> <Toaster />
</ThemeProvider> </ThemeProvider>
</div>
<div className="mobile-message font-semibold">
Skalara works best on a desktop browser. Please visit us again.
</div>
</body> </body>
</html> </html>
); );