| <link rel="import" href="/shared_styles.html"> |
| <link rel="import" href="/user_manager_dialog.html"> |
| <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
| <link rel="import" href="chrome://resources/html/polymer.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout-classes.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-item/paper-item.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-listbox/paper-listbox.html"> |
| |
| <dom-module id="import-supervised-user"> |
| <template> |
| <style include="shared-styles iron-flex iron-flex-alignment iron-positioning"> |
| :host { |
| --item-height: 52px; |
| --items-container-max-height: calc(var(--item-height) * 4); |
| } |
| |
| #message { |
| margin-bottom: 16px; |
| margin-top: 20px; |
| white-space: pre-wrap; |
| word-wrap: break-word; |
| } |
| |
| paper-listbox { |
| max-height: var(--items-container-max-height); |
| overflow: auto; |
| } |
| |
| paper-listbox paper-item { |
| --paper-item: { |
| font-size: inherit; |
| height: var(--item-height); |
| line-height: inherit; |
| padding: 0 16px; |
| }; |
| --paper-item-disabled: { |
| color: inherit; |
| }; |
| --paper-item-focused: { |
| background: rgba(0, 0, 0, .04); |
| }; |
| --paper-item-focused-before: { |
| background: none; |
| }; |
| --paper-item-selected: { |
| background: rgba(0, 0, 0, .04); |
| font-weight: normal; |
| }; |
| } |
| |
| paper-listbox paper-item .profile-img { |
| flex-shrink: 0; |
| } |
| |
| paper-listbox paper-item .profile-name { |
| -webkit-margin-start: 10px; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| } |
| |
| paper-listbox paper-item .on-device { |
| -webkit-margin-start: 10px; |
| flex-shrink: 0; |
| } |
| </style> |
| <user-manager-dialog id="dialog"> |
| <div class="title">$i18n{supervisedUserImportTitle}</div> |
| <div class="body"> |
| <div id="message">[[getMessage_(supervisedUsers_)]]</div> |
| <paper-listbox class="no-padding" selected="{{supervisedUserIndex_}}"> |
| <template is="dom-repeat" items="[[supervisedUsers_]]"> |
| <paper-item disabled="[[item.onCurrentDevice]]"> |
| <img class="profile-img" src="[[item.iconURL]]"></img> |
| <div class="profile-name">[[item.name]]</div> |
| <div class="on-device" hidden="[[!item.onCurrentDevice]]"> |
| $i18n{supervisedUserAlreadyOnThisDevice} |
| </div> |
| </paper-item> |
| </template> |
| </paper-listbox> |
| </div> |
| <div class="footer horizontal end-justified layout"> |
| <paper-button id="cancel" class="action secondary" dialog-dismiss> |
| $i18n{cancel} |
| </paper-button> |
| <paper-button id="import" class="action primary" |
| on-tap="onImportTap_" |
| disabled="[[isImportDisabled_(supervisedUserIndex_)]]"> |
| $i18n{supervisedUserImportOk} |
| </paper-button> |
| </div> |
| </user-manager-dialog> |
| </template> |
| <script src="import_supervised_user.js"></script> |
| </dom-module> |