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

Side by Side Diff: Source/devtools/front_end/elements/elementsTreeOutline.css

Issue 1304173004: Devtools UI: Add node-specific actions into a ghost toolbar in DOM (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: 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 | Annotate | Revision Log
OLDNEW
1 /* 1 /*
2 * Copyright (c) 2014 The Chromium Authors. All rights reserved. 2 * Copyright (c) 2014 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 .elements-disclosure { 7 .elements-disclosure {
8 width: 100%; 8 width: 100%;
9 display: inline-block; 9 display: inline-block;
10 line-height: normal; 10 line-height: normal;
(...skipping 198 matching lines...) Expand 10 before | Expand all | Expand 10 after
209 209
210 .elements-gutter-decoration { 210 .elements-gutter-decoration {
211 position: absolute; 211 position: absolute;
212 left: 2px; 212 left: 2px;
213 margin-top: 2px; 213 margin-top: 2px;
214 height: 9px; 214 height: 9px;
215 width: 9px; 215 width: 9px;
216 border-radius: 5px; 216 border-radius: 5px;
217 border: 1px solid orange; 217 border: 1px solid orange;
218 background-color: orange; 218 background-color: orange;
219 cursor: pointer;
219 } 220 }
220 221
221 .elements-gutter-decoration.elements-has-decorated-children { 222 .elements-gutter-decoration.elements-has-decorated-children {
222 opacity: 0.5; 223 opacity: 0.5;
223 } 224 }
224 225
225 .add-attribute { 226 .add-attribute {
226 margin-left: 1px; 227 margin-left: 1px;
227 margin-right: 1px; 228 margin-right: 1px;
228 white-space: nowrap; 229 white-space: nowrap;
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
311 ol:focus li.selected .webkit-html-close-tag-name, 312 ol:focus li.selected .webkit-html-close-tag-name,
312 ol:focus li.selected .webkit-html-attribute-value, 313 ol:focus li.selected .webkit-html-attribute-value,
313 ol:focus li.selected .webkit-html-external-link, 314 ol:focus li.selected .webkit-html-external-link,
314 ol:focus li.selected .webkit-html-resource-link { 315 ol:focus li.selected .webkit-html-resource-link {
315 color: white; 316 color: white;
316 } 317 }
317 318
318 ol:focus li.selected .webkit-html-attribute-name { 319 ol:focus li.selected .webkit-html-attribute-name {
319 color: #ccc; 320 color: #ccc;
320 } 321 }
322
323 .elements-disclosure li.selected .selection > .node-actions-container {
324 visibility: visible;
325 }
326
327 .node-actions-container {
328 position: absolute;
329 z-index: 10000;
330 left: 0px;
331 height: 13px;
332 background-color: hsla(0,100%,100%,0.3);
333 }
334
335 .node-actions-toolbar {
336 position: absolute;
337 top: -30px;
338 left: 2px;
339 background: white;
340 border-radius: 3px;
341 border: 1px solid #B1B1B1;
342 visibility: hidden;
343 box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37)
344
345 }
346
347 .node-actions-toggle {
348 -webkit-mask-position: -201px -26px;
349 width: 16.25px;
350 height: 20px;
351 transform: scale(0.8) rotate(90deg);
352 -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
353 -webkit-mask-size: 352px 168px;
354 background-color: #FFFFFF;
355 z-index: 1;
356 margin-top: -3px;
357 cursor: pointer;
358 }
359
360 .gutter-container.has-decorations .node-actions-toggle {
361 opacity: 0;
362 }
363
364 .node-actions-container.expanded > .node-actions-toolbar {
365 visibility: visible;
366 }
367
368 .node-actions-toolbar-below {
369 margin-top: 2px;
370 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698