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

changes

Browse Source
This commit is contained in:
Belen Curcio 2020-09-29 14:57:21 -03:00
parent 0a9a95caae
commit c10a4ce95b
3 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/Navbar/Navbar.module.css
View File

@ -1,3 +1,3 @@
.container { .root {
@apply flex justify-between items-center flex-row px-6 h-20 relative border-gray-100 border-b; @apply flex justify-between items-center flex-row px-6 h-20 relative border-gray-100 border-b;
} }

28
components/Navbar/Navbar.tsx
View File

@ -11,22 +11,20 @@ interface Props {
const Navbar: FunctionComponent<Props> = ({ className }) => { const Navbar: FunctionComponent<Props> = ({ className }) => {
const rootClassName = cn(s.root, className); const rootClassName = cn(s.root, className);
return ( return (
<div className={rootClassName}> <Container className={rootClassName}>
<Container className={s.container}> <Logo />
<Logo /> <div className="flex flex-row h-full content-center flex-1">
<div className="flex flex-row h-full content-center flex-1"> <Searchbar />
<Searchbar /> <nav className="hidden flex-row items-center px-3 lg:flex">
<nav className="hidden flex-row items-center px-3 lg:flex"> <a className="pr-4">All</a>
<a className="pr-4">All</a> <a className="pr-4">Clothes</a>
<a className="pr-4">Clothes</a> <a>Accesories</a>
<a>Accesories</a>
</nav>
</div>
<nav>
<Avatar />
</nav> </nav>
</Container> </div>
</div> <nav>
<Avatar />
</nav>
</Container>
); );
}; };

4
pages/index.tsx
View File

@ -11,9 +11,9 @@ export default function Home() {
<Navbar /> <Navbar />
<Container className="px-4 py-5 h-screen"> <Container className="px-4 py-5 h-screen">
<div className="grid grid-cols-1 h-full lg:grid-cols-3 lg:grid-rows-2"> <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-indigo-700 h-full"></div> <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> <div className="lg:row-span-1 lg:col-span-1 bg-black h-full"></div>
<div className="lg:row-span-1 lg:col-span-1 bg-red-500"></div> <div className="lg:row-span-1 lg:col-span-1 bg-pink"></div>
</div> </div>
</Container> </Container>
<Footer></Footer> <Footer></Footer>