1 /* vim:set ts=2 sw=2 sts=2 et: */
2 /* This Source Code Form is subject to the terms of the Mozilla Public
3 * License, v. 2.0. If a copy of the MPL was not distributed with this
4 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
6 /* LCARS-specific rules that should be limited to toolbox but there's no other place to put them */
15 /* End LCARStrek toolbox rules */
20 font: 12px "Liberation Mono", Consolas, "Courier New", monospace;
25 .devtools-horizontal-splitter {
31 #devtools-side-splitter {
40 /* In-tools sidebar */
42 .devtools-toolbox-side-iframe {
46 /* === BEGIN common.inc.css === */
48 /* Autocomplete Popup */
49 /* Dark and light theme */
51 .devtools-autocomplete-popup {
57 .devtools-autocomplete-listbox {
58 background-color: transparent;
59 border-width: 0px !important;
62 .devtools-autocomplete-listbox > richlistitem,
63 .devtools-autocomplete-listbox > richlistitem[selected] {
65 background-color: transparent;
69 .devtools-autocomplete-listbox.dark-theme > richlistitem[selected],
70 .devtools-autocomplete-listbox.dark-theme > richlistitem:hover {
71 /* background-color: rgba(0,0,0,0.5); */
74 .devtools-autocomplete-listbox.dark-theme > richlistitem[selected] > .autocomplete-value,
75 .devtools-autocomplete-listbox:focus.dark-theme > richlistitem[selected] > .initial-value {
76 /* color: hsl(208,100%,60%);*/
79 .devtools-autocomplete-listbox.dark-theme > richlistitem[selected] > label {
83 .devtools-autocomplete-listbox.dark-theme > richlistitem > label {
87 .devtools-autocomplete-listbox > richlistitem > .initial-value,
88 .devtools-autocomplete-listbox > richlistitem > .autocomplete-value {
93 .devtools-autocomplete-listbox > richlistitem > .autocomplete-count {
97 /* Rest of the dark and light theme */
99 .devtools-autocomplete-popup,
101 .CodeMirror-Tern-tooltip {
102 border: 1px solid #FF9F00;
103 background-color: #000000;
106 .devtools-autocomplete-popup.light-theme {
109 .devtools-autocomplete-listbox.light-theme > richlistitem[selected],
110 .devtools-autocomplete-listbox.light-theme > richlistitem:hover {
111 /* background-color: rgba(128,128,128,0.3); */
114 .devtools-autocomplete-listbox.light-theme > richlistitem[selected] > .autocomplete-value,
115 .devtools-autocomplete-listbox:focus.light-theme > richlistitem[selected] > .initial-value {
119 .devtools-autocomplete-listbox.light-theme > richlistitem > label {
123 /* Responsive container */
125 .devtools-responsive-container {
126 -moz-box-orient: horizontal;
129 @media (max-width: 700px) {
130 .devtools-responsive-container {
131 -moz-box-orient: vertical;
134 .devtools-responsive-container > .devtools-side-splitter {
139 /* In some edge case the cursor is not changed to n-resize */
143 .devtools-responsive-container > .devtools-sidebar-tabs {
149 /* Tooltip widget (see browser/devtools/shared/widgets/Tooltip.js) */
151 .devtools-tooltip.devtools-tooltip-tooltip {
152 /* If the tooltip uses a <tooltip> XUL element */
158 .devtools-tooltip .panel-arrowcontent {
159 /* If the tooltip uses a <panel> XUL element instead */
163 .devtools-tooltip .panel-arrowcontainer {
164 /* Reseting the transition used when panels are shown */
166 /* Panels slide up/down/left/right when they appear using a transform.
167 Since we want to remove the transition, we don't need to transform anymore
168 plus it can interfeer by causing mouseleave events on the underlying nodes */
172 .devtools-tooltip[clamped-dimensions] {
178 .devtools-tooltip[clamped-dimensions-no-min-height] {
184 .devtools-tooltip[clamped-dimensions-no-max-or-min-height] {
188 .devtools-tooltip[clamped-dimensions] .panel-arrowcontent,
189 .devtools-tooltip[clamped-dimensions-no-min-height] .panel-arrowcontent,
190 .devtools-tooltip[clamped-dimensions-no-max-or-min-height] .panel-arrowcontent {
193 .devtools-tooltip[wide] {
197 /* Tooltip: Simple Text */
199 .devtools-tooltip-simple-text {
202 margin: 0 -4px; /* Compensate for the .panel-arrowcontent padding. */
204 white-space: pre-wrap;
207 .devtools-tooltip-simple-text:first-child {
211 .devtools-tooltip-simple-text:last-child {
215 .devtools-tooltip-simple-text {
216 background-color: #000000;
218 margin: 0 -4px; /* Compensate for the .panel-arrowcontent padding. */
220 white-space: pre-wrap;
223 .devtools-tooltip-simple-text:first-child {
227 .devtools-tooltip-simple-text:last-child {
231 /* Tooltip: Alert Icon */
233 .devtools-tooltip-alert-icon {
237 -moz-margin-end: 20px;
240 .devtools-tooltip-alert-icon {
241 list-style-image: url("chrome://global/skin/icons/alert-exclam.gif");
244 /* Tooltip: Variables View */
246 .devtools-tooltip-variables-view-box {
247 margin: -4px; /* Compensate for the .panel-arrowcontent padding. */
250 .devtools-tooltip-variables-view-box .variable-or-property > .title {
251 -moz-padding-end: 6px;
256 .devtools-tooltip-tiles {
257 background-color: #A09090;
258 background-image: linear-gradient(45deg, #9C9CFF 25%, transparent 25%, transparent 75%, #9C9CFF 75%, #9C9CFF),
259 linear-gradient(45deg, #9C9CFF 25%, transparent 25%, transparent 75%, #9C9CFF 75%, #9C9CFF);
260 background-size: 20px 20px;
261 background-position: 0 0, 10px 10px;
264 .devtools-tooltip-iframe {
266 background: transparent;
269 /* Eyedropper Widget */
271 .devtools-eyedropper-panel {
272 pointer-events: none;
273 -moz-appearance: none;
276 background-color: transparent;
280 /* === END common.inc.css === */