cx/commerce
4
0
Fork 0
forked from crowetic/commerce
Code Pull Requests Activity

Changes to BLog

Browse Source
This commit is contained in:
Belen Curcio 2020-10-13 09:52:18 -03:00
parent 2ad115af61
commit 7efda91b11
5 changed files with 82 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/cart/CartSidebarView/CartSidebarView.tsx
View File

@ -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(
data && {
amount: data.base_amount, amount: data.base_amount,
currencyCode: data.currency.code, currencyCode: data.currency.code,
}) }
const { price: total } = usePrice(data && { )
const { price: total } = usePrice(
data && {
amount: data.cart_amount, amount: data.cart_amount,
currencyCode: data.currency.code, 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">

2
components/core/Searchbar/Searchbar.tsx
View File

@ -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
)} )}
> >

2
components/ui/Container/Container.tsx
View File

@ -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

64
pages/blog.tsx
View File

@ -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,10 +14,11 @@ 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">
<Container>
<h2 className="text-4xl tracking-tight leading-10 font-extrabold text-white sm:text-5xl sm:leading-none md:text-6xl"> <h2 className="text-4xl tracking-tight leading-10 font-extrabold text-white sm:text-5xl sm:leading-none md:text-6xl">
Welcome to Acme, the simplest way to start publishing with Next.js Welcome to Acme, the simplest way to start publishing with Next.js
</h2> </h2>
<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"> <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">
The Yeezy BOOST 350 V2 lineup continues to grow. We recently had the The Yeezy BOOST 350 V2 lineup continues to grow. We recently had the
‘Carbon’ iteration, and now release details have been locked in for ‘Carbon’ iteration, and now release details have been locked in for
this ‘Natural’ joint. Revealed by Yeezy Mafia earlier this year, the this ‘Natural’ joint. Revealed by Yeezy Mafia earlier this year, the
@ -34,50 +36,54 @@ export default function Blog({}: InferGetStaticPropsType<
/> />
</div> </div>
<div className="ml-4"> <div className="ml-4">
<div className="text-base leading-6 font-medium text-white"> <div className="leading-6 font-medium text-white">
José Rodriguez José Rodriguez
</div> </div>
<div className="text-base leading-6 font-medium text-gray-200"> <div className="leading-6 font-medium text-gray-200">
CEO, Acme CEO, Acme
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</Container>
</div> </div>
<div className=" -mt-96"> <Container>
<div className="-mt-96 mx-auto">
<img src="/jacket.png" /> <img src="/jacket.png" />
</div> </div>
<div className="text-lg leading-7 font-medium py-6 text-justify max-w-6xl mx-auto"> <div className="text-lg leading-7 font-medium py-6 text-justify max-w-6xl mx-auto">
<p className="py-6"> <p className="py-6">
Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake. Candy Biscuit oat cake wafer icing ice cream tiramisu pudding cupcake.
canes bonbon dragée jujubes chocolate bar. Cotton candy gummi bears Candy canes bonbon dragée jujubes chocolate bar. Cotton candy gummi
toffee cake muffin caramels. Gummi bears danish liquorice ice cream bears toffee cake muffin caramels. Gummi bears danish liquorice ice
pie chocolate cake lemon drops tootsie roll tart. Biscuit gingerbread cream pie chocolate cake lemon drops tootsie roll tart. Biscuit
fruitcake cake powder pudding cotton candy chocolate bar. Sweet donut gingerbread fruitcake cake powder pudding cotton candy chocolate
marshmallow powder gummies jelly tart powder. Cheesecake bonbon bar. Sweet donut marshmallow powder gummies jelly tart powder.
caramels cupcake jujubes halvah donut dessert chocolate bar. Jelly Cheesecake bonbon caramels cupcake jujubes halvah donut dessert
gummies liquorice lollipop chocolate bar chocolate cake sugar plum. chocolate bar. Jelly gummies liquorice lollipop chocolate bar
Lollipop toffee dragée chocolate bar jelly beans biscuit. Halvah chocolate cake sugar plum. Lollipop toffee dragée chocolate bar
danish cheesecake. Tiramisu donut lollipop pie donut caramels jelly beans biscuit. Halvah danish cheesecake. Tiramisu donut
tiramisu. Jujubes candy canes pudding danish fruitcake chupa chups lollipop pie donut caramels tiramisu. Jujubes candy canes pudding
jujubes carrot cake bonbon. Halvah donut jelly halvah bonbon. danish fruitcake chupa chups jujubes carrot cake bonbon. Halvah
donut jelly halvah bonbon.
</p> </p>
<p className="py-6"> <p className="py-6">
Biscuit sugar plum sweet chocolate cake sesame snaps soufflé topping. Biscuit sugar plum sweet chocolate cake sesame snaps soufflé
Gummies topping bonbon chocolate pudding cookie. Wafer icing cake topping. Gummies topping bonbon chocolate pudding cookie. Wafer
pastry. Gummies candy dessert chupa chups lemon drops. Soufflé icing cake pastry. Gummies candy dessert chupa chups lemon drops.
marshmallow oat cake chocolate jelly-o caramels pie marzipan jelly Soufflé marshmallow oat cake chocolate jelly-o caramels pie marzipan
beans. Cheesecake liquorice donut jujubes halvah ice cream cotton jelly beans. Cheesecake liquorice donut jujubes halvah ice cream
candy cupcake sugar plum. Ice cream ice cream sweet roll fruitcake cotton candy cupcake sugar plum. Ice cream ice cream sweet roll
icing. Muffin candy canes bonbon croissant gummies lemon drops pie fruitcake icing. Muffin candy canes bonbon croissant gummies lemon
danish. Oat cake chocolate toffee cake jelly tart caramels. Sweet drops pie danish. Oat cake chocolate toffee cake jelly tart
donut cheesecake pastry pie sweet. Bonbon lollipop brownie. Soufflé caramels. Sweet donut cheesecake pastry pie sweet. Bonbon lollipop
pudding macaroon cotton candy gingerbread. Biscuit macaroon gummi brownie. Soufflé pudding macaroon cotton candy gingerbread. Biscuit
bears candy canes chocolate cake lemon drops marshmallow. Chocolate macaroon gummi bears candy canes chocolate cake lemon drops
cake cotton candy marshmallow cake sweet tootsie roll bonbon carrot marshmallow. Chocolate cake cotton candy marshmallow cake sweet
cake sugar plum. tootsie roll bonbon carrot cake sugar plum.
</p> </p>
</div> </div>
</Container>
</div> </div>
) )
} }

1
tailwind.config.js
View File

@ -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',