From d26ab52cb25563240fa42c0189f5859091c01355 Mon Sep 17 00:00:00 2001 From: Belen Curcio Date: Wed, 23 Sep 2020 16:57:17 -0300 Subject: [PATCH] More UI Changes --- components/Navbar/Navbar.module.css | 6 +++++- components/Navbar/Navbar.tsx | 14 ++++++++------ pages/index.tsx | 2 +- ui/Container/Container.module.css | 3 ++- 4 files changed, 16 insertions(+), 9 deletions(-) diff --git a/components/Navbar/Navbar.module.css b/components/Navbar/Navbar.module.css index d0189b847..15275affc 100644 --- a/components/Navbar/Navbar.module.css +++ b/components/Navbar/Navbar.module.css @@ -1,3 +1,7 @@ .root { - @apply flex justify-between items-center px-4 py-5; + @apply px-4 py-5; +} + +.container { + @apply flex justify-between items-center flex-row; } diff --git a/components/Navbar/Navbar.tsx b/components/Navbar/Navbar.tsx index 49c77871b..e5036ed7d 100644 --- a/components/Navbar/Navbar.tsx +++ b/components/Navbar/Navbar.tsx @@ -1,7 +1,7 @@ import cn from "classnames"; -import { FunctionComponent } from "react"; +import React, { FunctionComponent } from "react"; import s from "./Navbar.module.css"; -import { Logo } from "ui"; +import { Logo, Container } from "ui"; interface Props { className?: string; children?: any; @@ -11,10 +11,12 @@ const Navbar: FunctionComponent = ({ className }) => { const rootClassName = cn(s.root, className); return (
- -
SEARCH BAR
-
Menu list bar
-
Menu Icon bar
+ + +
SEARCH BAR
+
Menu list bar
+
Menu Icon bar
+
); }; diff --git a/pages/index.tsx b/pages/index.tsx index 761d12e0b..7e202e306 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -9,7 +9,7 @@ export default function Home() { title="Free Standard Shipping on orders over $99.99" description="Due to COVID-19, some orders may experience processing and delivery delays." /> - + diff --git a/ui/Container/Container.module.css b/ui/Container/Container.module.css index 8f87e20dc..b244b6372 100644 --- a/ui/Container/Container.module.css +++ b/ui/Container/Container.module.css @@ -1,3 +1,4 @@ .root { - @apply max-w-6xl mx-auto; + @apply max-w-6xl mx-auto px-2; + display: inherit; }