OLD | NEW |
1 /* Copyright 2015 The Chromium Authors. All rights reserved. | 1 /* Copyright 2015 The Chromium Authors. All rights reserved. |
2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
3 * found in the LICENSE file. */ | 3 * found in the LICENSE file. */ |
4 | 4 |
5 :host { | 5 :host { |
6 @apply(--downloads-shared-style); | 6 @apply(--downloads-shared-style); |
7 align-items: center; | 7 align-items: center; |
8 background: rgb(63, 85, 102); | 8 background: rgb(63, 85, 102); |
9 color: white; | 9 color: white; |
10 content-sizing: padding-box; | 10 content-sizing: padding-box; |
11 display: flex; | 11 display: flex; |
12 height: 48px; | 12 height: 56px; |
13 } | 13 } |
14 | 14 |
15 #title, | 15 #title, |
16 #search { | 16 #search { |
17 flex: 1 0 var(--downloads-side-column-basis); | 17 flex: 1 0 var(--downloads-side-column-basis); |
18 } | 18 } |
19 | 19 |
20 #title h1 { | 20 #title h1 { |
21 -webkit-margin-end: 0; | 21 -webkit-margin-end: 0; |
22 -webkit-margin-start: 24px; | 22 -webkit-margin-start: 24px; |
23 font-size: 123.077%; | 23 font-size: 107.7%; |
24 margin-bottom: 0; | 24 margin-bottom: 0; |
25 margin-top: 0; | 25 margin-top: 0; |
26 } | 26 } |
27 | 27 |
28 #actions { | 28 #actions { |
| 29 color: rgb(192, 199, 205); |
29 display: flex; | 30 display: flex; |
30 flex: none; | 31 flex: none; |
31 width: var(--downloads-item-width); | 32 width: var(--downloads-item-width); |
32 } | 33 } |
33 | 34 |
34 #search { | 35 #search { |
35 -webkit-margin-end: 10px; | 36 -webkit-margin-end: 10px; |
36 display: flex; | 37 display: flex; |
37 justify-content: flex-end; | 38 justify-content: flex-end; |
38 } | 39 } |
39 | 40 |
40 #search paper-input-container { | 41 #search paper-input-container { |
41 padding: 2px 0; | 42 padding: 2px 0; |
42 } | 43 } |
43 | 44 |
44 #search-term { | 45 #search-term { |
45 --paper-input-container-color: rgba(255, 255, 255, .5); | 46 --paper-input-container-color: rgba(255, 255, 255, .5); |
46 --paper-input-container-focus-color: white; | 47 --paper-input-container-focus-color: white; |
47 --paper-input-container-input: { | 48 --paper-input-container-input: { |
48 font-family: inherit; | 49 font-family: inherit; |
49 font-size: 14px; | 50 font-size: inherit; |
50 }; | 51 }; |
51 --paper-input-container-input-color: white; | 52 --paper-input-container-input-color: white; |
52 z-index: 0; | 53 z-index: 0; |
53 } | 54 } |
54 | 55 |
55 #search-term input[type='search']::-webkit-search-cancel-button, | 56 #search-term input[type='search']::-webkit-search-cancel-button, |
56 #search-term input[type='search']::-webkit-search-results-button { | 57 #search-term input[type='search']::-webkit-search-results-button { |
57 -webkit-appearance: none; | 58 -webkit-appearance: none; |
58 } | 59 } |
59 | 60 |
60 paper-icon-button { | 61 paper-icon-button { |
| 62 --iron-icon-height: 20px; |
| 63 --iron-icon-width: 20px; |
| 64 --paper-icon-button: { |
| 65 height: 20px; |
| 66 padding: 6px; |
| 67 width: 20px; |
| 68 }; |
| 69 } |
| 70 |
| 71 #search-term paper-icon-button { |
61 --iron-icon-height: 16px; | 72 --iron-icon-height: 16px; |
62 --iron-icon-width: 16px; | 73 --iron-icon-width: 16px; |
63 --paper-icon-button: { | 74 --paper-icon-button: { |
64 height: 16px; | 75 height: 16px; |
65 padding: 6px; | 76 padding: 8px; |
66 width: 16px; | 77 width: 16px; |
67 }; | 78 }; |
68 } | |
69 | |
70 #search-term paper-icon-button { | |
71 position: absolute; | 79 position: absolute; |
72 right: 0; | 80 right: 0; |
73 top: -2px; | 81 top: -2px; |
74 z-index: 1; | 82 z-index: 1; |
75 } | 83 } |
76 | 84 |
77 :host-context([dir='rtl']) #search-term paper-icon-button { | 85 :host-context([dir='rtl']) #search-term paper-icon-button { |
78 left: 0; | 86 left: 0; |
79 right: auto; | 87 right: auto; |
80 } | 88 } |
(...skipping 20 matching lines...) Expand all Loading... |
101 display: none; | 109 display: none; |
102 } | 110 } |
103 } | 111 } |
104 | 112 |
105 @media all and (max-width: 1024px) { | 113 @media all and (max-width: 1024px) { |
106 /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */ | 114 /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */ |
107 #actions { | 115 #actions { |
108 display: none; | 116 display: none; |
109 } | 117 } |
110 } | 118 } |
OLD | NEW |