Roll reference builds to 35.0.1916.114.

chrome_linux/resources/inspector/timelinePanel.css

 /*
  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 56 matching lines @@
 
 .timeline-frames-view #timeline-overview-grid {
     display: none;
 }
 
 #timeline-overview-grid .resources-dividers-label-bar {
     pointer-events: auto;
 }
 
 .timeline-frames-view .overview-grid-window,
-.timeline-frames-view .overview-grid-dividers-background,
-.timeline-frames-view .overview-grid-window-resizer {
-    height: 15px;
+.timeline-frames-view .overview-grid-dividers-background {
+    height: 100%;
 }
 
 #timeline-overview-grid #resources-graphs {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     height: 80px;
 }
 
@@ skipping 10 matching lines @@
 .timeline-details-split {
     flex: auto;
 }
 
 .timeline-view {
     flex: auto;
 }
 
 .timeline-view-stack {
     flex: auto;
+    display: flex;
 }
 
 #timeline-container .webkit-html-external-link,
 #timeline-container .webkit-html-resource-link {
     color: inherit;
 }
 
 .timeline-tree-item {
     height: 18px;
     line-height: 15px;
@@ skipping 40 matching lines @@
     height: 10px;
     content: "";
     background-color: rgb(110, 110, 110);
     position: relative;
     top: -1px;
     left: -1px;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .timeline-tree-item-expand-arrow {
-    -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
+    -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
 }
 } /* media */
 
 .timeline-tree-item-expand-arrow.parent {
     -webkit-mask-position: -4px -96px;
 }
 
 .timeline-tree-item-expand-arrow.parent.expanded {
     -webkit-mask-position: -20px -96px;
 }
 
 .timeline-expandable-arrow {
     background-image: url(Images/statusbarButtonGlyphs.png);
     background-size: 320px 144px;
     opacity: 0.5;
     width: 10px;
     height: 10px;
     position: relative;
     top: 3px;
     left: 2px;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .timeline-expandable-arrow {
-    background-image: url(Images/statusbarButtonGlyphs2x.png);
+    background-image: url(Images/statusbarButtonGlyphs_2x.png);
 }
 } /* media */
 
 .timeline-expandable-collapsed .timeline-expandable-arrow {
     background-position: -4px -96px;
 }
 
 .timeline-expandable-expanded .timeline-expandable-arrow {
     background-position: -20px -96px;
 }
@@ skipping 32 matching lines @@
     position: relative;
     top: 2px;
 }
 
 .timeline-tree-item-child-warning {
     opacity: 0.6;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .timeline-tree-item-warning {
-    background-image: url(Images/statusbarButtonGlyphs2x.png);
+    background-image: url(Images/statusbarButtonGlyphs_2x.png);
 }
 } /* media */
 
 .timeline-tree-item .data.dimmed {
     color: rgba(0, 0, 0, 0.7);
     pointer-events: none;
     padding-left: 4px;
 }
 
 .timeline-tree-item.selected .data.dimmed {
     color: rgba(255, 255, 255, 0.8);
     pointer-events: auto;
 }
 
 .timeline-tree-item.selected .timeline-tree-item-expand-arrow {
     background-color: white;
 }
 
 #timeline-overview-events,
-#timeline-overview-memory {
+#timeline-overview-memory,
+#timeline-overview-power {
     position: absolute;
     left: 0;
     right: 0;
     bottom: 0;
     top: 20px;
     z-index: 160;
 }
 
-#timeline-overview-memory  {
+#timeline-overview-memory,
+#timeline-overview-power  {
     top: 25px;
 }
 
 #timeline-overview-pane {
-    flex: auto;
+    flex: 0 0 80px;
     position: relative;
+    overflow: hidden;
 }
 
 #timeline-overview-container {
+    display: flex;
     flex: auto;
     position: relative;
     height: 80px;
+    overflow: hidden;
 }
 
 #timeline-overview-container canvas {
     width: 100%;
     height: 100%;
 }
 
 #timeline-overview-frames canvas {
     z-index: 200;
     background-color: rgba(255, 255, 255, 0.8);
@@ skipping 75 matching lines @@
 .popover ul {
     margin: 0;
     padding: 0;
     list-style-type: none;
 }
 
 .garbage-collect-status-bar-item .glyph {
     -webkit-mask-position: -128px -24px;
 }
 
-.glue-async-status-bar-item .glyph {
-    -webkit-mask-position: -128px -48px;
-}
-
-.glue-async-status-bar-item.toggled-on:disabled .glyph {
-    background-color: rgba(0, 0, 0, 0.75);
-}
-
 #resources-container-content {
     overflow: hidden;
     min-height: 100%;
 }
 
 #resources-graphs {
     position: absolute;
     left: 0;
     right: 0;
     max-height: 100%;
@@ skipping 12 matching lines @@
 
 .resources-graph-bar-area {
     position: absolute;
     top: 0;
     bottom: 0;
     right: 8px;
     left: 9px;
 }
 
 #timeline-overview-sidebar .sidebar-tree {
-    height: 100%;
+    flex: auto;
 }
 
 #timeline-overview-sidebar .sidebar-tree-item {
     height: auto;
     flex: auto;
     margin: 1px 0 1px 0;
     border-top: none;
     display: flex;
     align-items: center;
     border-left: 6px solid transparent;
@@ skipping 20 matching lines @@
 #timeline-overview-sidebar .icon {
     height: 24px;
     margin: 0;
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
     -webkit-mask-size: 320px 144px;
     background-color: black;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 #timeline-overview-sidebar .icon {
-    -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
+    -webkit-mask-image: url(Images/statusbarButtonGlyphs_2x.png);
 }
 } /* media */
 
 .timeline-overview-sidebar-events .icon {
     -webkit-mask-position: -192px -48px;
 }
 
 .timeline-overview-sidebar-frames .icon {
     -webkit-mask-position: -160px -48px;
 }
 
 .timeline-overview-sidebar-memory .icon {
     -webkit-mask-position: -224px -48px;
 }
 
+.timeline-overview-sidebar-power .icon {
+    -webkit-mask-position: -64px -120px;
+}
+
 .memory-graph-label {
     position: absolute;
     left: 5px;
     font-size: 9px;
     color: rgb(50%, 50%, 50%);
     white-space: nowrap;
 }
 
 .max.memory-graph-label {
     top: 5px;
 }
 
 .min.memory-graph-label {
     bottom: 5px;
 }
 
-#memory-counters-graph {
-    border-right: 1px solid rgb(196, 196, 196);
-}
-
 #memory-graphs-canvas-container {
     overflow: hidden;
+    flex: auto;
+    position: relative;
 }
 
-#memory-graphs-canvas-container.dom-counters .resources-dividers,
 #memory-counters-graph {
-    top: 17px;
+    flex: auto;
+}
+
+#memory-graphs-canvas-container .memory-counter-marker {
+    position: absolute;
+    border-radius: 3px;
+    width: 5px;
+    height: 5px;
+    margin-left: -3px;
+    margin-top: -2px;
 }
 
 #memory-graphs-container .split-view-contents-first {
     background-color: rgb(236, 236, 236);
     overflow-y: hidden;
 }
 
 #memory-graphs-container .sidebar-tree-section {
     padding-left: 5px;
 }
 
 .memory-counter-sidebar-info {
     margin: 5px;
     white-space: nowrap;
 }
 
-.memory-counter-sidebar-info .swatch{
+.memory-counter-sidebar-info .swatch {
     background-image: none;
     border: 1px solid rgba(0,0,0,0.3);
     opacity: 0.5;
 }
 
 .memory-counter-sidebar-info.bottom-border-visible {
     border-bottom: 1px solid #AAA;
 }
 
 .memory-counter-sidebar-info .title {
     margin: 4px;
 }
 
 .memory-counter-value {
     margin: 4px;
 }
 
 #counter-values-bar {
+    flex: 0 0 18px;
     border-bottom: solid 1px lightgray;
     width: 100%;
-    height: 17px;
     overflow: hidden;
+    line-height: 18px;
 }
 
 .timeline .resources-event-divider {
     height: 19px;
     width: 8px;
     border-left-width: 2px;
     border-left-style: solid;
     bottom: auto;
     pointer-events: auto;
 }
@@ skipping 27 matching lines @@
 }
 
 .timeline-frame-container {
     height: 19px;
     overflow: hidden;
     background-color: rgb(220, 220, 220);
     opacity: 0.8;
     color: black;
     text-align: center;
     padding-top: 3px;
-    z-index: 350;
+    z-index: 220;
     pointer-events: auto;
 }
 
 .timeline-frame-strip {
     position: absolute;
     height: 19px;
 }
 
 #timeline-grid-header {
     pointer-events: none;
+    height: 19px;
 }
 
-.timeline-utilization-strips {
+#timeline-graph-records-header {
+    pointer-events: none;
     height: 19px;
     padding: 1px 0;
     justify-content: center;
 }
 
 .timeline-utilization-strip {
-    z-index: 350;
+    z-index: 250;
     overflow: hidden;
     flex: 0 1 12px;
     position: relative;
+    height: 9px;
 }
 
 .timeline-utilization-strip .timeline-graph-bar {
     border-color: rgb(192, 192, 192);
     background-color: rgba(0, 0, 0, 0.1);
     margin: 1.5px auto;
     height: auto;
 }
 
 .timeline-utilization-strip.gpu .timeline-graph-bar {
@@ skipping 38 matching lines @@
 }
 
 .image-container {
     padding: 0;
 }
 
 .memory-category-value {
     float: right;
 }
 
-.highlighted-timeline-record {
-    -webkit-animation: "timeline_record_highlight" 2s 0s;
-}
-
-@-webkit-keyframes timeline_record_highlight {
-    from {background-color: rgba(255, 255, 120, 1); }
-    to { background-color: rgba(255, 255, 120, 0); }
-}
-
 .timeline-filters-header {
     flex: 0 0 23px;
     overflow: hidden;
 }
 
 .timeline-details {
     -webkit-user-select: text;
     vertical-align: top;
 }
 
@@ skipping 10 matching lines @@
     text-align: right;
     white-space: nowrap;
 }
 
 .timeline-details-row-data {
     white-space: nowrap;
 }
 
 .timeline-details-view {
     color: #333;
+    overflow: hidden;
 }
 
 .timeline-details-view-title {
     padding: 2px 5px;
     flex: 0 0 19px;
     border-bottom: 1px solid rgb(202, 202, 202);
     background-color: rgb(236, 236, 236);
     white-space: nowrap;
     display: flex;
     color: rgb(92, 110, 129);
     text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 .timeline-details-view-body {
     padding-top: 2px;
     flex: auto;
     overflow: auto;
     position: relative;
 }
 
 .timeline-details-view-block {
@@ skipping 37 matching lines @@
 }
 
 .timeline-memory-split {
     flex: auto;
 }
 
 .timeline-memory-split > .split-view-contents-first {
     overflow: hidden;
 }
 
-.pie-chart {
-    width: 100px;
-    height: 110px;
-}
-
-.pie-chart-background {
-    position: absolute;
-    width: 100px;
-    height: 100px;
-    border-radius: 50px;
-    background-color: rgb(248, 248, 248);
-    box-shadow: 0 1px 2px;
-}
-
-.pie-chart-foreground {
-    position: absolute;
-    width: 100px;
-    height: 100px;
-    text-align: center;
-    line-height: 100px;
-    z-index: 10;
-}
-
-.pie-chart-slice {
-    position: absolute;
-    width: 100px;
-    height: 100px;
-    border-radius: 50px;
-    clip: rect(0px, 100px, 100px, 50px);
-}
-
-.pie-chart-slice-inner {
-    position: absolute;
-    width: 100px;
-    height: 100px;
-    border-radius: 50px;
-    clip: rect(0px, 50px, 100px, 0px);
-}
-
 .timeline-aggregated-info {
     flex: none;
     position: relative;
     margin: 8px 2px;
-    width: 160px;
+    width: 200px;
 }
 
 .timeline-aggregated-info-legend > div {
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
 }
 
 .timeline-aggregated-info .pie-chart {
     margin-left: 20px;
+    margin-bottom: 10px;
 }
+
+.timeline-flamechart-view #timeline-overview-grid {
+    display: none;
+}
+
+.timeline-flamechart-view .flame-chart-main-pane .resources-divider-label {
+    text-align: center;
+}
+
+.timeline-flamechart {
+    overflow: hidden;
+}
+
+.timeline-progress-pane {
+    position: absolute;
+    top: 0px;
+    right: 0px;
+    bottom: 0px;
+    left: 0px;
+    color: #777;
+    background-color: rgba(255, 255, 255, 0.8);
+    font-size: 30px;
+    z-index: 500;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}