forked from crowetic/commerce
Responsive
This commit is contained in:
parent
d2b36737bf
commit
78a9a9c451
@ -13,14 +13,14 @@ const Navbar: FC<Props> = ({ className }) => {
|
|||||||
const { theme, setTheme } = useTheme()
|
const { theme, setTheme } = useTheme()
|
||||||
return (
|
return (
|
||||||
<div className={rootClassName}>
|
<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">
|
<div className="flex flex-1 items-center">
|
||||||
<Link href="/">
|
<Link href="/">
|
||||||
<a className="cursor-pointer">
|
<a className="cursor-pointer">
|
||||||
<Logo />
|
<Logo />
|
||||||
</a>
|
</a>
|
||||||
</Link>
|
</Link>
|
||||||
<nav className="space-x-4 ml-6 hidden lg:block">
|
<nav className="space-x-4 ml-6 sm:hidden lg:block">
|
||||||
<Link href="/">
|
<Link href="/">
|
||||||
<a className={s.link}>All</a>
|
<a className={s.link}>All</a>
|
||||||
</Link>
|
</Link>
|
||||||
@ -33,11 +33,11 @@ const Navbar: FC<Props> = ({ className }) => {
|
|||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="lg:flex flex-1 justify-center hidden">
|
<div className="lg:flex flex-1 justify-center sm:hidden">
|
||||||
<Searchbar />
|
<Searchbar />
|
||||||
</div>
|
</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
|
<Toggle
|
||||||
checked={theme === 'dark'}
|
checked={theme === 'dark'}
|
||||||
onChange={() =>
|
onChange={() =>
|
||||||
@ -47,7 +47,8 @@ const Navbar: FC<Props> = ({ className }) => {
|
|||||||
<UserNav />
|
<UserNav />
|
||||||
</div>
|
</div>
|
||||||
</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 />
|
<Searchbar />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,7 +1,10 @@
|
|||||||
import '@assets/global.css'
|
import '@assets/global.css'
|
||||||
import '@assets/tailwind.css'
|
import '@assets/tailwind.css'
|
||||||
import '@assets/utils.css'
|
import '@assets/utils.css'
|
||||||
|
|
||||||
|
// To be removed
|
||||||
import 'animate.css'
|
import 'animate.css'
|
||||||
|
|
||||||
import { FC } from 'react'
|
import { FC } from 'react'
|
||||||
import type { AppProps } from 'next/app'
|
import type { AppProps } from 'next/app'
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user