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

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 200 matching lines...) Expand 10 before | Expand all | Expand 10 after
211 211
212 .elements-gutter-decoration { 212 .elements-gutter-decoration {
213 position: absolute; 213 position: absolute;
214 left: 2px; 214 left: 2px;
215 margin-top: 2px; 215 margin-top: 2px;
216 height: 9px; 216 height: 9px;
217 width: 9px; 217 width: 9px;
218 border-radius: 5px; 218 border-radius: 5px;
219 border: 1px solid orange; 219 border: 1px solid orange;
220 background-color: orange; 220 background-color: orange;
221 cursor: pointer;
221 } 222 }
222 223
223 .elements-gutter-decoration.elements-has-decorated-children { 224 .elements-gutter-decoration.elements-has-decorated-children {
224 opacity: 0.5; 225 opacity: 0.5;
225 } 226 }
226 227
227 .add-attribute { 228 .add-attribute {
228 margin-left: 1px; 229 margin-left: 1px;
229 margin-right: 1px; 230 margin-right: 1px;
230 white-space: nowrap; 231 white-space: nowrap;
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
313 ol:focus li.selected .webkit-html-close-tag-name, 314 ol:focus li.selected .webkit-html-close-tag-name,
314 ol:focus li.selected .webkit-html-attribute-value, 315 ol:focus li.selected .webkit-html-attribute-value,
315 ol:focus li.selected .webkit-html-external-link, 316 ol:focus li.selected .webkit-html-external-link,
316 ol:focus li.selected .webkit-html-resource-link { 317 ol:focus li.selected .webkit-html-resource-link {
317 color: white; 318 color: white;
318 } 319 }
319 320
320 ol:focus li.selected .webkit-html-attribute-name { 321 ol:focus li.selected .webkit-html-attribute-name {
321 color: #ccc; 322 color: #ccc;
322 } 323 }
324
325 .elements-disclosure li.selected .selection > .node-actions-container {
326 visibility: visible;
327 }
328 .node-actions-container {
329 position: absolute;
330 z-index: 10000;
331 left: 0px;
332 height: 13px;
333 background-color: hsla(0,100%,100%,0.3);
334 }
335
336 .node-actions-toolbar {
337 position: absolute;
338 top: -30px;
339 left: 2px;
340 background: white;
341 border-radius: 3px;
342 border: 1px solid #DADADA;
343 visibility: hidden;
344 }
345
346 .node-actions-toggle {
347 -webkit-mask-position: -201px -26px;
348 width: 16.25px;
349 height: 20px;
350 transform: scale(0.8) rotate(90deg);
351 -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
352 -webkit-mask-size: 352px 168px;
353 background-color: #FFFFFF;
354 z-index: 1;
355 margin-top: -3px;
356 cursor: pointer;
357 }
358
359 .node-actions-container.markers-present > .node-actions-toggle {
360 opacity: 0;
361 }
362
363 .node-actions-container.expanded > .node-actions-toolbar {
364 visibility: visible;
365 }
366
367 .node-actions-toolbar-below {
368 margin-top: 2px;
369 }
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698