mirror of
https://github.com/vercel/commerce.git
synced 2025-07-21 11:51:20 +00:00
fix: revert file error
This commit is contained in:
parent
28143afed0
commit
90f45b4334
@ -1,6 +1,6 @@
|
||||
@import "../../../styles/utilities";
|
||||
.menuFilterWrapper{
|
||||
@apply spacing-horizontal ;
|
||||
|
||||
@screen md {
|
||||
@apply hidden;
|
||||
}
|
||||
@ -14,30 +14,27 @@
|
||||
@apply flex flex-wrap justify-start relative;
|
||||
margin-bottom: 3rem;
|
||||
box-sizing: border-box;
|
||||
&::after{
|
||||
@apply absolute;
|
||||
top: 110%;
|
||||
content: "";
|
||||
width: 100%;
|
||||
border-bottom: 1px solid var(--border-line);
|
||||
}
|
||||
|
||||
li{
|
||||
margin: 1rem 0;
|
||||
padding:0;
|
||||
a{
|
||||
div{
|
||||
padding: 0.8rem 1.6rem;
|
||||
margin-right: 0.8rem;
|
||||
background-color: var(--gray);
|
||||
border-radius: 0.8rem;
|
||||
&:hover {
|
||||
color:white;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
&.active {
|
||||
color:white;
|
||||
background-color: var(--primary);
|
||||
}
|
||||
}
|
||||
}
|
||||
&::after{
|
||||
@apply absolute;
|
||||
bottom: -20%;
|
||||
content: "";
|
||||
width: 100%;
|
||||
border-bottom: 1px solid var(--border-line);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1,30 +1,43 @@
|
||||
import classNames from 'classnames'
|
||||
import Link from 'next/link'
|
||||
import { useRouter } from 'next/router'
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
import s from './MenuFilter.module.scss'
|
||||
|
||||
|
||||
interface Props {
|
||||
children?: any,
|
||||
heading:string,
|
||||
categories:{name:string,link:string}[]
|
||||
heading?:string,
|
||||
categories:{name:string,link:string}[],
|
||||
type:string,
|
||||
onChangeValue?: (value: Object) => void
|
||||
}
|
||||
|
||||
const MenuFilter = ({heading,categories}:Props)=> {
|
||||
const router = useRouter()
|
||||
const MenuFilter = ({heading,categories,type,onChangeValue}:Props)=> {
|
||||
const [active, setActive] = useState<string>('');
|
||||
|
||||
function handleClick(link:string){
|
||||
setActive(link);
|
||||
|
||||
if(active === link){
|
||||
setActive('');
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(()=>{
|
||||
|
||||
let href = active?.split("=");
|
||||
const linkValue = href[1];
|
||||
|
||||
onChangeValue && onChangeValue({[type]:linkValue});
|
||||
},[active])
|
||||
|
||||
return (
|
||||
<section className={s.menuFilterWrapper}>
|
||||
<h2 className={s.menuFilterHeading}>{heading}</h2>
|
||||
<ul className={s.menuFilterList}>
|
||||
{
|
||||
categories.map(item => <li key={item.name}>
|
||||
<Link href={item.link}>
|
||||
<a className={classNames({ [s.active]: router.asPath === item.link})}>
|
||||
{item.name}
|
||||
</a>
|
||||
</Link>
|
||||
<div onClick={()=> handleClick(item.link)} className={classNames({ [s.active]: item.link === active? true: false })}>
|
||||
{item.name}
|
||||
</div>
|
||||
</li>)
|
||||
}
|
||||
</ul>
|
||||
|
@ -2,12 +2,9 @@ export const LANGUAGE = {
|
||||
BUTTON_LABEL: {
|
||||
BUY_NOW: 'Buy now',
|
||||
SHOP_NOW: 'Shop now',
|
||||
<<<<<<< HEAD
|
||||
CONFIRM:'Confirm'
|
||||
=======
|
||||
CONFIRM:'Confirm',
|
||||
ADD_TO_CARD: 'Add to Cart',
|
||||
PREORDER: 'Pre-Order Now',
|
||||
>>>>>>> a9f9f06eb9dee2a1ddefe907ff804237a78c5210
|
||||
},
|
||||
PLACE_HOLDER: {
|
||||
SEARCH: 'Search',
|
||||
|
Loading…
x
Reference in New Issue
Block a user