OLD | NEW |
1 <link rel="import" href="chrome://resources/cr_elements/cr_search_field/cr_searc
h_field_behavior.html"> | 1 <link rel="import" href="chrome://resources/cr_elements/cr_search_field/cr_searc
h_field_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/paper-input/paper-input
-container.html"> | 3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input
-container.html"> |
4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input
.html"> | 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input
.html"> |
5 | 5 |
6 <dom-module id="settings-subpage-search"> | 6 <dom-module id="settings-subpage-search"> |
7 <template> | 7 <template> |
8 <style> | 8 <style> |
9 paper-input-container { | 9 paper-input-container { |
10 width: var(--paper-input-max-width); | 10 width: var(--paper-input-max-width); |
11 } | 11 } |
12 | 12 |
13 input[type='search']::-webkit-search-cancel-button { | 13 input[type='search']::-webkit-search-cancel-button { |
14 -webkit-appearance: none; | 14 -webkit-appearance: none; |
15 } | 15 } |
16 | 16 |
17 #prompt, | 17 #prompt, |
18 #searchInput { | 18 #searchInput { |
19 color: var(--google-grey-500); | |
20 font-size: 13px; | 19 font-size: 13px; |
21 line-height: 36px; | 20 line-height: 36px; |
22 } | 21 } |
23 | 22 |
| 23 #prompt { |
| 24 color: var(--google-grey-500); |
| 25 } |
| 26 |
| 27 #searchInput { |
| 28 color: var(--paper-grey-800); |
| 29 } |
| 30 |
24 #clearSearch { | 31 #clearSearch { |
25 -webkit-margin-end: -8px; | 32 -webkit-margin-end: -8px; |
26 -webkit-margin-start: 8px; | 33 -webkit-margin-start: 8px; |
27 } | 34 } |
28 | 35 |
29 :root { | 36 :root { |
30 --paper-icon-button { | 37 --paper-icon-button { |
31 height: 36px; | 38 height: 36px; |
32 width: 36px; | 39 width: 36px; |
33 } | 40 } |
34 | 41 |
35 --paper-input-suffix: { | 42 --paper-input-suffix: { |
36 /* Required to align the icon in |clearSearch| vertically. */ | 43 /* Required to align the icon in |clearSearch| vertically. */ |
37 line-height: 0; | 44 line-height: 0; |
38 } | 45 } |
39 } | 46 } |
40 </style> | 47 </style> |
41 <paper-input-container no-label-float on-search="onSearchTermSearch"> | 48 <paper-input-container no-label-float on-search="onSearchTermSearch"> |
42 <label id="prompt">[[label]]</label> | 49 <label id="prompt">[[label]]</label> |
43 <input is="iron-input" id="searchInput" type="search" | 50 <input is="iron-input" id="searchInput" type="search" |
44 aria-labelledby="prompt" incremental> | 51 aria-labelledby="prompt" incremental> |
45 </input> | 52 </input> |
46 <paper-icon-button suffix icon="cr:cancel" id="clearSearch" | 53 <paper-icon-button suffix icon="cr:cancel" id="clearSearch" |
47 on-tap="onTapClear_" title="[[clearLabel]]" hidden$="[[!lastValue_]]"> | 54 on-tap="onTapClear_" title="[[clearLabel]]" hidden$="[[!lastValue_]]"> |
48 </paper-icon-button> | 55 </paper-icon-button> |
49 </paper-input-container> | 56 </paper-input-container> |
50 </template> | 57 </template> |
51 <script src="settings_subpage_search.js"></script> | 58 <script src="settings_subpage_search.js"></script> |
52 </dom-module> | 59 </dom-module> |
OLD | NEW |