remove toggle animation
This commit is contained in:
parent
25c95170e6
commit
d6cc3a419b
|
@ -1,5 +1,4 @@
|
|||
import clsx from "clsx";
|
||||
import { motion } from "framer-motion";
|
||||
import React from "react";
|
||||
|
||||
type IconType = (props: React.ComponentProps<"svg">) => JSX.Element;
|
||||
|
@ -19,9 +18,7 @@ export const Toggle: React.FC<Props> = ({
|
|||
}) => {
|
||||
const CurrentIcon = status ? OnIcon : OffIcon;
|
||||
return (
|
||||
<motion.button
|
||||
layout
|
||||
transition={{ duration: 0.2 }}
|
||||
<button
|
||||
className={clsx(
|
||||
"rounded-md py-0.5 bg-slate-500 text-white text-xs font-semibold flex items-center space-x-1",
|
||||
status ? "bg-slate-500" : "bg-gray-400",
|
||||
|
@ -30,12 +27,10 @@ export const Toggle: React.FC<Props> = ({
|
|||
)}
|
||||
onClick={() => onChange(!status)}
|
||||
>
|
||||
<motion.div layout transition={{ duration: 0.2 }}>
|
||||
<div>
|
||||
<CurrentIcon className="w-6 h-6" />
|
||||
</motion.div>
|
||||
<motion.span layout transition={{ duration: 0.2 }}>
|
||||
{status ? onText : offText}
|
||||
</motion.span>
|
||||
</motion.button>
|
||||
</div>
|
||||
<span>{status ? onText : offText}</span>
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue
Block a user