mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-01-26 23:23:33 +00:00
19f41c6e99
Throw some process selectors in the Histograms and Keyed Histograms sections to allow users to choose which process type's histograms they'd like to see.
272 lines
3.8 KiB
CSS
272 lines
3.8 KiB
CSS
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
html {
|
|
background-color: -moz-Dialog;
|
|
color: -moz-DialogText;
|
|
font: message-box;
|
|
}
|
|
|
|
body {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
h2 {
|
|
font-size: medium;
|
|
}
|
|
|
|
#page-description {
|
|
border: 1px solid threedshadow;
|
|
margin: 0px;
|
|
padding: 10px;
|
|
}
|
|
|
|
#settings {
|
|
border: 1px solid lightgrey;
|
|
padding: 5px;
|
|
}
|
|
|
|
.description-enabled,
|
|
.description-disabled {
|
|
margin: 0px;
|
|
}
|
|
|
|
.description-enabled > span {
|
|
color: green;
|
|
}
|
|
|
|
.description-disabled > span {
|
|
color: red;
|
|
}
|
|
|
|
#ping-picker {
|
|
margin-top: 10px;
|
|
border: 1px solid lightgrey;
|
|
padding: 5px;
|
|
}
|
|
|
|
#ping-source-picker {
|
|
margin-left: 5px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.data-section,
|
|
.data-subsection {
|
|
background-color: -moz-Field;
|
|
color: -moz-FieldText;
|
|
border-top: 1px solid threedshadow;
|
|
border-bottom: 1px solid threedshadow;
|
|
margin: 0px;
|
|
padding: 10px;
|
|
}
|
|
|
|
.data-section:not(.has-data),
|
|
.data-subsection:not(.has-subdata) {
|
|
color: gray;
|
|
}
|
|
|
|
|
|
.section-name {
|
|
font-size: x-large;
|
|
display: inline;
|
|
}
|
|
|
|
.has-data .section-name {
|
|
cursor: pointer;
|
|
}
|
|
|
|
|
|
.toggle-caption {
|
|
font-style: italic;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.data-section:not(.has-data) .toggle-caption,
|
|
.data-subsection:not(.has-subdata) .toggle-caption {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.empty-caption {
|
|
font-style: italic;
|
|
}
|
|
|
|
.has-data .empty-caption,
|
|
.has-subdata .empty-caption {
|
|
display: none; /* invisible when has-data */
|
|
}
|
|
|
|
.data,
|
|
.subdata {
|
|
margin: 15px;
|
|
display: none;
|
|
}
|
|
|
|
.has-data.expanded .data,
|
|
.has-subdata.expanded .subdata {
|
|
display: block;
|
|
}
|
|
|
|
|
|
.stack-title {
|
|
font-size: medium;
|
|
font-weight: bold;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
#histograms, #addon-histograms, #thread-hang-stats>div {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.histogram {
|
|
float: left;
|
|
border: 1px solid gray;
|
|
white-space: nowrap;
|
|
padding: 10px;
|
|
position: relative; /* required for position:absolute of the contained .copy-node */
|
|
}
|
|
|
|
body[dir="rtl"] .histogram {
|
|
float: right;
|
|
}
|
|
|
|
.histogram-title {
|
|
text-overflow: ellipsis;
|
|
width: 100%;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.keyed-histogram {
|
|
white-space: nowrap;
|
|
padding: 15px;
|
|
position: relative; /* required for position:absolute of the contained .copy-node */
|
|
display: block;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.keyed-histogram-title {
|
|
text-overflow: ellipsis;
|
|
width: 100%;
|
|
margin: 10px;
|
|
font-weight: bold;
|
|
font-size: 120%;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
|
|
.bar {
|
|
width: 2em;
|
|
margin: 2px;
|
|
text-align: center;
|
|
float: left;
|
|
font-family: monospace;
|
|
}
|
|
|
|
body[dir="rtl"] .bar {
|
|
float: right;
|
|
}
|
|
|
|
.bar-inner {
|
|
background-color: DeepSkyBlue;
|
|
border: 1px solid #0000b0;
|
|
}
|
|
|
|
th {
|
|
font-weight: bold;
|
|
white-space: nowrap;
|
|
text-align: left;
|
|
}
|
|
|
|
body[dir="rtl"] th {
|
|
text-align: right;
|
|
}
|
|
|
|
caption {
|
|
font-weight: bold;
|
|
white-space: nowrap;
|
|
text-align: left;
|
|
font-size: large;
|
|
}
|
|
|
|
body[dir="rtl"] caption {
|
|
text-align: right;
|
|
}
|
|
|
|
.copy-node {
|
|
visibility: hidden;
|
|
position: absolute;
|
|
bottom: 1px;
|
|
right: 1px;
|
|
}
|
|
|
|
body[dir="rtl"] .copy-node {
|
|
left: 1px;
|
|
}
|
|
|
|
.histogram:hover .copy-node {
|
|
visibility: visible;
|
|
}
|
|
|
|
|
|
.statebox {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.filter-ui {
|
|
padding-inline-start: 10em;
|
|
display: none;
|
|
}
|
|
|
|
.has-data.expanded .filter-ui {
|
|
display: inline;
|
|
}
|
|
|
|
.processes-ui {
|
|
display: none;
|
|
}
|
|
|
|
.has-data.expanded .processes-ui {
|
|
display: initial;
|
|
}
|
|
|
|
.filter-blocked {
|
|
display: none;
|
|
}
|
|
|
|
#raw-ping-data-section {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color:-moz-Dialog;
|
|
}
|
|
|
|
#raw-ping-data {
|
|
background-color:white;
|
|
margin: 0px;
|
|
}
|
|
|
|
#hide-raw-ping {
|
|
float: right;
|
|
cursor: pointer;
|
|
font-size: 20px;
|
|
background-color:#d8d8d8;
|
|
padding: 5px 10px;
|
|
}
|
|
|
|
/* addon subsection style */
|
|
.addon-caption {
|
|
font-size: larger;
|
|
margin: 5px 0;
|
|
}
|
|
|
|
.process-picker {
|
|
margin: 0 0.5em;
|
|
}
|