LCARStrek/browser/devtools/debugger.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 #body {
  10   background-color: #000000;
  11 }
  12
  13 /* Sources and breakpoints pane */
  14
  15 #sources-pane {
  16   min-width: 50px;
  17 }
  18
  19 #sources-and-editor-splitter {
  20   -moz-border-start-color: transparent;
  21 }
  22
  23 #sources-toolbar .devtools-toolbarbutton {
  24   min-width: 32px;
  25 }
  26
  27 #pretty-print {
  28   font-weight: bold;
  29 }
  30
  31 #black-box {
  32   list-style-image: url("debugger-blackbox.png");
  33   -moz-image-region: rect(0px, 16px, 16px, 0px);
  34 }
  35
  36 #black-box[checked],
  37 #black-box:hover {
  38   -moz-image-region: rect(0px, 32px, 16px, 16px);
  39 }
  40
  41 #sources .black-boxed {
  42   color: #8050B0;
  43 }
  44
  45 #sources .black-boxed > .dbg-breakpoint {
  46   display: none;
  47 }
  48
  49 #sources .black-boxed + .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
  50   background-image: none;
  51 /*  box-shadow: inset -1px 0 0 #222426; */
  52 }
  53
  54 #sources .black-boxed + .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
  55   background-image: none;
  56 /*  box-shadow: inset 1px 0 0 #222426; */
  57 }
  58
  59 /* Black box message and source progress meter */
  60
  61 #black-boxed-message,
  62 #source-progress-container {
  63   background-color: #A09090;
  64   /* Prevent the container deck from aquiring the height from this message. */
  65   min-height: 1px;
  66   color: #000000;
  67 }
  68
  69 #source-progress {
  70   min-height: 2em;
  71   min-width: 40em;
  72 }
  73
  74 #black-boxed-message-label,
  75 #black-boxed-message-button {
  76   text-align: center;
  77   font-size: 120%;
  78 }
  79
  80 #black-boxed-message-button {
  81   margin-top: 1em;
  82   padding: .25em;
  83 }
  84
  85 /* ListWidget items */
  86
  87 .list-widget-item {
  88   padding: 2px;
  89 }
  90
  91 .list-widget-item:not(.selected):not(.empty):hover {
  92 /*  background: linear-gradient(rgba(255,255,255,0.9), rgba(255,255,255,0.85)), Highlight;*/
  93 }
  94
  95 .list-widget-item.selected.light {
  96 /*  background: linear-gradient(rgba(255,255,255,0.85), rgba(255,255,255,0.8)), Highlight;
  97   color: #000;*/
  98 }
  99
 100 .list-widget-item.selected {
 101   background: #008484;
 102   color: #FFCF00;
 103 }
 104
 105 .list-widget-item.empty {
 106   color: #8050B0;
 107   /* padding: 4px; */
 108 }
 109
 110 /* Stack frames view */
 111
 112 #stackframes {
 113   min-height: 25px;
 114 }
 115
 116 .dbg-stackframe-details {
 117   -moz-padding-start: 4px;
 118 }
 119
 120 .dbg-stackframe-menuitem[checked] {
 121   margin-top: 3px;
 122   margin-bottom: 3px;
 123   outline: 1px solid #008484;
 124   font-weight: 600;
 125 }
 126
 127 .dbg-stackframe-menuitem-details {
 128   -moz-padding-start: 16px;
 129 }
 130
 131 /* Sources and breakpoints view */
 132
 133 .dbg-breakpoint {
 134   -moz-margin-start: 4px;
 135 }
 136
 137 .dbg-breakpoint-line {
 138   font-weight: 600;
 139 }
 140
 141 .dbg-breakpoint-text {
 142   -moz-margin-start: 10px !important;
 143   font-style: italic;
 144   font-size: 90%;
 145 }
 146
 147 .dbg-breakpoint-checkbox {
 148   width: 16px;
 149   height: 16px;
 150   margin: 2px;
 151 }
 152
 153 /* Instruments pane (watch expressions, variables, event listeners...) */
 154
 155 #instruments-pane > tabs > tab {
 156   min-height: 25px !important;
 157   padding: 0 !important;
 158 }
 159
 160 #instruments-pane > tabpanels > tabpanel {
 161   background: #000000;
 162 }
 163
 164 /* Watch expressions view */
 165
 166 #expressions {
 167   min-height: 10px;
 168   max-height: 125px;
 169 }
 170
 171 .dbg-expression {
 172   height: 20px;
 173 }
 174
 175 .dbg-expression-arrow {
 176   width: 16px;
 177   height: auto;
 178   background: -moz-image-rect(url("commandline-icon.png"), 0, 32, 16, 16);
 179 }
 180
 181 .dbg-expression-input {
 182   -moz-padding-start: 2px !important;
 183 }
 184
 185 /* Event listeners view */
 186
 187 .dbg-event-listener {
 188   padding: 4px 8px;
 189 }
 190
 191 .dbg-event-listener-type {
 192   font-weight: 600;
 193 }
 194
 195 .dbg-event-listener-separator {
 196   color: #A09090;
 197 }
 198
 199 .dbg-event-listener-targets {
 200   color: #9C9CFF;
 201 }
 202
 203 .dbg-event-listener-location {
 204   color: #E7ADE7;
 205 }
 206
 207 /* Searchbox and the search operations help panel */
 208
 209 .devtools-searchinput {
 210   min-width: 220px;
 211   -moz-margin-start: 1px;
 212 }
 213
 214 #filter-label {
 215   -moz-margin-start: 2px;
 216 }
 217
 218 #searchbox-panel-operators {
 219   margin-top: 5px;
 220   margin-bottom: 8px;
 221   -moz-margin-start: 2px;
 222 }
 223
 224 .searchbox-panel-operator-button {
 225   min-width: 26px;
 226   margin-top: 0;
 227   margin-bottom: 0;
 228   -moz-margin-start: 2px;
 229   -moz-margin-end: 6px;
 230   text-align: center;
 231 }
 232
 233 .searchbox-panel-operator-label {
 234   padding-bottom: 2px;
 235 }
 236
 237 /* Searchbox results panel */
 238
 239 .results-panel {
 240   padding: 4px;
 241 }
 242
 243 .results-panel-item {
 244   border: 1px solid #A09090;
 245   border-top-color: #8050B0;
 246   padding: 5px;
 247   cursor: pointer;
 248 }
 249
 250 .results-panel-item:first-of-type {
 251   border-top-color: #9C9CFF;
 252   border-radius: 4px 4px 0 0;
 253 }
 254
 255 .results-panel-item:last-of-type {
 256   border-radius: 0 0 4px 4px;
 257 }
 258
 259 .results-panel-item:only-of-type {
 260   border-radius: 4px;
 261 }
 262
 263 .results-panel-item:not(.selected):not(:hover) {
 264 /*  text-shadow: 0 1px #fff;*/
 265 }
 266
 267 .results-panel-item-pre {
 268   -moz-margin-end: 5px !important;
 269   color: #A09090;
 270   cursor: inherit;
 271 }
 272
 273 .results-panel-item-name {
 274   color: #9C9CFF;
 275   font-weight: 600;
 276   cursor: inherit;
 277 }
 278
 279 .results-panel-item-details {
 280   color: #FF9F00;
 281   cursor: inherit;
 282 }
 283
 284 /* Sources search view */
 285
 286 #globalsearch {
 287   min-height: 10px;
 288 }
 289
 290 #globalsearch > vbox:not(:empty) {
 291   min-height: 10px;
 292   max-height: 125px;
 293 }
 294
 295 #globalsearch + .devtools-horizontal-splitter {
 296   -moz-border-top-colors: #9C9CFF;
 297 }
 298
 299 .dbg-source-results {
 300   padding: 0;
 301   background: none !important;
 302 }
 303
 304 .dbg-results-header {
 305   -moz-padding-start: 6px;
 306 }
 307
 308 .dbg-results-header-location {
 309   font-weight: 600;
 310 }
 311
 312 .dbg-results-header-match-count {
 313   -moz-padding-start: 6px;
 314   color: #8050B0;
 315 }
 316
 317 .dbg-results-line-number {
 318   background: #000000;
 319   min-width: 40px;
 320   -moz-border-end: 1px solid #9C9CFF;
 321   -moz-padding-end: 4px;
 322   padding-top: 2px;
 323   text-align: end;
 324   color: #FF9F00;
 325 }
 326
 327 .dbg-results-line-contents {
 328   -moz-padding-start: 4px;
 329   padding-top: 1px;
 330   padding-bottom: 1px;
 331 }
 332
 333 .dbg-results-line-contents-string {
 334   padding: 1px;
 335 }
 336
 337 .dbg-results-line-contents-string[match=true] {
 338   background: #E7ADE7;
 339   color: #000000;
 340   padding: 0;
 341   border: 1px solid #9C9CFF;
 342   border-radius: 4px;
 343   cursor: pointer;
 344 }
 345
 346 .dbg-results-line-contents-string[match=true][focusing] {
 347   transition: transform 0.3s ease-in-out;
 348 }
 349
 350 .dbg-results-line-contents-string[match=true][focused] {
 351   transition-duration: 0.1s;
 352   transform: scale(1.75, 1.75);
 353 }
 354
 355 /* Toolbar controls */
 356
 357 #toggle-panes {
 358   list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
 359   -moz-image-region: rect(0px, 16px, 16px, 0px);
 360 }
 361
 362 #toggle-panes:not([panesHidden]) {
 363   list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png");
 364 }
 365
 366 #toggle-panes:hover,
 367 #toggle-panes:hover:active {
 368   -moz-image-region: rect(0px, 32px, 16px, 16px);
 369 }
 370
 371 #resumption-panel-desc {
 372   width: 200px;
 373 }
 374
 375 #resumption-order-panel {
 376   -moz-margin-start: -8px;
 377 }
 378
 379 #resume {
 380   list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
 381   -moz-image-region: rect(0px, 16px, 16px, 0px);
 382 }
 383
 384 #resume[checked=true],
 385 #resume:hover {
 386   -moz-image-region: rect(0px, 32px, 16px, 16px);
 387 }
 388
 389 #step-over {
 390   list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png");
 391   -moz-image-region: rect(0px, 16px, 16px, 0px);
 392 }
 393 #step-over:hover {
 394   -moz-image-region: rect(0px, 32px, 16px, 16px);
 395 }
 396
 397 #step-in {
 398   list-style-image: url("chrome://browser/skin/devtools/debugger-step-in.png");
 399   -moz-image-region: rect(0px, 16px, 16px, 0px);
 400 }
 401 #step-in:hover {
 402   -moz-image-region: rect(0px, 32px, 16px, 16px);
 403 }
 404
 405 #step-out {
 406   list-style-image: url("chrome://browser/skin/devtools/debugger-step-out.png");
 407   -moz-image-region: rect(0px, 16px, 16px, 0px);
 408 }
 409 #step-out:hover {
 410   -moz-image-region: rect(0px, 32px, 16px, 16px);
 411 }
 412
 413 #debugger-controls > toolbarbutton,
 414 #sources-controls > toolbarbutton {
 415 }
 416
 417 #debugger-controls > toolbarbutton:last-of-type,
 418 #sources-controls > toolbarbutton:last-of-type {
 419 }
 420
 421 #debugger-controls,
 422 #sources-controls {
 423 }
 424
 425 #instruments-pane-toggle {
 426 /*  background: none;
 427   box-shadow: none;
 428   border: none; */
 429   list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png");
 430   -moz-image-region: rect(0px,16px,16px,0px);
 431 }
 432
 433 #instruments-pane-toggle[pane-collapsed] {
 434   list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
 435 }
 436
 437 #instruments-pane-toggle:hover,
 438 #instruments-pane-toggle:hover:active {
 439   -moz-image-region: rect(0px,32px,16px,16px);
 440 }
 441
 442 /* Horizontal vs. vertical layout */
 443
 444 #vertical-layout-panes-container {
 445   min-height: 35vh;
 446   max-height: 80vh;
 447 }
 448
 449 #body[layout=vertical] #instruments-pane {
 450   margin: 0 !important;
 451   /* To prevent all the margin hacks to hide the sidebar. */
 452 }
 453
 454 #body[layout=vertical] .side-menu-widget-container {
 455   box-shadow: none !important;
 456 }
 457
 458 #body[layout=vertical] .side-menu-widget-item-arrow {
 459   background-image: none !important;
 460 }