OLD | NEW |
1 <link rel="import" href="chrome://resources/html/polymer.html"> | 1 <link rel="import" href="chrome://resources/html/polymer.html"> |
2 <link rel="import" href="chrome://resources/cr_elements/icons.html"> | 2 <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> | 3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> |
| 4 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
4 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html"> | 5 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html"> |
5 <link rel="import" href="../i18n_setup.html"> | 6 <link rel="import" href="../i18n_setup.html"> |
6 <link rel="import" href="../settings_shared_css.html"> | 7 <link rel="import" href="../settings_shared_css.html"> |
7 <link rel="import" href="site_settings_behavior.html"> | 8 <link rel="import" href="site_settings_behavior.html"> |
8 <link rel="import" href="site_settings_prefs_browser_proxy.html"> | 9 <link rel="import" href="site_settings_prefs_browser_proxy.html"> |
9 | 10 |
10 <dom-module id="zoom-levels"> | 11 <dom-module id="zoom-levels"> |
11 <template> | 12 <template> |
12 <style include="settings-shared"> | 13 <style include="settings-shared"> |
13 :host { | 14 :host { |
14 display: block; | 15 display: block; |
15 } | 16 } |
16 | 17 |
| 18 /** |
| 19 * When per-origin zooming is disabled, we change the opacity of any |
| 20 * existing zoom level entries to indicate that they are not being used. |
| 21 * In order to indicate that the buttons can still be used to clear the |
| 22 * entries, we do not change the opacity of the buttons. |
| 23 */ |
| 24 #listContainer[disabled] .favicon-image, |
| 25 #listContainer[disabled] .middle, |
| 26 #listContainer[disabled] .zoom-label { |
| 27 opacity: var(--settings-disabled-opacity); |
| 28 } |
| 29 |
17 .zoom-label { | 30 .zoom-label { |
18 -webkit-margin-end: 16px; | 31 -webkit-margin-end: 16px; |
19 } | 32 } |
20 | 33 |
21 .empty-message { | 34 .empty-message { |
22 margin-top: 15px; | 35 margin-top: 15px; |
23 } | 36 } |
24 </style> | 37 </style> |
25 <div class="list-frame vertical-list" id="listContainer"> | 38 <div class="settings-box first two-line"> |
| 39 <div class="start secondary"> |
| 40 [[getScopeLabel_(zoomScopeIsPerOrigin_)]] |
| 41 </div> |
| 42 <paper-toggle-button id="toggle" checked="{{zoomScopeIsPerOrigin_}}" |
| 43 on-change="toggleZoomScope_" disabled$="[[isGuest_]]"> |
| 44 </paper-toggle-button> |
| 45 </div> |
| 46 <div class="list-frame vertical-list" id="listContainer" |
| 47 disabled$="[[!zoomScopeIsPerOrigin_]]"> |
26 <template is="dom-repeat" items="[[sites_]]" id="list" | 48 <template is="dom-repeat" items="[[sites_]]" id="list" |
27 rendered-item-count="{{renderedCount}}"> | 49 rendered-item-count="{{renderedCount}}"> |
28 <div class="list-item"> | 50 <div class="list-item"> |
29 <div class="favicon-image" | 51 <div class="favicon-image" |
30 style$="[[computeSiteIcon(item.originForFavicon)]]"> | 52 style$="[[computeSiteIcon(item.originForFavicon)]]"> |
31 </div> | 53 </div> |
32 <div class="middle"> | 54 <div class="middle"> |
33 <div>[[item.displayName]]</div> | 55 <div>[[item.displayName]]</div> |
34 </div> | 56 </div> |
35 <div class="zoom-label">[[item.zoom]]</div> | 57 <div class="zoom-label">[[item.zoom]]</div> |
36 <div> | 58 <div> |
37 <paper-icon-button icon="cr:clear" | 59 <paper-icon-button icon="cr:clear" |
38 on-tap="removeZoomLevel_"> | 60 on-tap="removeZoomLevel_"> |
39 </div> | 61 </div> |
40 </div> | 62 </div> |
41 </template> | 63 </template> |
42 <template is="dom-if" if="{{!renderedCount}}"> | 64 <template is="dom-if" |
| 65 if="{{showNoZoomedSites_(renderedCount, zoomScopeIsPerOrigin_)}}"> |
43 <div class="empty-message" id="empty"> | 66 <div class="empty-message" id="empty"> |
44 $i18n{siteSettingsNoZoomedSites} | 67 $i18n{siteSettingsNoZoomedSites} |
45 </div> | 68 </div> |
46 </template> | 69 </template> |
47 </div> | 70 </div> |
48 </template> | 71 </template> |
49 <script src="zoom_levels.js"></script> | 72 <script src="zoom_levels.js"></script> |
50 </dom-module> | 73 </dom-module> |
OLD | NEW |