Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(17)

Side by Side Diff: chrome/browser/resources/md_downloads/toolbar.css

Issue 1308893009: [MD Extensions] Move search field out of downloads, use it in extensions (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Dan's + move search field to cr_search_field Created 5 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
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 align-items: center; 6 align-items: center;
7 background: rgb(63, 85, 102); 7 background: rgb(63, 85, 102);
8 color: white; 8 color: white;
9 content-sizing: padding-box; 9 content-sizing: padding-box;
10 display: flex; 10 display: flex;
(...skipping 21 matching lines...) Expand all
32 } 32 }
33 33
34 :host(:not([downloads-showing])) #actions { 34 :host(:not([downloads-showing])) #actions {
35 justify-content: center; 35 justify-content: center;
36 } 36 }
37 37
38 #actions paper-button { 38 #actions paper-button {
39 -webkit-margin-end: 8px; 39 -webkit-margin-end: 8px;
40 } 40 }
41 41
42 #actions, 42 #actions {
43 #search-term {
44 color: rgb(192, 199, 205); 43 color: rgb(192, 199, 205);
45 } 44 }
46 45
47 #search { 46 #search {
48 -webkit-padding-end: 10px; 47 -webkit-padding-end: 10px;
49 box-sizing: border-box; 48 box-sizing: border-box;
50 display: flex; 49 display: flex;
51 justify-content: flex-end; 50 justify-content: flex-end;
52 } 51 }
53 52
54 #search paper-input-container {
55 margin-top: 2px;
56 max-width: 200px;
57 padding: 2px 0;
58 width: 100%;
59 }
60
61 #search-term {
62 --paper-input-container-color: rgb(192, 199, 205);
63 --paper-input-container-focus-color: rgb(192, 199, 205);
64 --paper-input-container-input: {
65 color: inherit;
66 font-family: inherit;
67 font-size: inherit;
68 };
69 --paper-input-container-input-color: rgb(192, 199, 205);
70 z-index: 0;
71 }
72
73 #search-term input[type='search']::-webkit-search-decoration,
74 #search-term input[type='search']::-webkit-search-cancel-button,
75 #search-term input[type='search']::-webkit-search-results-button {
76 -webkit-appearance: none;
77 }
78
79 #search-term input[type='search']::-webkit-search-cancel-button {
80 display: block;
81 width: 20px;
82 }
83
84 paper-icon-button { 53 paper-icon-button {
85 --iron-icon-height: 20px; 54 --iron-icon-height: 20px;
86 --iron-icon-width: 20px; 55 --iron-icon-width: 20px;
87 --paper-icon-button: { 56 --paper-icon-button: {
88 height: 20px; 57 height: 20px;
89 padding: 6px; 58 padding: 6px;
90 width: 20px; 59 width: 20px;
91 }; 60 };
92 } 61 }
93 62
94 #search-term paper-icon-button {
95 --iron-icon-height: 16px;
96 --iron-icon-width: 16px;
97 --paper-icon-button: {
98 -webkit-margin-end: -8px;
99 height: 16px;
100 padding: 8px;
101 width: 16px;
102 };
103 position: absolute;
104 right: 0;
105 top: -4px;
106 z-index: 1;
107 }
108
109 :host-context([dir='rtl']) #search-term paper-icon-button {
110 left: 0;
111 right: auto;
112 }
113
114 #more { 63 #more {
115 --paper-menu-button: { 64 --paper-menu-button: {
116 padding: 0; 65 padding: 0;
117 }; 66 };
118 -webkit-margin-start: 16px; 67 -webkit-margin-start: 16px;
119 } 68 }
120 69
121 paper-item { 70 paper-item {
122 -webkit-user-select: none; 71 -webkit-user-select: none;
123 cursor: pointer; 72 cursor: pointer;
(...skipping 11 matching lines...) Expand all
135 display: none; 84 display: none;
136 } 85 }
137 } 86 }
138 87
139 @media all and (max-width: 1024px) { 88 @media all and (max-width: 1024px) {
140 /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */ 89 /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */
141 #actions { 90 #actions {
142 display: none; 91 display: none;
143 } 92 }
144 } 93 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698