forked from crowetic/commerce
Changes to BLog
This commit is contained in:
parent
2ad115af61
commit
7efda91b11
@ -11,14 +11,18 @@ import useOpenCheckout from '@lib/bigcommerce/cart/use-open-checkout'
|
|||||||
|
|
||||||
const CartSidebarView: FC = () => {
|
const CartSidebarView: FC = () => {
|
||||||
const { data, isEmpty } = useCart()
|
const { data, isEmpty } = useCart()
|
||||||
const { price: subTotal } = usePrice(data && {
|
const { price: subTotal } = usePrice(
|
||||||
amount: data.base_amount,
|
data && {
|
||||||
currencyCode: data.currency.code,
|
amount: data.base_amount,
|
||||||
})
|
currencyCode: data.currency.code,
|
||||||
const { price: total } = usePrice(data && {
|
}
|
||||||
amount: data.cart_amount,
|
)
|
||||||
currencyCode: data.currency.code,
|
const { price: total } = usePrice(
|
||||||
})
|
data && {
|
||||||
|
amount: data.cart_amount,
|
||||||
|
currencyCode: data.currency.code,
|
||||||
|
}
|
||||||
|
)
|
||||||
const openCheckout = useOpenCheckout()
|
const openCheckout = useOpenCheckout()
|
||||||
const { closeSidebar } = useUI()
|
const { closeSidebar } = useUI()
|
||||||
const handleClose = () => closeSidebar()
|
const handleClose = () => closeSidebar()
|
||||||
@ -87,7 +91,7 @@ const CartSidebarView: FC = () => {
|
|||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<div className="px-4 sm:px-6 flex-1">
|
<div className="px-4 sm:px-6 flex-1">
|
||||||
<h2 className="pt-1 pb-4 text-lg leading-7 font-medium text-gray-900 uppercase">
|
<h2 className="pt-1 pb-4 text-2xl leading-7 font-bold text-primary tracking-wide">
|
||||||
My Cart
|
My Cart
|
||||||
</h2>
|
</h2>
|
||||||
<ul className="py-6 space-y-6 sm:py-0 sm:space-y-0 sm:divide-y sm:divide-gray-200 border-t border-gray-200">
|
<ul className="py-6 space-y-6 sm:py-0 sm:space-y-0 sm:divide-y sm:divide-gray-200 border-t border-gray-200">
|
||||||
|
@ -17,7 +17,7 @@ const Searchbar: FC<Props> = ({ className }) => {
|
|||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
'relative rounded-lg text-sm bg-accent-1 text-gray-600 w-full',
|
'relative rounded-lg text-sm bg-accent-2 text-gray-600 w-full',
|
||||||
className
|
className
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
@ -8,7 +8,7 @@ interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const Container: FC<Props> = ({ children, className, el = 'div' }) => {
|
const Container: FC<Props> = ({ children, className, el = 'div' }) => {
|
||||||
const rootClassName = cn('mx-auto max-w-screen-xl', className)
|
const rootClassName = cn('mx-auto max-w-7xl', className)
|
||||||
|
|
||||||
let Component: React.ComponentType<React.HTMLAttributes<
|
let Component: React.ComponentType<React.HTMLAttributes<
|
||||||
HTMLDivElement
|
HTMLDivElement
|
||||||
|
126
pages/blog.tsx
126
pages/blog.tsx
@ -1,5 +1,6 @@
|
|||||||
import { GetStaticPropsContext, InferGetStaticPropsType } from 'next'
|
import { GetStaticPropsContext, InferGetStaticPropsType } from 'next'
|
||||||
import { Layout } from '@components/core'
|
import { Layout } from '@components/core'
|
||||||
|
import { Container } from '@components/ui'
|
||||||
|
|
||||||
export async function getStaticProps({ preview }: GetStaticPropsContext) {
|
export async function getStaticProps({ preview }: GetStaticPropsContext) {
|
||||||
return {
|
return {
|
||||||
@ -13,71 +14,76 @@ export default function Blog({}: InferGetStaticPropsType<
|
|||||||
return (
|
return (
|
||||||
<div className="pb-20">
|
<div className="pb-20">
|
||||||
<div className="text-center pt-40 pb-56 bg-violet">
|
<div className="text-center pt-40 pb-56 bg-violet">
|
||||||
<h2 className="text-4xl tracking-tight leading-10 font-extrabold text-white sm:text-5xl sm:leading-none md:text-6xl">
|
<Container>
|
||||||
Welcome to Acme, the simplest way to start publishing with Next.js
|
<h2 className="text-4xl tracking-tight leading-10 font-extrabold text-white sm:text-5xl sm:leading-none md:text-6xl">
|
||||||
</h2>
|
Welcome to Acme, the simplest way to start publishing with Next.js
|
||||||
<p className="mt-3 max-w-md mx-auto text-base text-gray-100 sm:text-lg md:mt-5 md:text-xl md:max-w-3xl">
|
</h2>
|
||||||
The Yeezy BOOST 350 V2 lineup continues to grow. We recently had the
|
<p className="mt-3 max-w-md mx-auto text-gray-100 sm:text-lg md:mt-5 md:text-xl md:max-w-3xl">
|
||||||
‘Carbon’ iteration, and now release details have been locked in for
|
The Yeezy BOOST 350 V2 lineup continues to grow. We recently had the
|
||||||
this ‘Natural’ joint. Revealed by Yeezy Mafia earlier this year, the
|
‘Carbon’ iteration, and now release details have been locked in for
|
||||||
shoe was originally called ‘Abez’, which translated to ‘Tin’ in
|
this ‘Natural’ joint. Revealed by Yeezy Mafia earlier this year, the
|
||||||
Hebrew. It’s now undergone a name change, and will be referred to as
|
shoe was originally called ‘Abez’, which translated to ‘Tin’ in
|
||||||
‘Natura`
|
Hebrew. It’s now undergone a name change, and will be referred to as
|
||||||
</p>
|
‘Natura`
|
||||||
<div className="mt-5 max-w-md mx-auto sm:flex sm:justify-center md:mt-12">
|
</p>
|
||||||
<div className="flex">
|
<div className="mt-5 max-w-md mx-auto sm:flex sm:justify-center md:mt-12">
|
||||||
<div className="flex-shrink-0 inline-flex rounded-full border-2 border-white">
|
<div className="flex">
|
||||||
<img
|
<div className="flex-shrink-0 inline-flex rounded-full border-2 border-white">
|
||||||
className="h-12 w-12 rounded-full"
|
<img
|
||||||
src="https://vercel.com/api/www/avatar/61182a9f6bda512b4d9263c9c8a60aabe0402f4c?s=204"
|
className="h-12 w-12 rounded-full"
|
||||||
alt=""
|
src="https://vercel.com/api/www/avatar/61182a9f6bda512b4d9263c9c8a60aabe0402f4c?s=204"
|
||||||
/>
|
alt=""
|
||||||
</div>
|
/>
|
||||||
<div className="ml-4">
|
|
||||||
<div className="text-base leading-6 font-medium text-white">
|
|
||||||
José Rodriguez
|
|
||||||
</div>
|
</div>
|
||||||
<div className="text-base leading-6 font-medium text-gray-200">
|
<div className="ml-4">
|
||||||
CEO, Acme
|
<div className="leading-6 font-medium text-white">
|
||||||
|
José Rodriguez
|
||||||
|
</div>
|
||||||
|
<div className="leading-6 font-medium text-gray-200">
|
||||||
|
CEO, Acme
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</Container>
|
||||||
|
</div>
|
||||||
|
<Container>
|
||||||
|
<div className="-mt-96 mx-auto">
|
||||||
|
<img src="/jacket.png" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="text-lg leading-7 font-medium py-6 text-justify max-w-6xl mx-auto">
|
||||||
<div className=" -mt-96">
|
<p className="py-6">
|
||||||
<img src="/jacket.png" />
|
Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
|
||||||
</div>
|
Candy canes bonbon dragée jujubes chocolate bar. Cotton candy gummi
|
||||||
<div className="text-lg leading-7 font-medium py-6 text-justify max-w-6xl mx-auto">
|
bears toffee cake muffin caramels. Gummi bears danish liquorice ice
|
||||||
<p className="py-6">
|
cream pie chocolate cake lemon drops tootsie roll tart. Biscuit
|
||||||
Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake. Candy
|
gingerbread fruitcake cake powder pudding cotton candy chocolate
|
||||||
canes bonbon dragée jujubes chocolate bar. Cotton candy gummi bears
|
bar. Sweet donut marshmallow powder gummies jelly tart powder.
|
||||||
toffee cake muffin caramels. Gummi bears danish liquorice ice cream
|
Cheesecake bonbon caramels cupcake jujubes halvah donut dessert
|
||||||
pie chocolate cake lemon drops tootsie roll tart. Biscuit gingerbread
|
chocolate bar. Jelly gummies liquorice lollipop chocolate bar
|
||||||
fruitcake cake powder pudding cotton candy chocolate bar. Sweet donut
|
chocolate cake sugar plum. Lollipop toffee dragée chocolate bar
|
||||||
marshmallow powder gummies jelly tart powder. Cheesecake bonbon
|
jelly beans biscuit. Halvah danish cheesecake. Tiramisu donut
|
||||||
caramels cupcake jujubes halvah donut dessert chocolate bar. Jelly
|
lollipop pie donut caramels tiramisu. Jujubes candy canes pudding
|
||||||
gummies liquorice lollipop chocolate bar chocolate cake sugar plum.
|
danish fruitcake chupa chups jujubes carrot cake bonbon. Halvah
|
||||||
Lollipop toffee dragée chocolate bar jelly beans biscuit. Halvah
|
donut jelly halvah bonbon.
|
||||||
danish cheesecake. Tiramisu donut lollipop pie donut caramels
|
</p>
|
||||||
tiramisu. Jujubes candy canes pudding danish fruitcake chupa chups
|
<p className="py-6">
|
||||||
jujubes carrot cake bonbon. Halvah donut jelly halvah bonbon.
|
Biscuit sugar plum sweet chocolate cake sesame snaps soufflé
|
||||||
</p>
|
topping. Gummies topping bonbon chocolate pudding cookie. Wafer
|
||||||
<p className="py-6">
|
icing cake pastry. Gummies candy dessert chupa chups lemon drops.
|
||||||
Biscuit sugar plum sweet chocolate cake sesame snaps soufflé topping.
|
Soufflé marshmallow oat cake chocolate jelly-o caramels pie marzipan
|
||||||
Gummies topping bonbon chocolate pudding cookie. Wafer icing cake
|
jelly beans. Cheesecake liquorice donut jujubes halvah ice cream
|
||||||
pastry. Gummies candy dessert chupa chups lemon drops. Soufflé
|
cotton candy cupcake sugar plum. Ice cream ice cream sweet roll
|
||||||
marshmallow oat cake chocolate jelly-o caramels pie marzipan jelly
|
fruitcake icing. Muffin candy canes bonbon croissant gummies lemon
|
||||||
beans. Cheesecake liquorice donut jujubes halvah ice cream cotton
|
drops pie danish. Oat cake chocolate toffee cake jelly tart
|
||||||
candy cupcake sugar plum. Ice cream ice cream sweet roll fruitcake
|
caramels. Sweet donut cheesecake pastry pie sweet. Bonbon lollipop
|
||||||
icing. Muffin candy canes bonbon croissant gummies lemon drops pie
|
brownie. Soufflé pudding macaroon cotton candy gingerbread. Biscuit
|
||||||
danish. Oat cake chocolate toffee cake jelly tart caramels. Sweet
|
macaroon gummi bears candy canes chocolate cake lemon drops
|
||||||
donut cheesecake pastry pie sweet. Bonbon lollipop brownie. Soufflé
|
marshmallow. Chocolate cake cotton candy marshmallow cake sweet
|
||||||
pudding macaroon cotton candy gingerbread. Biscuit macaroon gummi
|
tootsie roll bonbon carrot cake sugar plum.
|
||||||
bears candy canes chocolate cake lemon drops marshmallow. Chocolate
|
</p>
|
||||||
cake cotton candy marshmallow cake sweet tootsie roll bonbon carrot
|
</div>
|
||||||
cake sugar plum.
|
</Container>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -12,6 +12,7 @@ module.exports = {
|
|||||||
extend: {
|
extend: {
|
||||||
colors: {
|
colors: {
|
||||||
'accent-1': '#FAFAFA',
|
'accent-1': '#FAFAFA',
|
||||||
|
'accent-2': '#F1F3F5',
|
||||||
'accent-4': '#888',
|
'accent-4': '#888',
|
||||||
violet: '#7928CA',
|
violet: '#7928CA',
|
||||||
pink: '#FF0080',
|
pink: '#FF0080',
|
||||||
|
Loading…
x
Reference in New Issue
Block a user