forked from crowetic/commerce
Add custom pages content
This commit is contained in:
parent
20bef1f8aa
commit
214cb49fb4
18
components/custom-pages/PageContent/PageContent.module.css
Normal file
18
components/custom-pages/PageContent/PageContent.module.css
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
.root h1 {
|
||||||
|
@apply text-5xl mb-12;
|
||||||
|
}
|
||||||
|
|
||||||
|
.root h2 {
|
||||||
|
@apply text-3xl mt-12 mb-4 leading-snug;
|
||||||
|
}
|
||||||
|
|
||||||
|
.root h3 {
|
||||||
|
@apply text-2xl mt-8 mb-4 leading-snug;
|
||||||
|
}
|
||||||
|
|
||||||
|
.root p,
|
||||||
|
.root ul,
|
||||||
|
.root ol,
|
||||||
|
.root blockquote {
|
||||||
|
@apply my-6;
|
||||||
|
}
|
16
components/custom-pages/PageContent/PageContent.tsx
Normal file
16
components/custom-pages/PageContent/PageContent.tsx
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import cn from 'classnames'
|
||||||
|
import s from './PageContent.module.css'
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
className?: 'string'
|
||||||
|
html: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function PageContent({ className, html }: Props) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className={cn(s.root, className)}
|
||||||
|
dangerouslySetInnerHTML={{ __html: html }}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
1
components/custom-pages/PageContent/index.ts
Normal file
1
components/custom-pages/PageContent/index.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export { default } from './PageContent'
|
@ -3,6 +3,7 @@ import { Layout } from '@components/core'
|
|||||||
import getAllPages from '@lib/bigcommerce/api/operations/get-all-pages'
|
import getAllPages from '@lib/bigcommerce/api/operations/get-all-pages'
|
||||||
import getPage from '@lib/bigcommerce/api/operations/get-page'
|
import getPage from '@lib/bigcommerce/api/operations/get-page'
|
||||||
import getSlug from '@utils/get-slug'
|
import getSlug from '@utils/get-slug'
|
||||||
|
import PageContent from '@components/custom-pages/PageContent'
|
||||||
|
|
||||||
export async function getStaticProps({
|
export async function getStaticProps({
|
||||||
preview,
|
preview,
|
||||||
@ -37,8 +38,11 @@ export async function getStaticPaths() {
|
|||||||
export default function Pages({
|
export default function Pages({
|
||||||
page,
|
page,
|
||||||
}: InferGetStaticPropsType<typeof getStaticProps>) {
|
}: InferGetStaticPropsType<typeof getStaticProps>) {
|
||||||
console.log('PAGE', page)
|
return (
|
||||||
return <div className="mt-3">Hello!</div>
|
<div className="max-w-2xl mx-auto py-20">
|
||||||
|
<PageContent html={page.body} />
|
||||||
|
</div>
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
Pages.Layout = Layout
|
Pages.Layout = Layout
|
||||||
|
Loading…
x
Reference in New Issue
Block a user