use emoji instead of hide

src/settings.tsx

@@ -104,13 +104,15 @@ const Input = (props: {
   return (
     <Help help={props.help}>
       <label className="m-2 p-2">{props.field}</label>
-      <span
+      <button
-        className="m-2 p-2"
+       className="p-2"
-        onClick={(event: any) => setHideInput(!hideInput)}
+        onClick={() => {
+          setHideInput(!hideInput);
+          console.log("clicked", hideInput);
+        }}
       >
-        <label>hide</label>
+        {hideInput ? "👀" : "🙈"}
-        <input type="checkbox" checked={hideInput} />
+      </button>
-      </span>
       <input
         type={hideInput ? "password" : "text"}
         className="m-2 p-2 border rounded focus w-32 md:w-fit"