Component laden...

Laden

Meer onderdelen

Bekijk alles
Oeps! Er ging iets mis bij het verzenden van het formulier.
Show/Hide Password Component
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca241","type":"Block","tag":"div","classes":["e2324e2a-b829-05ca-4a67-0076f02ca027"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca242","edd8c65b-02db-acf2-0c78-be75a9aca244","edd8c65b-02db-acf2-0c78-be75a9aca245","edd8c65b-02db-acf2-0c78-be75a9aca246"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca242","type":"FormBlockLabel","tag":"label","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca243"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":{"field":""},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Password","id":""},"visibility":{"conditions":[]}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca243","text":true,"v":"Password"},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca244","type":"FormTextInput","tag":"input","classes":[],"children":[],"data":{"displayName":"","attr":{"autofocus":false,"maxlength":256,"name":"Password","data-name":"Password","placeholder":"","type":"password","id":"Password","disabled":false,"required":true},"xattr":[{"name":"data-ms-member","value":"password"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"name":"Password","type":"input","passwordPage":false},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca245","type":"HtmlEmbed","tag":"div","classes":["09a3d99e-ca57-5ee5-a9cc-55689975d369"],"children":[],"v":"<!-- 💙 MEMBERSCRIPT #45 v0.1 💙 Show/Hide Password -->\n<script>\n document.querySelector(\"[ms-code-password=transform]\").addEventListener(\"click\", transform);\n var isPassword = true;\n\n function transform() {\n var myInput = document.querySelector(\"[data-ms-member=password]\");\n var inputType = myInput.getAttribute(\"type\");\n\n if (isPassword) {\n myInput.setAttribute(\"type\", \"text\");\n } else {\n myInput.setAttribute(\"type\", \"password\");\n }\n\n isPassword = !isPassword;\n }\n</script>","data":{"insideRTE":false,"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<!-- 💙 MEMBERSCRIPT #45 v0.1 💙 Show/Hide Password -->\n<script>\n document.querySelector(\"[ms-code-password=transform]\").addEventListener(\"click\", transform);\n var isPassword = true;\n\n function transform() {\n var myInput = document.querySelector(\"[data-ms-member=password]\");\n var inputType = myInput.getAttribute(\"type\");\n\n if (isPassword) {\n myInput.setAttribute(\"type\", \"text\");\n } else {\n myInput.setAttribute(\"type\", \"password\");\n }\n\n isPassword = !isPassword;\n }\n</script>","div":false,"iframe":false,"script":true},"type":"html"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca246","type":"TabsWrapper","tag":"div","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135cf"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca247","edd8c65b-02db-acf2-0c78-be75a9aca250"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tabs":{"type":"wrapper","current":"Show","easing":"ease","fadeIn":300,"fadeOut":100}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca247","type":"TabsMenu","tag":"div","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca248","edd8c65b-02db-acf2-0c78-be75a9aca24c"],"data":{"search":{"exclude":false},"xattr":[{"name":"ms-code-password","value":"transform"}],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"transformButton"},"visibility":{"conditions":[]},"tag":"div","tabs":{"type":"menu"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca248","type":"TabsLink","tag":"a","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d0"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca249","edd8c65b-02db-acf2-0c78-be75a9aca24a"],"data":{"search":{"exclude":false},"xattr":[],"block":"inline","displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"","data-w-tab":"Show"},"visibility":{"conditions":[]},"tabs":{"type":"link"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca249","type":"HtmlEmbed","tag":"div","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d1"],"children":[],"v":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M12 6.5c2.76 0 5 2.24 5 5 0 .51-.1 1-.24 1.46l3.06 3.06c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l2.17 2.17c.47-.14.96-.24 1.47-.24zM2.71 3.16c-.39.39-.39 1.02 0 1.41l1.97 1.97C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.97-.3 4.31-.82l2.72 2.72c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L4.13 3.16c-.39-.39-1.03-.39-1.42 0zM12 16.5c-2.76 0-5-2.24-5-5 0-.77.18-1.5.49-2.14l1.57 1.57c-.03.18-.06.37-.06.57 0 1.66 1.34 3 3 3 .2 0 .38-.03.57-.07L14.14 16c-.65.32-1.37.5-2.14.5zm2.97-5.33c-.15-1.4-1.25-2.49-2.64-2.64l2.64 2.64z\"/></svg>","data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M12 6.5c2.76 0 5 2.24 5 5 0 .51-.1 1-.24 1.46l3.06 3.06c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l2.17 2.17c.47-.14.96-.24 1.47-.24zM2.71 3.16c-.39.39-.39 1.02 0 1.41l1.97 1.97C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.97-.3 4.31-.82l2.72 2.72c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L4.13 3.16c-.39-.39-1.03-.39-1.42 0zM12 16.5c-2.76 0-5-2.24-5-5 0-.77.18-1.5.49-2.14l1.57 1.57c-.03.18-.06.37-.06.57 0 1.66 1.34 3 3 3 .2 0 .38-.03.57-.07L14.14 16c-.65.32-1.37.5-2.14.5zm2.97-5.33c-.15-1.4-1.25-2.49-2.64-2.64l2.64 2.64z\"/></svg>","div":false,"script":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24a","type":"Block","tag":"div","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca24b"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24b","text":true,"v":"Hide"},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24c","type":"TabsLink","tag":"a","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d0"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca24d","edd8c65b-02db-acf2-0c78-be75a9aca24e"],"data":{"search":{"exclude":false},"xattr":[],"block":"inline","displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"","data-w-tab":"Hide"},"visibility":{"conditions":[]},"tabs":{"type":"link"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24d","type":"HtmlEmbed","tag":"div","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d1"],"children":[],"v":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z\"/></svg>","data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z\"/></svg>","div":false,"script":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24e","type":"Block","tag":"div","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca24f"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24f","text":true,"v":"Show"},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca250","type":"TabsContent","tag":"div","classes":["1973b4f7-c1d1-3bdb-4eda-4686353dd483"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca251","edd8c65b-02db-acf2-0c78-be75a9aca252"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div","tabs":{"type":"content"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca251","type":"TabsPane","tag":"div","classes":[],"children":[],"data":{"displayName":"","attr":{"data-w-tab":"Show"},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"tag":"div","devlink":{"runtimeProps":{},"slot":""},"tabs":{"type":"pane"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca252","type":"TabsPane","tag":"div","classes":[],"children":[],"data":{"displayName":"","attr":{"data-w-tab":"Hide"},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"tag":"div","devlink":{"runtimeProps":{},"slot":""},"tabs":{"type":"pane"}}}],"styles":[{"_id":"e2324e2a-b829-05ca-4a67-0076f02ca027","fake":false,"type":"class","name":"Relative","namespace":"","comb":"","styleLess":"position: relative;","variants":{},"children":[],"selector":null},{"_id":"09a3d99e-ca57-5ee5-a9cc-55689975d369","fake":false,"type":"class","name":"🌟 Show/hide Code","namespace":"","comb":"","styleLess":"max-width: 300px; margin-right: auto; margin-left: auto;","variants":{},"children":[],"selector":null},{"_id":"2a9baea0-8d42-5c72-a778-fb6ab53135cf","fake":false,"type":"class","name":"Show Password Wrap","namespace":"","comb":"","styleLess":"position: absolute; left: auto; top: 7px; right: 0px; bottom: auto; z-index: 4;","variants":{},"children":[],"selector":null},{"_id":"2a9baea0-8d42-5c72-a778-fb6ab53135d0","fake":false,"type":"class","name":"Show Password","namespace":"","comb":"","styleLess":"bottom: 5px; display: flex; padding-top: 0px; padding-right: 7px; padding-bottom: 0px; padding-left: 6px; background-color: white; font-size: 13.5px;","variants":{"main_current":{"styleLess":"display: none;"}},"children":[],"selector":null},{"_id":"2a9baea0-8d42-5c72-a778-fb6ab53135d1","fake":false,"type":"class","name":"Eye SVG","namespace":"","comb":"","styleLess":"display: flex; width: 16px; margin-right: 4px; justify-content: center; align-items: center;","variants":{},"children":[],"selector":null},{"_id":"1973b4f7-c1d1-3bdb-4eda-4686353dd483","fake":false,"type":"class","name":"hide","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Klonen in Webflow
Kopieer component
{"type":"@webflow/XscpData","payload":{"nodes":[{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca241","type":"Block","tag":"div","classes":["e2324e2a-b829-05ca-4a67-0076f02ca027"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca242","edd8c65b-02db-acf2-0c78-be75a9aca244","edd8c65b-02db-acf2-0c78-be75a9aca245","edd8c65b-02db-acf2-0c78-be75a9aca246"],"data":{"search":{"exclude":false},"xattr":[],"text":false,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca242","type":"FormBlockLabel","tag":"label","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca243"],"data":{"form":{"type":"label","passwordPage":false},"search":{"exclude":false},"users":{"field":""},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"for":"Password","id":""},"visibility":{"conditions":[]}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca243","text":true,"v":"Password"},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca244","type":"FormTextInput","tag":"input","classes":[],"children":[],"data":{"displayName":"","attr":{"autofocus":false,"maxlength":256,"name":"Password","data-name":"Password","placeholder":"","type":"password","id":"Password","disabled":false,"required":true},"xattr":[{"name":"data-ms-member","value":"password"}],"search":{"exclude":false},"visibility":{"conditions":[]},"form":{"name":"Password","type":"input","passwordPage":false},"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca245","type":"HtmlEmbed","tag":"div","classes":["09a3d99e-ca57-5ee5-a9cc-55689975d369"],"children":[],"v":"<!-- 💙 MEMBERSCRIPT #45 v0.1 💙 Show/Hide Password -->\n<script>\n document.querySelector(\"[ms-code-password=transform]\").addEventListener(\"click\", transform);\n var isPassword = true;\n\n function transform() {\n var myInput = document.querySelector(\"[data-ms-member=password]\");\n var inputType = myInput.getAttribute(\"type\");\n\n if (isPassword) {\n myInput.setAttribute(\"type\", \"text\");\n } else {\n myInput.setAttribute(\"type\", \"password\");\n }\n\n isPassword = !isPassword;\n }\n</script>","data":{"insideRTE":false,"search":{"exclude":true},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<!-- 💙 MEMBERSCRIPT #45 v0.1 💙 Show/Hide Password -->\n<script>\n document.querySelector(\"[ms-code-password=transform]\").addEventListener(\"click\", transform);\n var isPassword = true;\n\n function transform() {\n var myInput = document.querySelector(\"[data-ms-member=password]\");\n var inputType = myInput.getAttribute(\"type\");\n\n if (isPassword) {\n myInput.setAttribute(\"type\", \"text\");\n } else {\n myInput.setAttribute(\"type\", \"password\");\n }\n\n isPassword = !isPassword;\n }\n</script>","div":false,"iframe":false,"script":true},"type":"html"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca246","type":"TabsWrapper","tag":"div","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135cf"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca247","edd8c65b-02db-acf2-0c78-be75a9aca250"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tabs":{"type":"wrapper","current":"Show","easing":"ease","fadeIn":300,"fadeOut":100}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca247","type":"TabsMenu","tag":"div","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca248","edd8c65b-02db-acf2-0c78-be75a9aca24c"],"data":{"search":{"exclude":false},"xattr":[{"name":"ms-code-password","value":"transform"}],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"transformButton"},"visibility":{"conditions":[]},"tag":"div","tabs":{"type":"menu"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca248","type":"TabsLink","tag":"a","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d0"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca249","edd8c65b-02db-acf2-0c78-be75a9aca24a"],"data":{"search":{"exclude":false},"xattr":[],"block":"inline","displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"","data-w-tab":"Show"},"visibility":{"conditions":[]},"tabs":{"type":"link"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca249","type":"HtmlEmbed","tag":"div","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d1"],"children":[],"v":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M12 6.5c2.76 0 5 2.24 5 5 0 .51-.1 1-.24 1.46l3.06 3.06c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l2.17 2.17c.47-.14.96-.24 1.47-.24zM2.71 3.16c-.39.39-.39 1.02 0 1.41l1.97 1.97C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.97-.3 4.31-.82l2.72 2.72c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L4.13 3.16c-.39-.39-1.03-.39-1.42 0zM12 16.5c-2.76 0-5-2.24-5-5 0-.77.18-1.5.49-2.14l1.57 1.57c-.03.18-.06.37-.06.57 0 1.66 1.34 3 3 3 .2 0 .38-.03.57-.07L14.14 16c-.65.32-1.37.5-2.14.5zm2.97-5.33c-.15-1.4-1.25-2.49-2.64-2.64l2.64 2.64z\"/></svg>","data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M12 6.5c2.76 0 5 2.24 5 5 0 .51-.1 1-.24 1.46l3.06 3.06c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l2.17 2.17c.47-.14.96-.24 1.47-.24zM2.71 3.16c-.39.39-.39 1.02 0 1.41l1.97 1.97C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.97-.3 4.31-.82l2.72 2.72c.39.39 1.02.39 1.41 0 .39-.39.39-1.02 0-1.41L4.13 3.16c-.39-.39-1.03-.39-1.42 0zM12 16.5c-2.76 0-5-2.24-5-5 0-.77.18-1.5.49-2.14l1.57 1.57c-.03.18-.06.37-.06.57 0 1.66 1.34 3 3 3 .2 0 .38-.03.57-.07L14.14 16c-.65.32-1.37.5-2.14.5zm2.97-5.33c-.15-1.4-1.25-2.49-2.64-2.64l2.64 2.64z\"/></svg>","div":false,"script":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24a","type":"Block","tag":"div","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca24b"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24b","text":true,"v":"Hide"},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24c","type":"TabsLink","tag":"a","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d0"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca24d","edd8c65b-02db-acf2-0c78-be75a9aca24e"],"data":{"search":{"exclude":false},"xattr":[],"block":"inline","displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":"","data-w-tab":"Hide"},"visibility":{"conditions":[]},"tabs":{"type":"link"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24d","type":"HtmlEmbed","tag":"div","classes":["2a9baea0-8d42-5c72-a778-fb6ab53135d1"],"children":[],"v":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z\"/></svg>","data":{"displayName":"","attr":{"id":""},"xattr":[],"search":{"exclude":true},"visibility":{"conditions":[]},"embed":{"meta":{"html":"<svg xmlns=\"http://www.w3.org/2000/svg\" enable-background=\"new 0 0 24 24\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"currentColor\">\n<rect fill=\"none\" height=\"24\" width=\"24\"/>\n\n<path d=\"M0 0h24v24H0V0z\" fill=\"none\"/><path d=\"M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z\"/></svg>","div":false,"script":false,"iframe":false},"type":"html"},"insideRTE":false,"devlink":{"runtimeProps":{},"slot":""}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24e","type":"Block","tag":"div","classes":[],"children":["edd8c65b-02db-acf2-0c78-be75a9aca24f"],"data":{"search":{"exclude":false},"xattr":[],"text":true,"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div"}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca24f","text":true,"v":"Show"},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca250","type":"TabsContent","tag":"div","classes":["1973b4f7-c1d1-3bdb-4eda-4686353dd483"],"children":["edd8c65b-02db-acf2-0c78-be75a9aca251","edd8c65b-02db-acf2-0c78-be75a9aca252"],"data":{"search":{"exclude":false},"xattr":[],"displayName":"","devlink":{"runtimeProps":{},"slot":""},"attr":{"id":""},"visibility":{"conditions":[]},"tag":"div","tabs":{"type":"content"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca251","type":"TabsPane","tag":"div","classes":[],"children":[],"data":{"displayName":"","attr":{"data-w-tab":"Show"},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"tag":"div","devlink":{"runtimeProps":{},"slot":""},"tabs":{"type":"pane"}}},{"_id":"edd8c65b-02db-acf2-0c78-be75a9aca252","type":"TabsPane","tag":"div","classes":[],"children":[],"data":{"displayName":"","attr":{"data-w-tab":"Hide"},"xattr":[],"search":{"exclude":false},"visibility":{"conditions":[]},"tag":"div","devlink":{"runtimeProps":{},"slot":""},"tabs":{"type":"pane"}}}],"styles":[{"_id":"e2324e2a-b829-05ca-4a67-0076f02ca027","fake":false,"type":"class","name":"Relative","namespace":"","comb":"","styleLess":"position: relative;","variants":{},"children":[],"selector":null},{"_id":"09a3d99e-ca57-5ee5-a9cc-55689975d369","fake":false,"type":"class","name":"🌟 Show/hide Code","namespace":"","comb":"","styleLess":"max-width: 300px; margin-right: auto; margin-left: auto;","variants":{},"children":[],"selector":null},{"_id":"2a9baea0-8d42-5c72-a778-fb6ab53135cf","fake":false,"type":"class","name":"Show Password Wrap","namespace":"","comb":"","styleLess":"position: absolute; left: auto; top: 7px; right: 0px; bottom: auto; z-index: 4;","variants":{},"children":[],"selector":null},{"_id":"2a9baea0-8d42-5c72-a778-fb6ab53135d0","fake":false,"type":"class","name":"Show Password","namespace":"","comb":"","styleLess":"bottom: 5px; display: flex; padding-top: 0px; padding-right: 7px; padding-bottom: 0px; padding-left: 6px; background-color: white; font-size: 13.5px;","variants":{"main_current":{"styleLess":"display: none;"}},"children":[],"selector":null},{"_id":"2a9baea0-8d42-5c72-a778-fb6ab53135d1","fake":false,"type":"class","name":"Eye SVG","namespace":"","comb":"","styleLess":"display: flex; width: 16px; margin-right: 4px; justify-content: center; align-items: center;","variants":{},"children":[],"selector":null},{"_id":"1973b4f7-c1d1-3bdb-4eda-4686353dd483","fake":false,"type":"class","name":"hide","namespace":"","comb":"","styleLess":"display: none;","variants":{},"children":[],"selector":null}],"assets":[],"ix1":[],"ix2":{"interactions":[],"events":[],"actionLists":[]}},"meta":{"unlinkedSymbolCount":0,"droppedLinks":0,"dynBindRemovedCount":0,"dynListBindRemovedCount":0,"paginationRemovedCount":0}}
Browser niet ondersteund. Gebruik
CC Chrome of SS Safari.

Over dit onderdeel

AI-gegenereerd

Beschrijving van onderdeel (gegenereerd door AI)

The Show/Hide Password Component allows users to toggle the visibility of their password input field, enhancing user experience and security during form submissions.

Belangrijkste kenmerken:

  • Toggle button to show/hide password
  • HTML and JavaScript implementation for easy integration
  • Responsive design suitable for various devices
  • Customizable styles for branding
  • User-friendly interface

Ontwerpelementen:

  • Clean and modern visual style
  • Use of icons for show/hide functionality
  • Positioned elements for intuitive interaction
  • Color scheme adaptable to fit different themes

Potentiële gebruikssituaties:

  • E-commerce websites requiring user account creation
  • Online banking platforms for secure login
  • Membership sites where user privacy is essential
  • Any web application with user authentication features

Conclusion: This component is a versatile and essential tool for any web application that requires secure password entry, improving both usability and security.

Bouwen

Begin met het bouwen van je dromen

Memberstack is 100% gratis totdat u klaar bent om te lanceren - dus waar wacht u nog op? Maak je eerste app en begin vandaag nog.