crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-22 20:26:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adding _document, _app and Product View

Browse Source
This commit is contained in:
Belen Curcio
2020-09-29 16:02:09 -03:00
parent c10a4ce95b
commit 702f00933d
11 changed files with 145 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
pages/_document.tsx Normal file
View File

@@ -0,0 +1,18 @@
import Document_, { Html, Head, Main, NextScript } from "next/document";
export default class Document extends Document_ {
render() {
return (
<Html lang="en">
<Head />
<body>
<Main />
<NextScript />
{/**
* Here add your GA and more scripts.
*/}
</body>
</Html>
);
}
}

2
pages/index.tsx
View File

@@ -9,7 +9,7 @@ export default function Home() {
description="Due to COVID-19, some orders may experience processing and delivery delays."
/>
<Navbar />
<Container className="px-4 py-5 h-screen">
<Container className="h-screen">
<div className="grid grid-cols-1 h-full lg:grid-cols-3 lg:grid-rows-2">
<div className="lg:row-span-2 lg:col-span-2 bg-violet h-full"></div>
<div className="lg:row-span-1 lg:col-span-1 bg-black h-full"></div>

50
pages/product/[id].tsx Normal file
View File

@@ -0,0 +1,50 @@
import { useRouter } from "next/router";
import { Featurebar, Button, Container } from "ui";
import { Navbar, Footer, ProductView } from "components";
import ErrorPage from "next/error";
export async function getStaticProps() {
const productData = {
description: `
Nothing undercover about this tee. Nope. This is the official Bad
Boys tee. Printed in white or black ink on Black, Brown, or Oatmeal.
Like everything in this collection, it is extremely limited edition
and available for 10 days only. This is a limited edition production
run. Printing starts when the drop ends. Reminder: Bad Boys For
Life. Shipping may take 10+ days due to COVID-19.
`,
};
return {
props: {
productData,
},
};
}
export async function getStaticPaths() {
return {
paths: [],
fallback: true,
};
}
export default function Home({ productData }) {
const router = useRouter();
return (
<>
<Featurebar
title="Free Standard Shipping on orders over $99.99"
description="Due to COVID-19, some orders may experience processing and delivery delays."
/>
<Navbar />
<Container className="h-screen">
{router.isFallback ? (
<h1>Loading...</h1>
) : (
<ProductView productData={productData} />
)}
</Container>
<Footer></Footer>
</>
);
}