| OLD | NEW |
| 1 <link rel="import" href="chrome://resources/cr_elements/network/cr_network_list.
html"> | 1 <link rel="import" href="chrome://resources/cr_elements/network/cr_network_list.
html"> |
| 2 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> | 2 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
| 3 <link rel="import" href="chrome://resources/html/polymer.html"> | 3 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 4 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/classe
s/iron-flex-layout.html"> | 4 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/classe
s/iron-flex-layout.html"> |
| 5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> | 5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> |
| 6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button-light.html"> | 6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button-light.html"> |
| 7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/pap
er-toggle-button.html"> | 7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/pap
er-toggle-button.html"> |
| 8 <link rel="import" href="../settings_shared_css.html"> | 8 <link rel="import" href="../settings_shared_css.html"> |
| 9 | 9 |
| 10 <dom-module id="settings-internet-subpage"> | 10 <dom-module id="settings-internet-subpage"> |
| 11 <template> | 11 <template> |
| 12 <style include="settings-shared"> | 12 <style include="settings-shared"> |
| 13 #networkListDiv { | 13 #networkListDiv { |
| 14 /* cr-network-list is padded to the right to allow space for a ripple */ | 14 /* cr-network-list is padded to the right to allow space for a ripple */ |
| 15 -webkit-padding-end: calc(var(--settings-box-row-padding) - | 15 -webkit-padding-end: calc(var(--settings-box-row-padding) - |
| 16 var(--cr-icon-ripple-padding)); | 16 var(--cr-icon-ripple-padding)); |
| 17 -webkit-padding-start: var(--settings-box-row-padding); | 17 -webkit-padding-start: var(--settings-box-row-padding); |
| 18 margin-top: var(--settings-page-vertical-margin); | 18 margin-top: var(--settings-page-vertical-margin); |
| 19 min-height: var(--settings-box-min-height); | 19 min-height: var(--settings-box-min-height); |
| 20 } | 20 } |
| 21 | 21 |
| 22 #addButton { | 22 #addButton { |
| 23 -webkit-margin-end: var(--settings-control-spacing); | 23 -webkit-margin-end: var(--settings-control-spacing); |
| 24 } | 24 } |
| 25 | 25 |
| 26 #onoff[on] { | 26 #onoff[on] { |
| 27 color: var(--settings-toggle-color); | 27 color: var(--settings-toggle-color); |
| 28 font-weight: 500; |
| 28 } | 29 } |
| 29 | 30 |
| 30 .vpn-header { | 31 .vpn-header { |
| 31 -webkit-margin-end: 12px; | 32 -webkit-margin-end: 12px; |
| 32 -webkit-margin-start: 4px; | 33 -webkit-margin-start: 4px; |
| 33 margin-bottom: 8px; | 34 margin-bottom: 8px; |
| 34 margin-top: 8px; | 35 margin-top: 8px; |
| 35 } | 36 } |
| 36 | 37 |
| 37 .no-networks { | 38 .no-networks { |
| (...skipping 16 matching lines...) Expand all Loading... |
| 54 <paper-toggle-button id="deviceEnabledButton" | 55 <paper-toggle-button id="deviceEnabledButton" |
| 55 aria-label="[[getToggleA11yString_(deviceState)]]" | 56 aria-label="[[getToggleA11yString_(deviceState)]]" |
| 56 checked="[[deviceIsEnabled_(deviceState)]]" | 57 checked="[[deviceIsEnabled_(deviceState)]]" |
| 57 enabled="[[enableToggleIsEnabled_(deviceState)]]" | 58 enabled="[[enableToggleIsEnabled_(deviceState)]]" |
| 58 on-tap="onDeviceEnabledTap_"> | 59 on-tap="onDeviceEnabledTap_"> |
| 59 </paper-toggle-button> | 60 </paper-toggle-button> |
| 60 </div> | 61 </div> |
| 61 </template> | 62 </template> |
| 62 | 63 |
| 63 <template is="dom-if" if="[[knownNetworksIsVisible_(deviceState)]]"> | 64 <template is="dom-if" if="[[knownNetworksIsVisible_(deviceState)]]"> |
| 64 <div actionable class="settings-box continuation" | 65 <div actionable class="settings-box" on-tap="onKnownNetworksTap_"> |
| 65 on-tap="onKnownNetworksTap_"> | |
| 66 <div class="start">$i18n{knownNetworksButton}</div> | 66 <div class="start">$i18n{knownNetworksButton}</div> |
| 67 <button class="subpage-arrow" is="paper-icon-button-light" | 67 <button class="subpage-arrow" is="paper-icon-button-light" |
| 68 aria-label="$i18n{knownNetworksButton}"> | 68 aria-label="$i18n{knownNetworksButton}"> |
| 69 </button> | 69 </button> |
| 70 </div> | 70 </div> |
| 71 </template> | 71 </template> |
| 72 | 72 |
| 73 <template is="dom-if" if="[[deviceIsEnabled_(deviceState)]]"> | 73 <template is="dom-if" if="[[deviceIsEnabled_(deviceState)]]"> |
| 74 <div id="networkListDiv" class="layout vertical flex"> | 74 <div id="networkListDiv" class="layout vertical flex"> |
| 75 <!-- VPN only header for built-in VPNs. --> | 75 <!-- VPN only header for built-in VPNs. --> |
| (...skipping 10 matching lines...) Expand all Loading... |
| 86 <cr-network-list id="networkList" class="flex" show-buttons | 86 <cr-network-list id="networkList" class="flex" show-buttons |
| 87 hidden$="[[!networkStateList_.length]]" | 87 hidden$="[[!networkStateList_.length]]" |
| 88 networks="[[networkStateList_]]" | 88 networks="[[networkStateList_]]" |
| 89 on-selected="onNetworkSelected_"> | 89 on-selected="onNetworkSelected_"> |
| 90 </cr-network-list> | 90 </cr-network-list> |
| 91 <div hidden$="[[networkStateList_.length]]" class="no-networks"> | 91 <div hidden$="[[networkStateList_.length]]" class="no-networks"> |
| 92 $i18n{internetNoNetworks} | 92 $i18n{internetNoNetworks} |
| 93 </div> | 93 </div> |
| 94 | 94 |
| 95 <!-- Third party VPNs. --> | 95 <!-- Third party VPNs. --> |
| 96 <template is="dom-if" if="isEqual_('VPN', deviceState.Type)]]"> | 96 <template is="dom-if" if="[[isEqual_('VPN', deviceState.Type)]]"> |
| 97 <template is="dom-repeat" items="[[thirdPartyVpnProviders]]"> | 97 <template is="dom-repeat" items="[[thirdPartyVpnProviders]]"> |
| 98 <div id="[[item.ProviderName]]" | 98 <div id="[[item.ProviderName]]" |
| 99 class="vpn-header layout horizontal center"> | 99 class="vpn-header layout horizontal center"> |
| 100 <div class="flex">[[item.ProviderName]]</div> | 100 <div class="flex">[[item.ProviderName]]</div> |
| 101 <paper-icon-button icon="settings:add-circle" | 101 <paper-icon-button icon="settings:add-circle" |
| 102 aria-label="[[getAddThirdPartyVpnA11yString_(item)]]" | 102 aria-label="[[getAddThirdPartyVpnA11yString_(item)]]" |
| 103 on-tap="onAddThirdPartyVpnTap_" tabindex$="[[tabindex]]"> | 103 on-tap="onAddThirdPartyVpnTap_" tabindex$="[[tabindex]]"> |
| 104 </paper-icon-button> | 104 </paper-icon-button> |
| 105 </div> | 105 </div> |
| 106 <cr-network-list class="flex" show-buttons | 106 <cr-network-list class="flex" show-buttons |
| 107 hidden$="[[!haveThirdPartyVpnNetwork_(thirdPartyVpns_, item)]]" | 107 hidden$="[[!haveThirdPartyVpnNetwork_(thirdPartyVpns_, item)]]" |
| 108 networks="[[getThirdPartyVpnNetworks_(thirdPartyVpns_, item)]]" | 108 networks="[[getThirdPartyVpnNetworks_(thirdPartyVpns_, item)]]" |
| 109 on-selected="onNetworkSelected_"> | 109 on-selected="onNetworkSelected_"> |
| 110 </cr-network-list> | 110 </cr-network-list> |
| 111 <div hidden$="[[haveThirdPartyVpnNetwork_(thirdPartyVpns_, item)]]" | 111 <div hidden$="[[haveThirdPartyVpnNetwork_(thirdPartyVpns_, item)]]" |
| 112 class="no-networks"> | 112 class="no-networks"> |
| 113 $i18n{internetNoNetworks} | 113 $i18n{internetNoNetworks} |
| 114 </div> | 114 </div> |
| 115 </template> | 115 </template> |
| 116 </template> | 116 </template> |
| 117 </div> | 117 </div> |
| 118 | 118 |
| 119 </template> | 119 </template> |
| 120 | 120 |
| 121 </template> | 121 </template> |
| 122 <script src="internet_subpage.js"></script> | 122 <script src="internet_subpage.js"></script> |
| 123 </dom-module> | 123 </dom-module> |
| OLD | NEW |