vue-password-strength-meter icon indicating copy to clipboard operation
vue-password-strength-meter copied to clipboard
verified publisher icon apertureless

Toggle icon blocks LastPass auto-fill icon

Open jacobg opened this issue 5 years ago • 2 comments

Expected Behavior

Should be able to auto-fill password by clicking on LastPass icon at right side of input box. This refers to the LastPass's Chrome extension.

Actual Behavior

Toggle icon displays over the LastPass icon, and is not clickable. There probably needs to be more right margin added to move the toggle icon to the left. Any other icon options used by vue-password-strength-meter should also be moved further to the left.

Screen Shot 2020-11-05 at 3 15 31 PM

Environment

  • OS: Mac/Windows
  • NPM version: 6.14.8
  • vue.js version: 2.6.11
  • vue-password-strength-meter version: 1.7.1

jacobg avatar Nov 05 '20 20:11 jacobg

Here's a clever way to fix this, courtesy of the big G: https://core.trac.wordpress.org/timeline?from=2019-10-06T11%3A10%3A40Z&precision=second

Google makes the input look like it ends beyond the icon, but that's a visual trick. The input field is shorter and (in this repo's case) .Password__icons sits outside the input field, not on top of it via position: absolute.

This might be a good idea, since it would ensure that both the character counter and the toggle icon would be safe from anything being inserted into (or on top of) the input field by password managers, browser or third-party.

andreipopovici avatar Dec 30 '20 18:12 andreipopovici

That link seems to be broken, but the gist of it is reproduced in this Codepen: https://codepen.io/skttl/pen/NzxMVV

andreipopovici avatar Dec 30 '20 19:12 andreipopovici