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