chromium/chrome/browser/resources/password_manager/dialogs/edit_password_dialog.html

<style include="shared-style cr-shared-style">
  cr-input:not(:first-of-type) {
    margin-top: var(--cr-form-field-bottom-spacing);
  }

  cr-icon-button {
    --cr-icon-button-icon-size: 16px;
    --cr-icon-button-size: 32px;
    --cr-icon-button-margin-start: 0;
    --cr-icon-button-margin-end: 0;
  }

  cr-input {
    --cr-input-error-display: none;
  }

  cr-textarea {
    --cr-textarea-footer-display: flex;
    /* The approximation is based on the other elements in the dialog. This
        value should be updated if new rows are added to the dialog. */
    --cr-textarea-autogrow-max-height: 20lh;
  }

  #usernameInput[invalid] {
    --cr-input-error-display: block;
  }

  #usernameInput,
  #passwordNote {
    margin-top: var(--cr-form-field-bottom-spacing);
  }

  #viewExistingPasswordLink {
    color: var(--cr-link-color);
    display: block;
    font-size: var(--cr-form-field-label-font-size);
    line-height: 1;
    width: fit-content;
  }

  #footnote {
    margin-inline-start: 2px;
    margin-top: 16px;
  }
</style>
<cr-dialog id="dialog" show-on-attach>
  <div slot="title" id="title" class="dialog-title">
    $i18n{editPasswordTitle}
  </div>
  <div slot="body">
    <div class="cr-form-field-label">$i18n{sitesLabel}</div>
    <template id="links" is="dom-repeat"
        items="[[credential.affiliatedDomains]]">
      <div class="elide-left">
        <a href="[[item.url]]" class="site-link" target="_blank">
          [[item.name]]
        </a>
      </div>
    </template>
    <cr-input id="usernameInput" label="$i18n{usernameLabel}" autofocus
        value="{{username_}}" error-message="[[usernameErrorMessage_]]"
        invalid="[[doesUsernameExistAlready_(usernameErrorMessage_)]]"
        spellcheck="false">
    </cr-input>
    <a id="viewExistingPasswordLink" is="action-link" href="/"
        on-click="onViewExistingPasswordClick_"
        aria-description="[[getViewExistingPasswordAriaDescription_(
          conflictingUsernames_, username_)]]"
        hidden="[[!showRedirect_(showRedirect, usernameErrorMessage_)]]">
      $i18n{viewExistingPassword}
    </a>
    <cr-input id="passwordInput" label="$i18n{passwordLabel}" required
        type="[[getPasswordInputType(isPasswordVisible)]]"
        value="{{password_}}" invalid="[[!password_.length]]"
        class="password-input" spellcheck="false">
      <cr-icon-button id="showPasswordButton" slot="inline-suffix"
          class$="[[getShowHideButtonIconClass(isPasswordVisible)]]"
          title="[[getShowHideButtonLabel(isPasswordVisible)]]"
          on-click="onShowHidePasswordButtonClick">
      </cr-icon-button>
    </cr-input>
    <div id="footnote">
      [[getFootnote_(credential)]]
    </div>
    <cr-textarea id="passwordNote" label="$i18n{noteLabel}" value="{{note_}}"
        invalid="[[isNoteInputInvalid_(note_)]]" has-max-height autogrow
        first-footer="[[getFirstNoteFooter_(note_)]]"
        second-footer="[[getSecondNoteFooter_(note_)]]">
    </cr-textarea>
  </div>
  <div slot="button-container">
    <cr-button id="cancelButton" class="cancel-button" on-click="onCancel_">
      $i18n{cancel}
    </cr-button>
    <cr-button id="saveButton" class="action-button"
        disabled="[[!canEditPassword_]]" on-click="onEditClick_">
      $i18n{save}
    </cr-button>
  </div>
</cr-dialog>