X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fdevtools%2Fperformance.css;fp=LCARStrek%2Fdevtools%2Fperformance.css;h=0000000000000000000000000000000000000000;hp=c60aa5200a5ca65403d6e735e3da5e8b8218d1df;hb=bdb9f97982138845069e66497bea0e2c4d0fe455;hpb=b1d1a8bbaca0a31b2c2581911368b6892d447718 diff --git a/LCARStrek/devtools/performance.css b/LCARStrek/devtools/performance.css deleted file mode 100644 index c60aa520..00000000 --- a/LCARStrek/devtools/performance.css +++ /dev/null @@ -1,680 +0,0 @@ -/* vim:set ts=2 sw=2 sts=2 et: */ -/* 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/. */ - -/* CSS Variables specific to this panel that aren't defined by the themes */ -.theme-dark, -.theme-light { - --cell-border-color: #A09090; - --cell-border-color-light: #A09090; - --focus-cell-border-color: #9C9CFF; - --row-alt-background-color: #403400; - --row-hover-background-color: #544400; -} - -/* - * DE-XUL: Set a sidebar width because inline XUL components will cause the flex - * to overflow if dynamically sized. - */ -.performance-tool { - --sidebar-width: 185px; -} - -/** - * A generic class to hide elements, replacing the `element.hidden` attribute - * that we use to hide elements that can later be active - */ -.hidden { - display: none; - width: 0px; - height: 0px; -} - -/* Toolbar */ - -#performance-toolbar-control-other { - padding-inline-end: 5px; -} - -#performance-toolbar-controls-detail-views .toolbarbutton-text { - padding-inline-start: 4px; - padding-inline-end: 8px; -} - -#filter-button { - list-style-image: url(images/filter.svg); -} - -#performance-filter-menupopup > menuitem .menu-iconic-left::after { - content: ""; - display: block; - width: 8px; - height: 8px; - margin: 0 8px; - border-radius: 1px; -} - -/* Details panel buttons */ - -#select-waterfall-view { - list-style-image: url(images/performance-icons.svg#details-waterfall); -} - -#select-js-calltree-view, -#select-memory-calltree-view { - list-style-image: url(images/performance-icons.svg#details-call-tree); -} - -#select-js-flamegraph-view, -#select-memory-flamegraph-view { - list-style-image: url(images/performance-icons.svg#details-flamegraph); -} - -#select-optimizations-view { - list-style-image: url(images/profiler-stopwatch.svg); -} - -/* Recording buttons */ - -#recordings-controls { -/* background-color: #9C9CFF;*/ - display: flex; -} - -#recording-controls-mount, -#recording-controls-mount > div, -#recording-controls-mount > div > .devtools-toolbar { - display: flex; - flex: 1 1 auto; -} - -#clear-button::before { - background-image: var(--clear-icon-url); -} - -#main-record-button::before { - background-image: url(images/profiler-stopwatch-tbutton.svg); -} - -#import-button::before { - background-image: url(images/import.svg); -} - -#main-record-button .button-icon, #import-button .button-icon { - margin: 0; -} - -#main-record-button .button-text, #import-button .button-text { - display: none; -} - -#main-record-button .button-icon { - margin: 0; -} - -#main-record-button .button-text { - display: none; -} - -.notice-container .record-button { - padding: 5px !important; -} - -.notice-container .record-button.checked, -.notice-container .record-button.checked { - color: var(--theme-selection-color) !important; - background: var(--theme-selection-background) !important; -} - -/* Sidebar & recording items */ - -#recordings-pane { - border-inline-end: 1px solid var(--theme-splitter-color); - width: var(--sidebar-width); -} - -#recording-controls-mount { - width: var(--sidebar-width); -} - -#recording-controls-mount > div { - width: var(--sidebar-width); -} - -/* - * DE-XUL: The height of the toolbar is not correct without tweaking the line-height. - */ -#recordings-pane .devtools-toolbar { - line-height: 0; -} - -#recordings-list { - max-width: 300px; -} - -.recording-item { - padding: 4px; -} - -.recording-item-title { - font-size: 110%; -} - -.recording-item-footer { - padding-top: 4px; - font-size: 90%; -} - -.recording-item-save { - text-decoration: underline; - cursor: pointer; -} - -.recording-item-duration, -.recording-item-save { - color: var(--theme-body-color-alt); -} - -#recordings-list .selected label { - /* Text inside a selected item should not be custom colored. */ - color: inherit !important; -} - -/* Recording notices */ - -.notice-container { - font-size: 120%; - background-color: var(--theme-body-background); - color: var(--theme-body-color); - padding-bottom: 20vh; -} - -.tool-disabled-message { - text-align: center; -} - -.console-profile-recording-notice, -.console-profile-stop-notice { - overflow: hidden; -} - -.console-profile-command { - font-family: monospace; - margin: 3px 2px; -} - -.realtime-disabled-message, -.realtime-disabled-on-e10s-message { - display: none; -} - -#performance-view[e10s="disabled"] .realtime-disabled-on-e10s-message, -#performance-view[e10s="unsupported"] .realtime-disabled-message { - display: initial; - opacity: 0.5; -} - -.buffer-status-message, -.buffer-status-message-full { - display: none; -} - -#details-pane-container[buffer-status="in-progress"] .buffer-status-message { - display: initial; - opacity: 0.5; -} - -#details-pane-container[buffer-status="full"] .buffer-status-message { - display: initial; - color: var(--theme-highlight-red); - font-weight: bold; - opacity: 1; -} - -#details-pane-container[buffer-status="full"] .buffer-status-message-full { - display: initial; -} - -/* Profile call tree */ - -.call-tree-cells-container { - overflow: auto; -} - -.call-tree-cells-container[categories-hidden] .call-tree-category { - display: none; -} - -.call-tree-header { - font-size: 90%; - padding-top: 2px !important; - padding-bottom: 2px !important; -} - -.call-tree-header[type="duration"], -.call-tree-cell[type="duration"], -.call-tree-header[type="self-duration"], -.call-tree-cell[type="self-duration"] { - min-width: 6vw; - width: 6vw; -} - -.call-tree-header[type="percentage"], -.call-tree-cell[type="percentage"], -.call-tree-header[type="self-percentage"], -.call-tree-cell[type="self-percentage"] { - min-width: 5vw; - width: 5vw; -} - -.call-tree-header[type="samples"], -.call-tree-cell[type="samples"] { - min-width: 4.5vw; - width: 4.5vw; -} - -.call-tree-header[type="count"], -.call-tree-cell[type="count"], -.call-tree-header[type="self-count"], -.call-tree-cell[type="self-count"], -.call-tree-header[type="size"], -.call-tree-cell[type="size"], -.call-tree-header[type="self-size"], -.call-tree-cell[type="self-size"], -.call-tree-header[type="count-percentage"], -.call-tree-cell[type="count-percentage"], -.call-tree-header[type="self-count-percentage"], -.call-tree-cell[type="self-count-percentage"], -.call-tree-header[type="size-percentage"], -.call-tree-cell[type="size-percentage"], -.call-tree-header[type="self-size-percentage"], -.call-tree-cell[type="self-size-percentage"] { - min-width: 6vw; - width: 6vw; -} - -.call-tree-header, -.call-tree-cell { - -moz-box-align: center; - overflow: hidden; - text-overflow: ellipsis; - padding: 1px 4px; - color: var(--theme-body-color); - border-inline-end-color: var(--cell-border-color); -} - -.call-tree-header:not(:last-child), -.call-tree-cell:not(:last-child) { - border-inline-end-width: 1px; - border-inline-end-style: solid; -} - -.call-tree-header:not(:last-child) { - text-align: center; -} - -.call-tree-cell:not(:last-child) { - text-align: end; -} - -.call-tree-header { - background-color: var(--theme-tab-toolbar-background); -} - -.call-tree-item .call-tree-cell, -.call-tree-item .call-tree-cell[type=function] description { - -moz-user-select: text; - /* so that optimizations view doesn't break the lines in call tree */ - white-space: nowrap; -} - -.call-tree-item .call-tree-cell::-moz-selection, -.call-tree-item .call-tree-cell[type=function] description::-moz-selection { - background-color: var(--theme-highlight-orange); -} - -.call-tree-item:last-child { - border-bottom: 1px solid var(--cell-border-color); -} - -.call-tree-item:nth-child(2n) { - background-color: var(--row-alt-background-color); -} - -.call-tree-item:hover { - background-color: var(--row-hover-background-color); -} - -.call-tree-item:focus { - background-color: var(--theme-selection-background); -} - -.call-tree-item:focus description { - color: var(--theme-selection-color) !important; -} - -.call-tree-item:focus .call-tree-cell { - border-inline-end-color: var(--focus-cell-border-color); -} - -.call-tree-item:not([origin="content"]) .call-tree-name, -.call-tree-item:not([origin="content"]) .call-tree-url, -.call-tree-item:not([origin="content"]) .call-tree-line, -.call-tree-item:not([origin="content"]) .call-tree-column { - /* Style chrome and non-JS nodes differently. */ - opacity: 0.6; -} - -.call-tree-name { - margin-inline-end: 4px !important; -} - -.call-tree-url { - cursor: pointer; -} - -.call-tree-url:hover { - text-decoration: underline; -} - -.call-tree-url, .tree-widget-item:not(.theme-selected) .opt-url { - color: var(--theme-highlight-blue); -} - -.call-tree-line, .tree-widget-item:not(.theme-selected) .opt-line { - color: var(--theme-highlight-orange); -} - -.call-tree-column { - color: var(--theme-highlight-orange); - opacity: 0.6; -} - -.call-tree-host { - margin-inline-start: 8px !important; - font-size: 90%; - color: var(--theme-content-color2); -} - -.call-tree-category { - transform: scale(0.75); - transform-origin: center right; -} - -/** - * Waterfall ticks header - */ - -.waterfall-header-ticks { - overflow: hidden; -} - -.waterfall-header-name { - padding: 2px 4px; - font-size: 90%; -} - -.waterfall-header-tick { - width: 100px; - font-size: 9px; - transform-origin: left center; - color: var(--theme-body-color); -} - -.waterfall-header-tick:not(:first-child) { - margin-inline-start: -100px !important; /* Don't affect layout. */ -} - -.waterfall-background-ticks { - /* Background created on a in js. */ - /* @see devtools/client/timeline/widgets/waterfall.js */ - background-image: -moz-element(#waterfall-background); - background-repeat: repeat-y; - background-position: -1px center; -} - -/** - * Markers waterfall breakdown - */ - -#waterfall-breakdown { - overflow-x: hidden; - overflow-y: auto; -} - -.waterfall-tree-item:not([level="0"]) { - background-image: repeating-linear-gradient( - -45deg, - transparent 0px, - transparent 2px, - rgba(255,255,255,0.05) 2px, - rgba(255,255,255,0.05) 4px - ); -} - -.waterfall-tree-item[expandable] .waterfall-marker-bullet, -.waterfall-tree-item[expandable] .waterfall-marker-bar { - background-image: repeating-linear-gradient( - -45deg, - transparent 0px, - transparent 5px, - rgba(0,0,0,0.35) 5px, - rgba(0,0,0,0.35) 10px - ); -} - -.waterfall-tree-item[expanded], -.waterfall-tree-item:not([level="0"]) + .waterfall-tree-item[level="0"] { - box-shadow: 0 -1px var(--cell-border-color-light); -} - -.waterfall-tree-item:nth-child(2n) > .waterfall-marker { - background-color: var(--row-alt-background-color); -} - -.waterfall-tree-item:hover { - background-color: var(--row-hover-background-color); -} - -.waterfall-tree-item:last-child { - border-bottom: 1px solid var(--cell-border-color); -} - -.waterfall-tree-item:focus { - background-color: var(--theme-selection-background); -} - -.waterfall-tree-item:focus description { - color: var(--theme-selection-color) !important; -} - -/** - * Marker left sidebar - */ - -.waterfall-sidebar { - border-inline-end: 1px solid var(--cell-border-color); -} - -.waterfall-tree-item > .waterfall-sidebar:hover, -.waterfall-tree-item:hover > .waterfall-sidebar, -.waterfall-tree-item:focus > .waterfall-sidebar { - background: transparent; -} - -.waterfall-marker-bullet { - width: 8px; - height: 8px; - margin-inline-start: 8px; - margin-inline-end: 6px; - border-radius: 1px; -} - -.waterfall-marker-name { - font-size: 95%; - padding-bottom: 1px !important; -} - -/** - * Marker timebar - */ - -.waterfall-marker { - overflow: hidden; -} - -.waterfall-marker-bar { - height: 9px; - transform-origin: left center; - border-radius: 1px; -} - -.waterfall-marker > .theme-twisty { - /* Don't affect layout. */ - width: 14px; - margin-inline-end: -14px; -} - -/** - * OTMT markers - */ - -.waterfall-tree-item[otmt=true] .waterfall-marker-bullet, -.waterfall-tree-item[otmt=true] .waterfall-marker-bar { - background-color: transparent; - border-width: 1px; - border-style: solid; -} - -/** - * Marker details view - */ - -#waterfall-details { - padding-inline-start: 8px; - padding-inline-end: 8px; - padding-top: 2vh; - overflow: auto; - min-width: 50px; -} - -#waterfall-details > * { - padding-top: 3px; -} - -.marker-details-bullet { - width: 8px; - height: 8px; - border-radius: 1px; -} - -.marker-details-name-label { - padding-inline-end: 4px; -} - -.marker-details-type { - font-size: 1.2em; - font-weight: bold; -} - -.marker-details-duration { - font-weight: bold; -} - -.marker-details-customcontainer .custom-button { - padding: 2px 5px; - border-width: 1px; -} - -/** - * Marker colors - */ - -menuitem.marker-color-graphs-full-red .menu-iconic-left::after, -.marker-color-graphs-full-red { - background-color: var(--theme-graphs-full-red); - border-color: var(--theme-graphs-full-red); -} -menuitem.marker-color-graphs-full-blue .menu-iconic-left::after, -.marker-color-graphs-full-blue { - background-color: var(--theme-graphs-full-blue); - border-color: var(--theme-graphs-full-blue); -} -menuitem.marker-color-graphs-green .menu-iconic-left::after, -.marker-color-graphs-green { - background-color: var(--theme-graphs-green); - border-color: var(--theme-graphs-green); -} -menuitem.marker-color-graphs-blue .menu-iconic-left::after, -.marker-color-graphs-blue { - background-color: var(--theme-graphs-blue); - border-color: var(--theme-graphs-blue); -} -menuitem.marker-color-graphs-bluegrey .menu-iconic-left::after, -.marker-color-graphs-bluegrey { - background-color: var(--theme-graphs-bluegrey); - border-color: var(--theme-graphs-bluegrey); -} -menuitem.marker-color-graphs-purple .menu-iconic-left::after, -.marker-color-graphs-purple { - background-color: var(--theme-graphs-purple); - border-color: var(--theme-graphs-purple); -} -menuitem.marker-color-graphs-yellow .menu-iconic-left::after, -.marker-color-graphs-yellow { - background-color: var(--theme-graphs-yellow); - border-color: var(--theme-graphs-yellow); -} -menuitem.marker-color-graphs-orange .menu-iconic-left::after, -.marker-color-graphs-orange { - background-color: var(--theme-graphs-orange); - border-color: var(--theme-graphs-orange); -} -menuitem.marker-color-graphs-red .menu-iconic-left::after, -.marker-color-graphs-red { - background-color: var(--theme-graphs-red); - border-color: var(--theme-graphs-red); -} -menuitem.marker-color-graphs-grey .menu-iconic-left::after, -.marker-color-graphs-grey{ - background-color: var(--theme-graphs-grey); - border-color: var(--theme-graphs-grey); -} - -/** - * Configurable Options - * - * Elements can be tagged with a class and visibility is controlled via a - * preference being applied or removed. - */ - -/** - * devtools.performance.ui.experimental - */ -menuitem.experimental-option::before { - content: ""; - background-image: url(chrome://devtools/skin/images/webconsole.svg); - background-repeat: no-repeat; - background-size: 72px 60px; - width: 12px; - height: 12px; - display: inline-block; - - background-position: -24px -24px; - margin: 2px 5px 0 0; - max-height: 12px; -} - -#performance-options-menupopup:not(.experimental-enabled) .experimental-option, -#performance-options-menupopup:not(.experimental-enabled) .experimental-option::before { - display: none; -} - -/* for call tree */ -description.opt-icon { - margin: 0px 0px 0px 0px; -} -description.opt-icon::before { - margin: 1px 4px 0px 0px; -}