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

Side by Side Diff: chrome/browser/resources/file_manager/css/file_manager.css

Issue 8898009: Revert 113804 - [filebrowser] Add left panel with roots. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src/
Patch Set: Created 9 years 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 | Annotate | Revision Log
OLDNEW
1 /* 1 /*
2 * Copyright (c) 2011 The Chromium Authors. All rights reserved. 2 * Copyright (c) 2011 The Chromium Authors. All rights reserved.
3 * Use of this source code is governed by a BSD-style license that can be 3 * Use of this source code is governed by a BSD-style license that can be
4 * found in the LICENSE file. 4 * found in the LICENSE file.
5 */ 5 */
6 6
7 /* Outer frame of the dialog. */ 7 /* Outer frame of the dialog. */
8 body { 8 body {
9 -webkit-box-flex: 1; 9 -webkit-box-flex: 1;
10 -webkit-box-orient: vertical; 10 -webkit-box-orient: vertical;
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
93 background-image: -webkit-linear-gradient(top, #fff,#f6f6f6); 93 background-image: -webkit-linear-gradient(top, #fff,#f6f6f6);
94 border-bottom: 1px #d6d9e3 solid; 94 border-bottom: 1px #d6d9e3 solid;
95 color: #42506c; 95 color: #42506c;
96 font-size: 15px; 96 font-size: 15px;
97 font-weight: bold; 97 font-weight: bold;
98 height: 32px; 98 height: 32px;
99 padding-top: 8px; 99 padding-top: 8px;
100 padding-bottom: 8px; 100 padding-bottom: 8px;
101 } 101 }
102 102
103 /* Main part of the dialog between header and footer. */
104 .dialog-container {
105 display: -webkit-box;
106 -webkit-box-orient: horizontal;
107 -webkit-box-align: stretch;
108 overflow: hidden;
109 -webkit-box-flex: 1;
110 }
111
112 /* List/grid and preview are inside this container. */
113 .dialog-main {
114 -webkit-box-flex: 1;
115 display:-webkit-box;
116 -webkit-box-orient: vertical;
117 -webkit-box-align: stretch;
118 }
119
120 /* Roots list at the left. */
121 .dialog-sidebar {
122 position: relative;
123 -webkit-box-flex: 0;
124 width: 200px;
125 margin-left: -200px;
126 background-color: rgba(240, 240, 240, 1);
127 margin-bottom: 15px;
128 margin-top: 15px;
129 -webkit-border-top-right-radius: 4px;
130 -webkit-border-top-left-radius: 4px;
131 -webkit-border-bottom-left-radius: 4px;
132 -webkit-transition: margin-left 180ms ease;
133 overflow: hidden;
134 }
135
136 .dialog-container[sidebar] .dialog-sidebar {
137 margin-left: 15px;
138 }
139
140 /* Roots list at the left. */
141 list.roots-list {
142 width: 100%;
143 }
144
145 list.roots-list > * {
146 border: none;
147 border-radius: 0;
148 line-height: 35px;
149 margin: 0;
150 padding: 0 5px;
151 background-color: rgba(240,240,240,1);
152 }
153
154 list.roots-list > [lead],
155 list.roots-list > [selected],
156 list.roots-list > [anchor] {
157 background-color: hsl(214,91%,89%);
158 }
159
160 list.roots-list > [lead]:hover,
161 list.roots-list > [selected]:hover,
162 list.roots-list > [anchor]:hover {
163 background-color: hsl(214,91%,87%);
164 }
165
166 list.roots-list li.root-item {
167 display: -webkit-box;
168 -webkit-box-align: center;
169 -webkit-box-pack: start;
170 }
171
172 li.root-item > * {
173 display: block;
174 margin-right: 5px;
175 }
176
177 li.root-item > .text {
178 max-width: 130px;
179 overflow: hidden;
180 text-overflow: ellipsis;
181 white-space: nowrap;
182 }
183
184 li.root-item > .spacer {
185 -webkit-box-flex: 1;
186 }
187
188 img.root-eject {
189 opacity: 0.5;
190 cursor: pointer;
191 width: 15px;
192 height: 12px;
193 }
194
195 img.root-eject:hover {
196 opacity: 1;
197 }
198
199 /* Breadcrumbs and things under the title but above the list view. */ 103 /* Breadcrumbs and things under the title but above the list view. */
200 .dialog-header { 104 .dialog-header {
201 -webkit-box-orient: horizontal; 105 -webkit-box-orient: horizontal;
202 -webkit-box-align: center; 106 -webkit-box-align: center;
203 display: -webkit-box; 107 display: -webkit-box;
204 margin-top: 15px; 108 margin: 15px;
205 margin-right: 15px;
206 margin-bottom: 4px; 109 margin-bottom: 4px;
207 margin-left: 15px; 110 }
208 -webkit-transition: all 180ms ease;
209 }
210 111
211 /* Container for the detail and thumbnail (not implemented yet) list views. */ 112 /* Container for the detail and thumbnail (not implemented yet) list views. */
212 .dialog-container[sidebar] .dialog-header {
213 margin-left: 0;
214 }
215
216 /* Close sidebar button. */
217 div.close-sidebar {
218 cursor: pointer;
219 position: absolute;
220 right: 0;
221 top: 2px;
222 display: none;
223 z-index: 10;
224 background-color: white;
225 border: 1px solid rgba(200,200,200,1);
226 width: 13px;
227 height: 24px;
228 }
229
230 div.close-sidebar:hover {
231 background-color: rgba(240,240,240,1);
232 }
233
234 /* Open sidebar button. */
235 div.open-sidebar {
236 cursor: pointer;
237 margin-right: 10px;
238 background-color: white;
239 width: 13px;
240 height: 24px;
241 }
242
243 div.open-sidebar:hover {
244 background-color: rgba(240,240,240,1);
245 }
246
247 .dialog-container[sidebar] div.open-sidebar {
248 display: none;;
249 }
250
251 .dialog-container[sidebar] div.close-sidebar {
252 display: block;
253 }
254
255 /* Container for the detail and thumbnail list views. */
256 .dialog-body { 113 .dialog-body {
257 -webkit-box-orient: vertical; 114 -webkit-box-orient: vertical;
258 -webkit-box-flex: 1; 115 -webkit-box-flex: 1;
259 border: 1px #aaa solid; 116 border: 1px #aaa solid;
260 border-radius: 4px; 117 border-radius: 4px;
261 display: -webkit-box; 118 display: -webkit-box;
262 margin-right: 15px; 119 margin: 15px;
263 margin-bottom: 15px; 120 margin-top: 0;
264 margin-left: 15px;
265 overflow: hidden; 121 overflow: hidden;
266 -webkit-transition: all 180ms ease;
267 }
268
269 .dialog-container[sidebar] .dialog-body {
270 -webkit-border-top-left-radius: 0;
271 -webkit-border-bottom-left-radius: 0;
272 margin-left: 0;
273 } 122 }
274 123
275 /* Container for the ok/cancel buttons. */ 124 /* Container for the ok/cancel buttons. */
276 .dialog-footer { 125 .dialog-footer {
277 -webkit-box-orient: horizontal; 126 -webkit-box-orient: horizontal;
278 display: -webkit-box; 127 display: -webkit-box;
279 margin: 15px; 128 margin: 15px;
280 margin-top: 0; 129 margin-top: 0;
281 } 130 }
282 131
283 /* The container for breadcrumb elements. */ 132 /* The container for breadcrumb elements. */
284 .breadcrumbs { 133 .breadcrumbs {
285 -webkit-box-orient: horizontal; 134 -webkit-box-orient: horizontal;
286 -webkit-box-flex: 1; 135 -webkit-box-flex: 1;
287 display: -webkit-box; 136 display: -webkit-box;
288 -webkit-box-align: center;
289 font-size: 15px; 137 font-size: 15px;
290 line-height: 15px; 138 line-height: 15px;
291 height: 18px; 139 height: 18px;
292 overflow: hidden; 140 overflow: hidden;
293 text-overflow: ellipsis; 141 text-overflow: ellipsis;
294 white-space: nowrap; 142 white-space: nowrap;
295 } 143 }
296 144
297 .dialog-container[sidebar] .breadcrumbs {
298 margin-left: 10px;
299 }
300
301 /* Icon at the start of breadcrumb path. Corresponds to the root selected. */
302 .breadcrumb-icon {
303 margin-right: 5px;
304 display: block;
305 }
306
307 .dialog-container[sidebar] .breadcrumb-icon {
308 display: none;
309 }
310
311 /* A single directory name in the list of path breadcrumbs. */ 145 /* A single directory name in the list of path breadcrumbs. */
312 .breadcrumb-path { 146 .breadcrumb-path {
313 color: #265692; 147 color: #265692;
314 cursor: pointer; 148 cursor: pointer;
315 font-size: 14px; 149 font-size: 14px;
316 } 150 }
317 151
318 /* The final breadcrumb, representing the current directory. */ 152 /* The final breadcrumb, representing the current directory. */
319 .breadcrumb-last { 153 .breadcrumb-last {
320 color: #666; 154 color: #666;
(...skipping 48 matching lines...) Expand 10 before | Expand all | Expand 10 after
369 padding: 15px; 203 padding: 15px;
370 } 204 }
371 205
372 .downloads-warning div { 206 .downloads-warning div {
373 display: -webkit-box; 207 display: -webkit-box;
374 -webkit-box-flex: 1; 208 -webkit-box-flex: 1;
375 } 209 }
376 210
377 /* The cr.ui.Grid representing the detailed file list. */ 211 /* The cr.ui.Grid representing the detailed file list. */
378 .thumbnail-grid { 212 .thumbnail-grid {
379 width: 100%; 213 position: absolute;
214 top: 0;
215 left: 0;
216 border: 0;
380 overflow-y: scroll; 217 overflow-y: scroll;
381 } 218 }
382 219
383 /* An item in the thumbnail view. */ 220 /* An item in the thumbnail view. */
384 .thumbnail-item { 221 .thumbnail-item {
385 margin-top: 10px; 222 margin-top: 10px;
386 margin-left: 10px; 223 margin-left: 10px;
387 width: 120px; 224 width: 120px;
388 height: 145px; 225 height: 145px;
389 text-align: center; 226 text-align: center;
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
424 } 261 }
425 262
426 /* Text box used for renaming in the thumbnail list. */ 263 /* Text box used for renaming in the thumbnail list. */
427 .thumbnail-grid input.rename { 264 .thumbnail-grid input.rename {
428 -webkit-margin-start: -2px; 265 -webkit-margin-start: -2px;
429 position: absolute; 266 position: absolute;
430 } 267 }
431 268
432 /* The cr.ui.Table representing the detailed file list. */ 269 /* The cr.ui.Table representing the detailed file list. */
433 .detail-table { 270 .detail-table {
434 width: 100%; 271 position: absolute;
272 top: 0;
273 left: 0;
435 border: 0; 274 border: 0;
436 } 275 }
437 276
438 /* Bottom pane describing current selection. */ 277 /* Bottom pane describing current selection. */
439 .preview-panel { 278 .preview-panel {
440 -webkit-box-orient: horizontal; 279 -webkit-box-orient: horizontal;
441 display: -webkit-box; 280 display: -webkit-box;
442 height: 61px; 281 height: 61px;
443 background-color: #F0F0F0; 282 background-color: #F0F0F0;
444 padding: 0px 14px 0px 14px; 283 padding: 0px 14px 0px 14px;
(...skipping 339 matching lines...) Expand 10 before | Expand all | Expand 10 after
784 /* Overlay pane covering the entire file manager window (e.g. image editor)*/ 623 /* Overlay pane covering the entire file manager window (e.g. image editor)*/
785 .overlay-pane { 624 .overlay-pane {
786 position: absolute; 625 position: absolute;
787 top: 0; 626 top: 0;
788 left: 0; 627 left: 0;
789 width: 100%; 628 width: 100%;
790 height: 100%; 629 height: 100%;
791 border: none; 630 border: none;
792 z-index: 100; 631 z-index: 100;
793 } 632 }
OLDNEW
« no previous file with comments | « chrome/browser/resources/component_extension_resources.grd ('k') | chrome/browser/resources/file_manager/js/file_manager.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698