| <link rel="import" href="chrome://resources/html/polymer.html"> |
| |
| <link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html"> |
| <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
| <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html"> |
| <link rel="import" href="../settings_shared_css.html"> |
| |
| <dom-module id="bluetooth-device-list-item"> |
| <template> |
| <style include="settings-shared"> |
| .name[connected] { |
| font-weight: 500; |
| } |
| |
| .state[connected] { |
| color: var(--google-green-500); |
| } |
| </style> |
| <div class="list-item"> |
| <iron-icon id="deviceIcon" icon="[[getDeviceIcon_(device)]]"> |
| </iron-icon> |
| <div class="middle"> |
| <div class="name" connected$="[[device.connected]]"> |
| [[getDeviceName_(device)]] |
| </div> |
| <div class="state secondary" connected$="[[device.connected]]" |
| hidden$="[[!hasConnectionStatusText_(device)]]"> |
| [[getConnectionStatusText_(device)]] |
| </div> |
| </div> |
| <span hidden$="[[!device.connecting]]">$i18n{bluetoothConnecting}</span> |
| <div hidden$="[[!device.paired]]"> |
| <paper-icon-button-light class="icon-more-vert"> |
| <button on-click="onMenuButtonTap_" tabindex$="[[tabindex]]" |
| title="$i18n{moreActions}" on-keydown="ignoreEnterKey_"> |
| </button> |
| </paper-icon-button-light> |
| <cr-action-menu id="dotsMenu"> |
| <button slot="item" class="dropdown-item" |
| on-click="onConnectActionTap_"> |
| [[getConnectActionText_(device.connected)]] |
| </button> |
| <button slot="item" class="dropdown-item" on-click="onRemoveTap_"> |
| $i18n{bluetoothRemove} |
| </button> |
| </cr-action-menu> |
| </div> |
| </div> |
| </template> |
| <script src="bluetooth_device_list_item.js"></script> |
| </dom-module> |