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