From 78a9a9c4510eece507c3958df9007c249526b003 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 20 Oct 2020 16:19:02 -0300
Subject: [PATCH] Responsive

---
 components/core/Navbar/Navbar.tsx | 11 ++++++-----
 pages/_app.tsx                    |  3 +++
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/components/core/Navbar/Navbar.tsx b/components/core/Navbar/Navbar.tsx
index b3026a15b..5b1172754 100644
--- a/components/core/Navbar/Navbar.tsx
+++ b/components/core/Navbar/Navbar.tsx
@@ -13,14 +13,14 @@ const Navbar: FC<Props> = ({ className }) => {
   const { theme, setTheme } = useTheme()
   return (
     <div className={rootClassName}>
-      <div className="flex justify-between align-center flex-row py-4 lg:py-6 relative">
+      <div className="flex justify-between align-center flex-row py-4 md:py-6 relative">
         <div className="flex flex-1 items-center">
           <Link href="/">
             <a className="cursor-pointer">
               <Logo />
             </a>
           </Link>
-          <nav className="space-x-4 ml-6 hidden lg:block">
+          <nav className="space-x-4 ml-6 sm:hidden lg:block">
             <Link href="/">
               <a className={s.link}>All</a>
             </Link>
@@ -33,11 +33,11 @@ const Navbar: FC<Props> = ({ className }) => {
           </nav>
         </div>
 
-        <div className="lg:flex flex-1 justify-center hidden">
+        <div className="lg:flex flex-1 justify-center sm:hidden">
           <Searchbar />
         </div>
 
-        <div className="flex flex-initial lg:flex-1 justify-end space-x-8">
+        <div className="flex flex-1 justify-end space-x-8">
           <Toggle
             checked={theme === 'dark'}
             onChange={() =>
@@ -47,7 +47,8 @@ const Navbar: FC<Props> = ({ className }) => {
           <UserNav />
         </div>
       </div>
-      <div className="block flex pb-4 lg:hidden px-4 lg:px-6">
+
+      <div className="sm:flex pb-4 lg:px-6 lg:hidden">
         <Searchbar />
       </div>
     </div>
diff --git a/pages/_app.tsx b/pages/_app.tsx
index 8b95bcf40..f6c1ffcd8 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -1,7 +1,10 @@
 import '@assets/global.css'
 import '@assets/tailwind.css'
 import '@assets/utils.css'
+
+// To be removed
 import 'animate.css'
+
 import { FC } from 'react'
 import type { AppProps } from 'next/app'