diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8f0535da..7a2de1f6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -12,6 +12,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Deprecated
### Removed
### Fixed
+
+- Small size difference between show/hide password button width in text input
+
### Security
## [0.7.0](https://github.com/nationalarchives/tna-frontend/compare/v0.6.0...v0.7.0) - 2025-01-13
diff --git a/package.json b/package.json
index c26b86ae..72d08d40 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
"build:package": "./tasks/build-package.sh",
"compile:sass": "sass --style=compressed --embed-sources src/nationalarchives:package/nationalarchives",
"compile:scripts": "webpack",
- "lint:fix": "prettier --write '{src,.storybook,tasks,.}/**/*.{js,mjs,scss,json,html}' && stylelint --fix 'src/**/*.scss' && eslint --fix 'src/**/*.{js,mjs}'",
+ "lint:fix": "prettier --write '{src,.storybook,tasks,.}/**/*.{js,mjs,scss,json,html}' && stylelint --fix 'lax' 'src/**/*.scss' && eslint --fix 'src/**/*.{js,mjs}'",
"test:all": "npm run test:lint && npm run test:unit && npm run test:html && npm run test:fixtures && npm run test:storybook && npm run build:package && npm run test:package",
"test:fixtures": "node tasks/test-fixtures.js",
"test:html": "node tasks/generate-fixture-html.js && html-validate fixtures-html",
diff --git a/src/nationalarchives/components/text-input/text-input.mjs b/src/nationalarchives/components/text-input/text-input.mjs
index 10542418..8a1a05d1 100644
--- a/src/nationalarchives/components/text-input/text-input.mjs
+++ b/src/nationalarchives/components/text-input/text-input.mjs
@@ -42,11 +42,11 @@ export class TextInput {
updateTogglePasswordButtonText() {
if (this.$input.getAttribute("type") === "password") {
- this.$textInputPasswordToggle.innerHTML = `Show password`;
+ this.$textInputPasswordToggle.innerHTML = `Show password`;
this.$textInputPasswordToggle.setAttribute("title", "Show password");
this.$textInputPasswordToggle.setAttribute("aria-title", "Show password");
} else {
- this.$textInputPasswordToggle.innerHTML = `Hide password`;
+ this.$textInputPasswordToggle.innerHTML = `Hide password`;
this.$textInputPasswordToggle.setAttribute("title", "Hide password");
this.$textInputPasswordToggle.setAttribute("aria-title", "Hide password");
}
diff --git a/src/nationalarchives/components/text-input/text-input.scss b/src/nationalarchives/components/text-input/text-input.scss
index 68b509d5..0429d4ec 100644
--- a/src/nationalarchives/components/text-input/text-input.scss
+++ b/src/nationalarchives/components/text-input/text-input.scss
@@ -57,6 +57,7 @@
white-space: nowrap;
svg {
+ width: 20px;
margin-top: 0;
margin-bottom: 0;
}