Responsive

This commit is contained in:
Belen Curcio
2020-10-20 16:19:02 -03:00
parent d2b36737bf
commit 78a9a9c451
2 changed files with 9 additions and 5 deletions

View File

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