| <link rel="import" href="chrome://resources/html/polymer.html"> |
| |
| <link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_input/cr_input.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_icons_css.html"> |
| <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html"> |
| <link rel="import" href="../icons.html"> |
| <link rel="import" href="../settings_shared_css.html"> |
| <link rel="import" href="../settings_vars_css.html"> |
| <link rel="import" href="show_password_behavior.html"> |
| |
| <dom-module id="password-edit-dialog"> |
| <template> |
| <style include="settings-shared"> |
| cr-input { |
| --cr-input-error-display: none; |
| } |
| |
| cr-input:not(:last-of-type) { |
| margin-bottom: var(--cr-form-field-bottom-spacing); |
| } |
| |
| #websiteInput, |
| #usernameInput { |
| width: var(--settings-input-max-width); |
| } |
| |
| #passwordInput { |
| --cr-input-width: var(--settings-input-max-width); |
| --cr-input-row-container: { |
| justify-content: initial; |
| } |
| } |
| |
| paper-icon-button-light { |
| -webkit-margin-start: 2px; |
| background-size: 24px; /* Other buttons are sized by --cr-icon-size. */ |
| } |
| </style> |
| <cr-dialog id="dialog" close-text="$i18n{close}"> |
| <div slot="title">$i18n{passwordDetailsTitle}</div> |
| <div slot="body"> |
| <cr-input id="websiteInput" label="$i18n{editPasswordWebsiteLabel}" |
| value="[[item.entry.loginPair.urls.link]]" readonly |
| on-focus="onInputFocus_" on-blur="onInputBlur_"> |
| </cr-input> |
| <cr-input id="usernameInput" label="$i18n{editPasswordUsernameLabel}" |
| value="[[item.entry.loginPair.username]]" readonly |
| on-focus="onInputFocus_" on-blur="onInputBlur_"> |
| </cr-input> |
| <cr-input id="passwordInput" readonly |
| label="$i18n{editPasswordPasswordLabel}" |
| type="[[getPasswordInputType_(item.password)]]" |
| value="[[getPassword_(item.password)]]" |
| on-focus="onInputFocus_" on-blur="onInputBlur_"> |
| <paper-icon-button-light id="showPasswordButtonContainer" |
| class$="[[getIconClass_(item.password)]]" slot="suffix" |
| hidden$="[[item.entry.federationText]]"> |
| <button id="showPasswordButton" |
| on-click="onShowPasswordButtonTap_" |
| title="[[showPasswordTitle_(item.password, |
| '$i18nPolymer{hidePassword}', |
| '$i18nPolymer{showPassword}')]]"> |
| </button> |
| </paper-icon-button-light> |
| </cr-input> |
| </div> |
| <div slot="button-container"> |
| <paper-button class="action-button" on-click="onActionButtonTap_"> |
| $i18n{done} |
| </paper-button> |
| </div> |
| </cr-dialog> |
| </template> |
| <script src="password_edit_dialog.js"></script> |
| </dom-module> |
