blob: bf4c4cddf658c957081586bd6ef3d9a49f7b80fa [file] [log] [blame]
<style include="settings-shared passwords-shared">
cr-input:not(:last-of-type) {
margin-bottom: var(--cr-form-field-bottom-spacing);
}
cr-icon-button {
--cr-icon-button-icon-size: 16px;
margin-inline-start: 2px;
}
#footnote {
margin-inline-start: 2px;
margin-top: 16px;
}
cr-input {
--cr-input-error-display: none;
}
#usernameInput[invalid] {
--cr-input-error-display: block;
}
</style>
<cr-dialog id="dialog" close-text="$i18n{close}">
<div slot="title" id="title">[[getTitle_(isEditDialog_)]]</div>
<div slot="body">
<div hidden="[[!shouldShowStorageDetails]]" id="storageDetails">
[[getStorageDetailsMessage_()]]
</div>
<cr-input id="websiteInput" label="$i18n{editPasswordWebsiteLabel}"
value="[[entry.urls.link]]" on-blur="onInputBlur_" readonly>
</cr-input>
<cr-input id="usernameInput" label="$i18n{editPasswordUsernameLabel}"
readonly="[[!isEditDialog_]]" invalid="[[usernameInputInvalid_]]"
on-value-changed="validateUsername_" value="[[entry.username]]"
error-message="$i18n{usernameAlreadyUsed}">
</cr-input>
<cr-input id="passwordInput" label="$i18n{editPasswordPasswordLabel}"
type="[[getPasswordInputType_(isPasswordVisible_, entry.password)]]"
value="[[getPassword_(entry.password)]]" class="password-input"
readonly="[[!isEditDialog_]]" invalid="{{passwordInputInvalid_}}"
required="[[isEditDialog_]]" auto-validate="[[isEditDialog_]]">
<cr-icon-button id="showPasswordButton"
class$="[[getIconClass_(isPasswordVisible_, entry.password)]]"
slot="suffix" hidden$="[[entry.federationText]]"
on-click="onShowPasswordButtonTap_"
title="[[showPasswordTitle_(entry.password, isPasswordVisible_,
'$i18nPolymer{hidePassword}',
'$i18nPolymer{showPassword}')]]">
</cr-icon-button>
</cr-input>
<div id="footnote" hidden="[[!isEditDialog_]]">
[[getFootnote_()]]
</div>
</div>
<div slot="button-container">
<cr-button id="cancel" class="cancel-button" on-click="onCancel_"
hidden="[[!isEditDialog_]]">
$i18n{cancel}
</cr-button>
<cr-button id="actionButton" class="action-button"
on-click="onActionButtonTap_" disabled="[[isSaveButtonDisabled_]]">
[[getActionButtonName_(isEditDialog_)]]
</cr-button>
</div>
</cr-dialog>