forked from crowetic/commerce
Normalizing Style Sheets
This commit is contained in:
parent
0c9f3ef8d0
commit
e881121913
4
components/core/Layout/Layout.module.css
Normal file
4
components/core/Layout/Layout.module.css
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
.root {
|
||||||
|
@apply h-full bg-primary mx-auto;
|
||||||
|
max-width: 2460px;
|
||||||
|
}
|
@ -1,10 +1,13 @@
|
|||||||
import cn from 'classnames'
|
import cn from 'classnames'
|
||||||
import { FC } from 'react'
|
import { FC } from 'react'
|
||||||
import { CommerceProvider } from '@lib/bigcommerce'
|
|
||||||
import { Navbar, Featurebar, Footer } from '@components/core'
|
import { Navbar, Featurebar, Footer } from '@components/core'
|
||||||
import { Container, Sidebar } from '@components/ui'
|
import { Container, Sidebar } from '@components/ui'
|
||||||
import { CartSidebarView } from '@components/cart'
|
import { CartSidebarView } from '@components/cart'
|
||||||
import { UIProvider, useUI } from '@components/ui/context'
|
import { UIProvider, useUI } from '@components/ui/context'
|
||||||
|
import s from './Layout.module.css'
|
||||||
|
import { ThemeProvider } from 'next-themes'
|
||||||
|
import { SSRProvider, OverlayProvider } from 'react-aria'
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
className?: string
|
className?: string
|
||||||
@ -12,7 +15,7 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const CoreLayout: FC<Props> = ({ className, children }) => {
|
const CoreLayout: FC<Props> = ({ className, children }) => {
|
||||||
const rootClassName = cn('h-full bg-primary', className)
|
const rootClassName = cn(s.root, className)
|
||||||
const { displaySidebar, closeSidebar } = useUI()
|
const { displaySidebar, closeSidebar } = useUI()
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -34,11 +37,15 @@ const CoreLayout: FC<Props> = ({ className, children }) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const Layout: FC<Props> = (props) => (
|
const Layout: FC<Props> = (props) => (
|
||||||
<CommerceProvider locale="en-us">
|
<UIProvider>
|
||||||
<UIProvider>
|
<ThemeProvider>
|
||||||
<CoreLayout {...props} />
|
<SSRProvider>
|
||||||
</UIProvider>
|
<OverlayProvider>
|
||||||
</CommerceProvider>
|
<CoreLayout {...props} />
|
||||||
|
</OverlayProvider>
|
||||||
|
</SSRProvider>
|
||||||
|
</ThemeProvider>
|
||||||
|
</UIProvider>
|
||||||
)
|
)
|
||||||
|
|
||||||
export default Layout
|
export default Layout
|
||||||
|
@ -5,10 +5,10 @@ import 'animate.css'
|
|||||||
import { FC } from 'react'
|
import { FC } from 'react'
|
||||||
import { DefaultSeo } from 'next-seo'
|
import { DefaultSeo } from 'next-seo'
|
||||||
import type { AppProps } from 'next/app'
|
import type { AppProps } from 'next/app'
|
||||||
import { ThemeProvider } from 'next-themes'
|
|
||||||
import { SSRProvider, OverlayProvider } from 'react-aria'
|
|
||||||
import config from '../config.json'
|
import config from '../config.json'
|
||||||
import Head from 'next/head'
|
import Head from 'next/head'
|
||||||
|
import { CommerceProvider } from '@lib/bigcommerce'
|
||||||
|
|
||||||
const Noop: FC = ({ children }) => <>{children}</>
|
const Noop: FC = ({ children }) => <>{children}</>
|
||||||
|
|
||||||
@ -22,15 +22,11 @@ export default function MyApp({ Component, pageProps }: AppProps) {
|
|||||||
<link rel="manifest" href="/site.webmanifest" key="site-manifest" />
|
<link rel="manifest" href="/site.webmanifest" key="site-manifest" />
|
||||||
</Head>
|
</Head>
|
||||||
<DefaultSeo {...config.seo} />
|
<DefaultSeo {...config.seo} />
|
||||||
<ThemeProvider>
|
<CommerceProvider locale="en-us">
|
||||||
<SSRProvider>
|
<Layout>
|
||||||
<OverlayProvider>
|
<Component {...pageProps} />
|
||||||
<Layout>
|
</Layout>
|
||||||
<Component {...pageProps} />
|
</CommerceProvider>
|
||||||
</Layout>
|
|
||||||
</OverlayProvider>
|
|
||||||
</SSRProvider>
|
|
||||||
</ThemeProvider>
|
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user