| <link rel="import" href="chrome://resources/html/polymer.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html"> |
| <link rel="import" href="settings_boolean_control_behavior.html"> |
| <link rel="import" href="../settings_shared_css.html"> |
| |
| <dom-module id="settings-toggle-button"> |
| <template> |
| <style include="settings-shared"> |
| :host([elide-label]), |
| :host([elide-label]) #outerRow, |
| :host([elide-label]) #outerRow > div.flex { |
| min-width: 0; |
| } |
| |
| :host([elide-label]) .label { |
| @apply(--settings-text-elide); |
| } |
| |
| #outerRow { |
| align-items: center; |
| display: flex; |
| min-height: var(--settings-row-two-line-min-height); |
| width: 100%; |
| } |
| |
| #outerRow[noSubLabel] { |
| min-height: var(--settings-row-min-height); |
| } |
| |
| paper-toggle-button, |
| cr-policy-pref-indicator { |
| -webkit-margin-start: var(--checkbox-spacing); |
| } |
| |
| ::content .more-actions { |
| -webkit-margin-end: 10px; |
| } |
| </style> |
| <div id="outerRow" noSubLabel$="[[!subLabel]]"> |
| <div class="flex" on-tap="onLabelWrapperTap_" |
| actionable$="[[!controlDisabled_(disabled, pref)]]"> |
| <div class="label"> |
| [[label]] |
| </div> |
| <div class="secondary label">[[subLabel]]</div> |
| </div> |
| <content select=".more-actions"></content> |
| <template is="dom-if" if="[[pref.controlledBy]]"> |
| <cr-policy-pref-indicator pref="[[pref]]"></cr-policy-pref-indicator> |
| </template> |
| <paper-toggle-button id="control" checked="{{checked}}" |
| disabled="[[controlDisabled_(disabled, pref)]]"> |
| </paper-toggle-button> |
| </div> |
| </template> |
| <script src="settings_toggle_button.js"></script> |
| </dom-module> |
