1 files changed, 271 insertions, 0 deletions
diff --git a/toolkit/content/aboutTelemetry.css b/toolkit/content/aboutTelemetry.css
new file mode 100644
index 000000000..6acf82c20
--- /dev/null
+++ b/toolkit/content/aboutTelemetry.css
@@ -0,0 +1,271 @@
+/* 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;
+}