OLD | NEW |
1 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> | 1 <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
2 <link rel="import" href="chrome://resources/html/polymer.html"> | 2 <link rel="import" href="chrome://resources/html/polymer.html"> |
3 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/classe
s/iron-flex-layout.html"> | 3 <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/paper-button/paper-butt
on.html"> | 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-butt
on.html"> |
5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-ch
eckbox.html"> | 5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-ch
eckbox.html"> |
6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dropdown-menu/pap
er-dropdown-menu.html"> | 6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dropdown-menu/pap
er-dropdown-menu.html"> |
7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-listbox/paper-lis
tbox.html"> | 7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-listbox/paper-lis
tbox.html"> |
8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-slider/paper-slid
er.html"> | 8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-slider/paper-slid
er.html"> |
| 9 <link rel="import" href="/device_page/display_layout.html"> |
9 <link rel="import" href="/device_page/display_overscan_dialog.html"> | 10 <link rel="import" href="/device_page/display_overscan_dialog.html"> |
10 <link rel="import" href="/settings_shared_css.html"> | 11 <link rel="import" href="/settings_shared_css.html"> |
11 | 12 |
12 <dom-module id="settings-display"> | 13 <dom-module id="settings-display"> |
13 <template> | 14 <template> |
14 <style include="settings-shared"> | 15 <style include="settings-shared"> |
15 .display-section { | 16 .display-section { |
16 align-self: flex-start; | 17 align-self: flex-start; |
17 font-size: 100%; | 18 font-size: 100%; |
18 font-weight: 500; | 19 font-weight: 500; |
19 margin: 10px 0; | 20 margin: 10px 0; |
20 } | 21 } |
21 | 22 |
22 .settings-box.embedded { | 23 .settings-box.embedded { |
23 align-self: stretch; | 24 align-self: stretch; |
24 margin-left: 20px; | 25 margin-left: 20px; |
25 padding: 0; | 26 padding: 0; |
26 } | 27 } |
27 | 28 |
28 /* TODO(stevenjb): Placeholder */ | 29 display-layout { |
29 .display-area { | |
30 align-self: stretch; | 30 align-self: stretch; |
31 border: lightgrey solid 1px; | |
32 flex: 1 1; | 31 flex: 1 1; |
33 height: 200px; | 32 height: 300px; |
34 margin: 10px; | 33 margin: 10px; |
35 } | 34 } |
36 | 35 |
37 .textarea { | 36 .textarea { |
38 margin: 10px 0; | 37 margin: 10px 0; |
39 } | 38 } |
40 | 39 |
41 .info-text { | 40 .info-text { |
42 color: var(--paper-grey-500); | 41 color: var(--paper-grey-500); |
43 } | 42 } |
44 | 43 |
45 .settings-box > paper-button:first-child { | 44 .settings-box > paper-button:first-child { |
46 padding-left: 0 | 45 padding-left: 0 |
47 } | 46 } |
48 </style> | 47 </style> |
49 <div class="settings-box first layout vertical self-stretch"> | 48 <div class="settings-box first layout vertical self-stretch"> |
50 <div class="display-section">$i18n{displayArrangement}</div> | 49 <div class="display-section">$i18n{displayArrangement}</div> |
51 <div class="display-area"> | 50 <display-layout id="displayLayout" |
52 <!-- TODO(stevenjb): Support layout --> | 51 selected-display="[[selectedDisplay]]" |
53 <template is="dom-repeat" items="[[displays]]"> | 52 on-select-display="onSelectDisplay_"> |
54 <paper-button toggles active="[[isSelected_(item, selectedDisplay)]]" | 53 </display-layout> |
55 on-tap="onSelectDisplayTap_" id="[[item.id]]"> | |
56 [[item.name]] | |
57 </paper-button> | |
58 </template> | |
59 </div> | |
60 </div> | 54 </div> |
61 <div class="settings-box layout vertical"> | 55 <div class="settings-box layout vertical"> |
62 <div class="display-section">[[selectedDisplay.name]]</div> | 56 <div class="display-section">[[selectedDisplay.name]]</div> |
63 <div class="settings-box embedded first"> | 57 <div class="settings-box embedded first"> |
64 <paper-checkbox class="flex" checked="[[isMirrored_(displays)]]" | 58 <paper-checkbox class="flex" checked="[[isMirrored_(displays)]]" |
65 hidden$="[[!showMirror_(displays)]]" on-tap="onMirroredTap_"> | 59 hidden$="[[!showMirror_(displays)]]" on-tap="onMirroredTap_"> |
66 $i18n{displayMirror} | 60 $i18n{displayMirror} |
67 </paper-checkbox> | 61 </paper-checkbox> |
68 <paper-button | 62 <paper-button |
69 hidden$="[[!showMakePrimary_(selectedDisplay, primaryDisplayId)]]" | 63 hidden$="[[!showMakePrimary_(selectedDisplay, primaryDisplayId)]]" |
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
110 </div> | 104 </div> |
111 | 105 |
112 <settings-display-overscan-dialog id="displayOverscan" | 106 <settings-display-overscan-dialog id="displayOverscan" |
113 display-id="{{overscanDisplayId}}"> | 107 display-id="{{overscanDisplayId}}"> |
114 </settings-display-overscan-dialog> | 108 </settings-display-overscan-dialog> |
115 | 109 |
116 </div> | 110 </div> |
117 </template> | 111 </template> |
118 <script src="display.js"></script> | 112 <script src="display.js"></script> |
119 </dom-module> | 113 </dom-module> |
OLD | NEW |