LCARStrek/devtools/inspector.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 window {
   6   padding: 0;
   7 }
   8
   9 #inspector-toolbar {
  10   border-top: none;
  11 }
  12
  13 #inspector-searchlabel {
  14   overflow: hidden;
  15 }
  16
  17 #inspector-breadcrumbs-toolbar {
  18   padding: 0px;
  19   border-bottom-width: 0px;
  20   border-top-width: 1px;
  21 }
  22
  23 /* Expand/collapse panel toolbar button */
  24
  25 #inspector-pane-toggle {
  26   list-style-image: var(--theme-pane-collapse-image);
  27 }
  28
  29 #inspector-pane-toggle[pane-collapsed] {
  30   list-style-image: var(--theme-pane-expand-image);
  31 }
  32
  33 @media (max-width: 700px) {
  34   #inspector-pane-toggle > .toolbarbutton-icon {
  35     transform: rotate(90deg);
  36   }
  37 }
  38
  39 /* Add element toolbar button */
  40
  41 #inspector-element-add-button {
  42   list-style-image: url("chrome://devtools/skin/images/add.svg");
  43 }
  44
  45 /* Tooltip: Events */
  46
  47 #devtools-tooltip-events-container {
  48   margin: -4px; /* Compensate for the .panel-arrowcontent padding. */
  49   max-width: 590px;
  50   overflow-y: auto;
  51 }
  52
  53 .event-header {
  54   display: flex;
  55   align-items: center;
  56   cursor: pointer;
  57 }
  58
  59 .event-header:first-child {
  60   border-width: 0;
  61 }
  62
  63 .event-header:not(:first-child) {
  64   border-width: 1px 0 0 0;
  65 }
  66
  67 .event-tooltip-event-type,
  68 .event-tooltip-filename,
  69 .event-tooltip-attributes {
  70   margin-inline-start: 0;
  71   flex-shrink: 0;
  72   cursor: pointer;
  73 }
  74
  75 .event-tooltip-event-type {
  76   font-weight: bold;
  77   font-size: 13px;
  78 }
  79
  80 .event-tooltip-filename {
  81   margin-inline-end: 0;
  82   font-size: 100%;
  83   flex-shrink: 1;
  84 }
  85
  86 .event-tooltip-debugger-icon {
  87   width: 16px;
  88   height: 16px;
  89   margin-inline-end: 4px;
  90   opacity: 0.6;
  91   flex-shrink: 0;
  92 }
  93
  94 .event-tooltip-debugger-icon:hover {
  95   opacity: 1;
  96 }
  97
  98 .event-tooltip-content-box {
  99   display: none;
 100   height: 100px;
 101   overflow: hidden;
 102   margin-inline-end: 0;
 103   border: 1px solid var(--theme-splitter-color);
 104   border-width: 1px 0 0 0;
 105 }
 106
 107 .event-toolbox-content-box iframe {
 108   height: 100%;
 109 }
 110
 111 .event-tooltip-content-box[open] {
 112   display: block;
 113 }
 114
 115 .event-tooltip-source-container {
 116   margin-top: 5px;
 117   margin-bottom: 10px;
 118   margin-inline-start: 5px;
 119   margin-inline-end: 0;
 120 }
 121
 122 .event-tooltip-source {
 123   margin-bottom: 0;
 124 }
 125
 126 .event-tooltip-attributes-container {
 127   display: flex;
 128   flex-shrink: 0;
 129   flex-grow: 1;
 130   justify-content: flex-end;
 131 }
 132
 133 .event-tooltip-attributes-box {
 134   display: flex;
 135   flex-shrink: 0;
 136   align-items: center;
 137   border-radius: 3px;
 138   padding: 2px;
 139   margin-inline-start: 5px;
 140   background-color: var(--theme-body-color-alt);
 141   color: var(--theme-toolbar-background);
 142 }
 143
 144 .event-tooltip-attributes {
 145   margin: 0;
 146   font-size: 9px;
 147   padding-top: 2px;
 148 }