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

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: Rebase; remove material breadcrumb from experiment 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
« no previous file with comments | « Source/devtools/front_end/elements/elementsPanel.css ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
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
329 .node-actions-container {
330 position: absolute;
331 z-index: 10000;
332 left: 0px;
333 height: 13px;
334 background-color: hsla(0,100%,100%,0.3);
335 }
336
337 .node-actions-toolbar {
338 position: absolute;
339 top: -30px;
340 left: 2px;
341 background: white;
342 border-radius: 3px;
343 border: 1px solid #B1B1B1;
344 visibility: hidden;
345 box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37)
346
347 }
348
349 .node-actions-toggle {
350 -webkit-mask-position: -201px -26px;
351 width: 16.25px;
352 height: 20px;
353 transform: scale(0.8) rotate(90deg);
354 -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
355 -webkit-mask-size: 352px 168px;
356 background-color: #FFFFFF;
357 z-index: 1;
358 margin-top: -3px;
359 cursor: pointer;
360 }
361
362 .gutter-container.has-decorations .node-actions-toggle {
363 opacity: 0;
364 }
365
366 .node-actions-container.expanded > .node-actions-toolbar {
367 visibility: visible;
368 }
369
370 .node-actions-toolbar-below {
371 margin-top: 2px;
372 }
OLDNEW
« no previous file with comments | « Source/devtools/front_end/elements/elementsPanel.css ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698