Return buttons now close the subpanel in mobile
This commit is contained in:
parent
8731557f40
commit
7efeb08bb7
|
@ -1,4 +1,5 @@
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
import { MouseEventHandler } from "react";
|
||||||
|
|
||||||
type ButtonProps = {
|
type ButtonProps = {
|
||||||
className?: string;
|
className?: string;
|
||||||
|
@ -6,11 +7,13 @@ type ButtonProps = {
|
||||||
children: React.ReactChild | React.ReactChild[];
|
children: React.ReactChild | React.ReactChild[];
|
||||||
active?: boolean;
|
active?: boolean;
|
||||||
locale?: string;
|
locale?: string;
|
||||||
|
onClick?: MouseEventHandler<HTMLDivElement>;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function Button(props: ButtonProps): JSX.Element {
|
export default function Button(props: ButtonProps): JSX.Element {
|
||||||
const button = (
|
const button = (
|
||||||
<div
|
<div
|
||||||
|
onClick={props.onClick}
|
||||||
className={`grid place-content-center place-items-center border-[1px] border-dark text-dark rounded-full px-4 pt-[0.4rem] pb-[0.5rem] transition-all ${
|
className={`grid place-content-center place-items-center border-[1px] border-dark text-dark rounded-full px-4 pt-[0.4rem] pb-[0.5rem] transition-all ${
|
||||||
props.className
|
props.className
|
||||||
} ${
|
} ${
|
||||||
|
|
|
@ -1,5 +1,7 @@
|
||||||
import Button from "components/Button";
|
import Button from "components/Button";
|
||||||
import { GetWebsiteInterfaceQuery } from "graphql/operations-types";
|
import { GetWebsiteInterfaceQuery } from "graphql/operations-types";
|
||||||
|
import { useDispatch } from "react-redux";
|
||||||
|
import { setSubPanelOpen } from "redux/AppLayoutSlice";
|
||||||
|
|
||||||
type ReturnButtonProps = {
|
type ReturnButtonProps = {
|
||||||
href: string;
|
href: string;
|
||||||
|
@ -8,8 +10,10 @@ type ReturnButtonProps = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function ReturnButton(props: ReturnButtonProps): JSX.Element {
|
export default function ReturnButton(props: ReturnButtonProps): JSX.Element {
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Button href={props.href}>
|
<Button onClick={() => dispatch(setSubPanelOpen(false))} href={props.href}>
|
||||||
❮ {props.langui.global_return_label} {props.title}
|
❮ {props.langui.global_return_label} {props.title}
|
||||||
</Button>
|
</Button>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in New Issue