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/cr_elements/icons.html"> | 2 <link rel="import" href="chrome://resources/cr_elements/icons.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-icon/iron-icon.htm
l"> | 4 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.htm
l"> |
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-input/paper-input
-container.html"> | 6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input
-container.html"> |
7 | 7 |
8 <dom-module id="settings-subpage-search"> | 8 <dom-module id="settings-subpage-search"> |
9 <template> | 9 <template> |
10 <style> | 10 <style> |
11 :host { | 11 :host { |
12 --subpage-search-underline: { | 12 --subpage-search-underline: { |
13 margin-bottom: -2px; | 13 margin-bottom: -2px; |
14 margin-top: -2px; | 14 margin-top: -2px; |
15 } | 15 } |
16 } | 16 } |
17 | 17 |
18 :host { | 18 :host { |
19 --paper-input-container-underline: var(--subpage-search-underline); | 19 --paper-input-container-underline: var(--subpage-search-underline); |
20 --paper-input-container-underline-focus: | 20 --paper-input-container-underline-focus: |
21 var(--subpage-search-underline); | 21 var(--subpage-search-underline); |
22 --paper-input-container-underline-disabled: | 22 --paper-input-container-underline-disabled: |
23 var(--subpage-search-underline); | 23 var(--subpage-search-underline); |
24 --paper-input-suffix: { | 24 --paper-input-suffix: { |
25 /* Required to align the icon in |clearSearch| vertically. */ | 25 /* Required to align the icon in |clearSearch| vertically. */ |
26 line-height: 0; | 26 line-height: 0; |
27 } | 27 }; |
| 28 |
| 29 /** |
| 30 * Kind of suck to have to hardcode these, but its necessary to |
| 31 * make sure the conditional clear-icon will fit within input's height. |
| 32 */ |
| 33 --paper-input-container-input: { |
| 34 line-height: 24px; |
| 35 }; |
| 36 --paper-input-container-label: { |
| 37 line-height: 24px; |
| 38 }; |
28 } | 39 } |
29 | 40 |
30 paper-icon-button { | 41 paper-icon-button { |
31 /* A 16px icon that fits on the input line. */ | 42 /* A 16px icon that fits on the input line. */ |
32 height: 24px; | 43 height: 24px; |
33 padding: 4px; | 44 padding: 4px; |
34 width: 24px; | 45 width: 24px; |
35 } | 46 } |
36 | 47 |
37 #searchIcon { | 48 #searchIcon { |
38 height: 16px; | 49 height: 16px; |
39 padding: 4px; | 50 padding: 4px; |
| 51 vertical-align: middle; |
40 width: 16px; | 52 width: 16px; |
41 } | 53 } |
42 | 54 |
43 paper-input-container { | 55 paper-input-container { |
44 display: inline-block; | 56 display: inline-block; |
| 57 vertical-align: middle; |
45 width: 160px; /* Special width for search input. */ | 58 width: 160px; /* Special width for search input. */ |
46 } | 59 } |
47 | 60 |
48 input[type='search']::-webkit-search-cancel-button { | 61 input[type='search']::-webkit-search-cancel-button { |
49 -webkit-appearance: none; | 62 -webkit-appearance: none; |
50 } | 63 } |
51 | 64 |
52 #prompt, | 65 #prompt, |
53 #searchInput { | 66 #searchInput { |
54 font-size: 92.3076923%; /* To 12px from 13px. */ | 67 font-size: 92.3076923%; /* To 12px from 13px. */ |
(...skipping 23 matching lines...) Expand all Loading... |
78 on-input="onSearchTermInput" aria-labelledby="prompt" incremental> | 91 on-input="onSearchTermInput" aria-labelledby="prompt" incremental> |
79 </input> | 92 </input> |
80 <paper-icon-button suffix icon="cr:cancel" id="clearSearch" | 93 <paper-icon-button suffix icon="cr:cancel" id="clearSearch" |
81 on-tap="onTapClear_" title="[[clearLabel]]" | 94 on-tap="onTapClear_" title="[[clearLabel]]" |
82 hidden$="[[!hasSearchText]]"> | 95 hidden$="[[!hasSearchText]]"> |
83 </paper-icon-button> | 96 </paper-icon-button> |
84 </paper-input-container> | 97 </paper-input-container> |
85 </template> | 98 </template> |
86 <script src="settings_subpage_search.js"></script> | 99 <script src="settings_subpage_search.js"></script> |
87 </dom-module> | 100 </dom-module> |
OLD | NEW |