Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | import { ReactElement } from "react"; import { IUseToggleHandlers } from "hooks/useToggle"; interface ITextToggleButtonProps { isToggle: boolean; toggleHandlers: IUseToggleHandlers; activeText: string; inactiveText: string; } export default function TextToggleButton({ isToggle, toggleHandlers, activeText, inactiveText, }: ITextToggleButtonProps): ReactElement { return ( <button type="button" onClick={(e) => { e.stopPropagation(); toggleHandlers.toggle(); }} > {isToggle ? activeText : inactiveText} <style jsx>{` button { background: none; border: none; color: rgba(255, 255, 255, 0.7); margin: 18px 0; font-weight: bold; } button:hover, button:focus { color: white; } `}</style> </button> ); } |