| <style include="shared-style cr-shared-style iron-flex"> |
| #header { |
| align-items: center; |
| display: flex; |
| } |
| |
| a[href] { |
| color: var(--cr-link-color); |
| text-decoration: none; |
| } |
| |
| #passwords { |
| margin-top: 20px; |
| } |
| </style> |
| <div id="header"> |
| <h2 class="flex page-title">$i18n{passwords}</h2> |
| <cr-button id="addPasswordButton" on-click="onAddPasswordClick_" |
| title="$i18n{addPasswordTitle}"> |
| $i18n{addPassword} |
| </cr-button> |
| </div> |
| <div class="cr-secondary-text" |
| inner-h-t-m-l="[[i18nAdvanced('passwordsSectionDescription')]]"> |
| </div> |
| <div class="card" id="passwords" |
| hidden$="[[hideGroupsList_(groups_, searchTerm_)]]"> |
| <template id="passwordsList" is="dom-repeat" initial-count="50" |
| items="[[groups_]]" filter="[[groupFilter_(searchTerm_)]]" |
| rendered-item-count="{{shownGroupsCount_::dom-change}}"> |
| <password-list-item item="[[item]]" first="[[!index]]" |
| search-term="[[searchTerm_]]"> |
| </password-list-item> |
| </template> |
| </div> |
| <template is="dom-if" if="[[showAddPasswordDialog_]]" restamp> |
| <add-password-dialog on-close="onAddPasswordDialogClosed_" |
| id="addPasswordDialog"> |
| </add-password-dialog> |
| </template> |
