diff --git a/src/components/text-input/index.md b/src/components/text-input/index.md index 115ec12..75be1ab 100644 --- a/src/components/text-input/index.md +++ b/src/components/text-input/index.md @@ -27,3 +27,9 @@ group: components ## Inline {{ example({ group: "components", item: "text-input", example: "inline", html: true, nunjucks: true, size: "xxs" }) }} + +## Password + +The password text input is enhanced with JavaScript to allow the hiding and showing of the password. + +{{ example({ group: "components", item: "text-input", example: "password", html: true, nunjucks: true, size: "xs" }) }} diff --git a/src/components/text-input/password/index.njk b/src/components/text-input/password/index.njk new file mode 100644 index 0000000..5b8cf71 --- /dev/null +++ b/src/components/text-input/password/index.njk @@ -0,0 +1,16 @@ +--- +title: Text input - password +layout: examples/plain.njk +private: true +--- + +{% from "nationalarchives/components/text-input/macro.njk" import tnaTextInput %} + +{{ tnaTextInput({ + label: "Enter your password", + headingLevel: 4, + headingSize: "m", + id: "password", + name: "password", + password: true +}) }}