crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-18 15:36:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Modif footer

Browse Source
This commit is contained in:
Bel Curcio 2021-05-31 17:24:53 -03:00
parent 672df042d5
commit 96836b1969
3 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/common/Footer/Footer.tsx
View File

@ -24,7 +24,7 @@ const Footer: FC<Props> = ({ className, pages }) => {
return ( return (
<footer className={rootClassName}> <footer className={rootClassName}>
<Container> <Container>
<div className="grid grid-cols-1 lg:grid-cols-12 gap-8 border-b border-accent-2 py-12 text-primary bg-primary transition-colors duration-150"> <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 border-b border-accent-2 py-6 text-primary bg-primary transition-colors duration-150">
<div className="col-span-1 lg:col-span-2"> <div className="col-span-1 lg:col-span-2">
<Link href="/"> <Link href="/">
<a className="flex flex-initial items-center font-bold md:mr-24"> <a className="flex flex-initial items-center font-bold md:mr-24">
@ -95,12 +95,12 @@ const Footer: FC<Props> = ({ className, pages }) => {
</div> </div>
</div> </div>
</div> </div>
<div className="py-12 flex flex-col md:flex-row justify-between items-center space-y-4"> <div className="pt-6 pb-10 flex flex-col md:flex-row justify-between items-center space-y-4 text-accent-6 text-sm">
<div> <div>
<span>&copy; 2020 ACME, Inc. All rights reserved.</span> <span>&copy; 2020 ACME, Inc. All rights reserved.</span>
</div> </div>
<div className="flex items-center text-primary"> <div className="flex items-center text-primary text-sm">
<span className="text-primary">Crafted by</span> <span className="text-primary">Created by</span>
<a <a
rel="noopener" rel="noopener"
href="https://vercel.com" href="https://vercel.com"
@ -109,7 +109,7 @@ const Footer: FC<Props> = ({ className, pages }) => {
className="text-primary" className="text-primary"
> >
<Vercel <Vercel
className="inline-block h-6 ml-4 text-primary" className="inline-block h-6 ml-3 text-primary"
alt="Vercel.com Logo" alt="Vercel.com Logo"
/> />
</a> </a>

10
components/product/ProductView/ProductView.module.css
View File

@ -6,8 +6,8 @@
} }
} }
.productDisplay { .main {
@apply relative flex px-0 pb-0 box-border col-span-1 bg-violet; @apply relative px-0 pb-0 box-border flex flex-col col-span-1;
min-height: 600px; min-height: 600px;
@screen md { @screen md {
@ -15,11 +15,7 @@
} }
@screen lg { @screen lg {
margin-right: -2rem;
margin-left: -2rem;
@apply mx-0 col-span-8; @apply mx-0 col-span-8;
min-height: 100%;
height: 100%;
} }
} }
@ -61,7 +57,7 @@
} }
.sliderContainer { .sliderContainer {
@apply absolute z-10 inset-0 flex items-center justify-center overflow-x-hidden; @apply flex items-center justify-center overflow-x-hidden bg-violet;
} }
.imageContainer { .imageContainer {

10
components/product/ProductView/ProductView.tsx
View File

@ -75,7 +75,7 @@ const ProductView: FC<Props> = ({ product }) => {
}} }}
/> />
<div className={cn(s.root, 'fit')}> <div className={cn(s.root, 'fit')}>
<div className={cn(s.productDisplay, 'fit')}> <div className={cn(s.main, 'fit')}>
<div className={s.nameBox}> <div className={s.nameBox}>
<h1 className={s.name}>{product.name}</h1> <h1 className={s.name}>{product.name}</h1>
<div className={s.price}> <div className={s.price}>
@ -171,6 +171,14 @@ const ProductView: FC<Props> = ({ product }) => {
</div> </div>
</div> </div>
</div> </div>
<section className="py-12 px-6">
<Text variant="sectionHeading">Related Products</Text>
<div className="grid grid-cols-4 py-3 gap-5 h-48">
{Array.from({ length: 4 }).map((i) => (
<div className="bg-accent-6" />
))}
</div>
</section>
</Container> </Container>
) )
} }