Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(533)

Side by Side Diff: chrome/browser/resources/settings/internet_page/internet_subpage.html

Issue 2752223003: MD Settings: Fix Network section styling (Closed)
Patch Set: Rebase Created 3 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
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
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
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>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698