78 lines
2.0 KiB
TypeScript
78 lines
2.0 KiB
TypeScript
// islands/StudyButton.tsx
|
|
|
|
import { useState } from "preact/hooks";
|
|
import { JSX } from "preact/jsx-runtime";
|
|
|
|
interface SyncButtonProps {
|
|
setCanStudy: any;
|
|
}
|
|
|
|
export default function SyncButton(
|
|
{ setCanStudy }: SyncButtonProps,
|
|
) {
|
|
//const [clicked, setClicked] = useState(true);
|
|
|
|
const handleClick = () => {
|
|
//setClicked(true);
|
|
//onClick();
|
|
};
|
|
const handleStudyClick = (
|
|
event: JSX.TargetedMouseEvent<HTMLButtonElement>,
|
|
) => {
|
|
//console.log("clicked");
|
|
if (!setCanStudy.value) {
|
|
event.preventDefault();
|
|
}
|
|
};
|
|
return (
|
|
<a href="/resync">
|
|
<button
|
|
className={`w-8 h-8 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded-full shadow-lg transition-all duration-300 ease-in-out transform hover:scale-110 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 flex flex-col justify-center items-center ${
|
|
setCanStudy.value ? "opacity-0" : ""
|
|
}`}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
className="h-6 w-6"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
>
|
|
<path
|
|
d="M3 12a9 9 0 0115.07-6.36"
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
fill="none"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M21 3v5h-5"
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
fill="none"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M21 12a9 9 0 01-15.07 6.36"
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
fill="none"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
<path
|
|
d="M3 21v-5h5"
|
|
stroke="currentColor"
|
|
strokeWidth={2}
|
|
fill="none"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
</svg>
|
|
</button>
|
|
</a>
|
|
);
|
|
}
|