Replaced old TextField component with new TextField component on unlock page

[subhajit20]

Explanation

Replaced old TextField component with new TextField component on unlock page
Issue - #20483

Screenshots/Screencaps

Before

After

Before

After

Manual Testing Steps

Pre-merge author checklist

• I've clearly explained:
  • What problem this PR is solving
  • How this problem was solved
  • How reviewers can test my changes
• Sufficient automated test coverage has been added

Pre-merge reviewer checklist

• Manual testing (e.g. pull and build branch, run in browser, test code being changed)
• PR is linked to the appropriate GitHub issue
• IF this PR fixes a bug in the release milestone, add this PR to the release milestone

If further QA is required (e.g. new feature, complex testing steps, large refactor), add the Extension QA Board label.

In this case, a QA Engineer approval will be be required.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[subhajit20]

@georgewrmarshall Hey can you check and let me know for further correction?
Then will do the rest of the changes.

[subhajit20]

Hey @georgewrmarshall , is that above-mentioned TextField component relevant?

[georgewrmarshall]

Hey @subhajit20, this page is rather sensitive to changes. Especially any visual updates so although we do eventually want to update this lock screen with component library components I think it would involve some planning with marketing to let our users know. We don't have the resources right now to do this so for that reason I am going to close this PR