The Tor Browser / file comparison
comparison: browser/themes/shared/devtools/debugger.inc.css
browser/themes/shared/devtools/debugger.inc.css
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:9894163a93e4 |
|---|---|
| 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/. */ | |
| 5 | |
| 6 /* Sources and breakpoints pane */ | |
| 7 | |
| 8 #sources-pane[selectedIndex="0"] + #sources-and-editor-splitter { | |
| 9 border-color: transparent; | |
| 10 } | |
| 11 | |
| 12 #sources-pane > tabs { | |
| 13 -moz-border-end: 1px solid; | |
| 14 } | |
| 15 | |
| 16 #sources-pane .devtools-toolbar { | |
| 17 border: none; /* Remove the devtools-toolbar bottom border. */ | |
| 18 -moz-border-end: 1px solid; | |
| 19 } | |
| 20 | |
| 21 .theme-dark #sources-pane > tabs, | |
| 22 .theme-dark #sources-pane .devtools-toolbar { | |
| 23 -moz-border-end-color: black; /* Match the splitter color. */ | |
| 24 } | |
| 25 | |
| 26 .theme-light #sources-pane > tabs, | |
| 27 .theme-light #sources-pane .devtools-toolbar { | |
| 28 -moz-border-end-color: #aaa; /* Match the splitter color. */ | |
| 29 } | |
| 30 | |
| 31 /* Sources and breakpoints list */ | |
| 32 | |
| 33 .dbg-source-item { | |
| 34 padding: 2px 0px; | |
| 35 } | |
| 36 | |
| 37 .dbg-breakpoint-line { | |
| 38 font-weight: 600; | |
| 39 } | |
| 40 | |
| 41 .dbg-breakpoint-text { | |
| 42 -moz-padding-start: 6px; | |
| 43 font-style: italic; | |
| 44 font-size: 90%; | |
| 45 } | |
| 46 | |
| 47 .dbg-breakpoint-checkbox { | |
| 48 width: 16px; | |
| 49 height: 16px; | |
| 50 margin: 2px; | |
| 51 } | |
| 52 | |
| 53 /* Sources toolbar */ | |
| 54 | |
| 55 #sources-toolbar > .devtools-toolbarbutton, | |
| 56 #sources-controls > .devtools-toolbarbutton { | |
| 57 min-width: 32px; | |
| 58 } | |
| 59 | |
| 60 #black-box { | |
| 61 list-style-image: url(debugger-blackbox.png); | |
| 62 } | |
| 63 | |
| 64 #pretty-print { | |
| 65 font-weight: bold; | |
| 66 } | |
| 67 | |
| 68 #toggle-breakpoints { | |
| 69 list-style-image: url(debugger-toggleBreakpoints.png); | |
| 70 } | |
| 71 | |
| 72 #sources-toolbar .devtools-toolbarbutton:not([label]) { | |
| 73 -moz-image-region: rect(0px,16px,16px,0px); | |
| 74 } | |
| 75 | |
| 76 #sources-toolbar .devtools-toolbarbutton:not([label])[checked] { | |
| 77 -moz-image-region: rect(0px,32px,16px,16px); | |
| 78 } | |
| 79 | |
| 80 #sources .black-boxed { | |
| 81 color: rgba(128,128,128,0.4); | |
| 82 } | |
| 83 | |
| 84 #sources .selected > .black-boxed { | |
| 85 color: rgba(255,255,255,0.4); | |
| 86 } | |
| 87 | |
| 88 #sources .black-boxed > .dbg-breakpoint { | |
| 89 display: none; | |
| 90 } | |
| 91 | |
| 92 /* Black box message and source progress meter */ | |
| 93 | |
| 94 #black-boxed-message, | |
| 95 #source-progress-container { | |
| 96 background: url(background-noise-toolbar.png); | |
| 97 /* Prevent the container deck from aquiring the size from this message. */ | |
| 98 min-width: 1px; | |
| 99 min-height: 1px; | |
| 100 } | |
| 101 | |
| 102 #source-progress { | |
| 103 min-height: 2em; | |
| 104 min-width: 40em; | |
| 105 } | |
| 106 | |
| 107 #black-boxed-message-label, | |
| 108 #black-boxed-message-button { | |
| 109 text-align: center; | |
| 110 font-size: 120%; | |
| 111 } | |
| 112 | |
| 113 #black-boxed-message-button { | |
| 114 margin-top: 1em; | |
| 115 padding: .25em; | |
| 116 } | |
| 117 | |
| 118 /* Breadcrumbs stack frames view */ | |
| 119 | |
| 120 .dbg-stackframe-details { | |
| 121 -moz-padding-start: 4px; | |
| 122 } | |
| 123 | |
| 124 /* Classic stack frames view */ | |
| 125 | |
| 126 .dbg-classic-stackframe { | |
| 127 display: block; | |
| 128 } | |
| 129 | |
| 130 .dbg-classic-stackframe-title { | |
| 131 font-weight: 600; | |
| 132 } | |
| 133 | |
| 134 .dbg-classic-stackframe-details:-moz-locale-dir(ltr) { | |
| 135 float: right; | |
| 136 } | |
| 137 | |
| 138 .dbg-classic-stackframe-details:-moz-locale-dir(rtl) { | |
| 139 float: left; | |
| 140 } | |
| 141 | |
| 142 .dbg-classic-stackframe-details-url { | |
| 143 max-width: 90%; | |
| 144 text-align: end; | |
| 145 } | |
| 146 | |
| 147 .theme-dark .dbg-classic-stackframe-details-url { | |
| 148 color: #a9bacb; /* Light content text */ | |
| 149 } | |
| 150 | |
| 151 .theme-light .dbg-classic-stackframe-details-url { | |
| 152 color: #667380; /* Dark grey content text */ | |
| 153 } | |
| 154 | |
| 155 .theme-dark .dbg-classic-stackframe-details-sep { | |
| 156 color: #b6babf; /* Grey foreground text */ | |
| 157 } | |
| 158 | |
| 159 .theme-light .dbg-classic-stackframe-details-sep { | |
| 160 color: #585959; /* Grey foreground text */ | |
| 161 } | |
| 162 | |
| 163 .theme-dark .dbg-classic-stackframe-details-line { | |
| 164 color: #5e88b0; /* Highlight blue grey */ | |
| 165 } | |
| 166 | |
| 167 .theme-light .dbg-classic-stackframe-details-line { | |
| 168 color: #5f88b0; /* Highlight blue grey */ | |
| 169 } | |
| 170 | |
| 171 #callstack-list .selected label { | |
| 172 /* Text inside a selected item should not be custom colored. */ | |
| 173 color: inherit !important; | |
| 174 } | |
| 175 | |
| 176 /* Tracer */ | |
| 177 | |
| 178 #trace { | |
| 179 list-style-image: url(tracer-icon.png); | |
| 180 -moz-image-region: rect(0px,16px,16px,0px); | |
| 181 } | |
| 182 | |
| 183 #trace[checked] { | |
| 184 -moz-image-region: rect(0px,32px,16px,16px); | |
| 185 } | |
| 186 | |
| 187 #clear-tracer { | |
| 188 /* Make this button as narrow as the text inside it. */ | |
| 189 min-width: 1px; | |
| 190 } | |
| 191 | |
| 192 .trace-name { | |
| 193 -moz-padding-start: 4px; | |
| 194 } | |
| 195 | |
| 196 /* Tracer dark theme */ | |
| 197 | |
| 198 .theme-dark .trace-item { | |
| 199 color: #f5f7fa; /* Light foreground text */ | |
| 200 } | |
| 201 | |
| 202 .theme-dark .trace-item.selected-matching { | |
| 203 background-color: rgba(29,79,115,.4); /* Select highlight blue at 40% alpha */ | |
| 204 } | |
| 205 | |
| 206 .theme-dark .selected > .trace-item { | |
| 207 background-color: rgba(29,79,115,.6); /* Select highlight blue at 60% alpha */ | |
| 208 } | |
| 209 | |
| 210 .theme-dark .trace-call { | |
| 211 color: #46afe3; /* Highlight blue */ | |
| 212 } | |
| 213 | |
| 214 .theme-dark .trace-return, | |
| 215 .theme-dark .trace-yield { | |
| 216 color: #70bf53; /* Highlight green */ | |
| 217 } | |
| 218 | |
| 219 .theme-dark .trace-throw { | |
| 220 color: #eb5368; /* Highlight red */ | |
| 221 } | |
| 222 | |
| 223 .theme-dark .trace-param { | |
| 224 color: #a9bacb; /* Content text light */ | |
| 225 } | |
| 226 | |
| 227 .theme-dark .trace-syntax { | |
| 228 color: #8fa1b2; /* Content text grey */ | |
| 229 } | |
| 230 | |
| 231 /* Tracer light theme */ | |
| 232 | |
| 233 .theme-light .trace-item { | |
| 234 color: #292e33; /* Dark foreground text */ | |
| 235 } | |
| 236 | |
| 237 .theme-light .trace-item.selected-matching { | |
| 238 background-color: rgba(76,158,217,.4); /* Select highlight blue at 40% alpha */ | |
| 239 } | |
| 240 | |
| 241 .theme-light .selected > .trace-item { | |
| 242 background-color: rgba(76,158,217,.6); /* Select highlight blue at 60% alpha */ | |
| 243 } | |
| 244 | |
| 245 .theme-light .trace-call { | |
| 246 color: #0088cc; /* Highlight blue */ | |
| 247 } | |
| 248 | |
| 249 .theme-light .trace-return, | |
| 250 .theme-light .trace-yield { | |
| 251 color: #2cbb0f; /* Highlight green */ | |
| 252 } | |
| 253 | |
| 254 .theme-light .trace-throw { | |
| 255 color: #ed2655; /* Highlight red */ | |
| 256 } | |
| 257 | |
| 258 .theme-light .trace-param { | |
| 259 color: #667380; /* Content text dark grey */ | |
| 260 } | |
| 261 | |
| 262 .theme-light .trace-syntax { | |
| 263 color: #8fa1b2; /* Content text grey */ | |
| 264 } | |
| 265 | |
| 266 #tracer-traces .selected label { | |
| 267 /* Text inside a selected item should not be custom colored. */ | |
| 268 color: inherit !important; | |
| 269 } | |
| 270 | |
| 271 /* Watch expressions view */ | |
| 272 | |
| 273 #expressions { | |
| 274 min-height: 10px; | |
| 275 max-height: 125px; | |
| 276 } | |
| 277 | |
| 278 .dbg-expression { | |
| 279 height: 20px; | |
| 280 } | |
| 281 | |
| 282 .dbg-expression-arrow { | |
| 283 width: 16px; | |
| 284 height: auto; | |
| 285 margin: 2px; | |
| 286 background: -moz-image-rect(url(commandline-icon.png), 0, 32, 16, 16); | |
| 287 } | |
| 288 | |
| 289 .dbg-expression-input { | |
| 290 color: inherit; | |
| 291 } | |
| 292 | |
| 293 .dbg-expression-button { | |
| 294 -moz-appearance: none; | |
| 295 border: none; | |
| 296 background: none; | |
| 297 cursor: pointer; | |
| 298 text-decoration: underline; | |
| 299 } | |
| 300 | |
| 301 .theme-dark .dbg-expression-button { | |
| 302 color: #46afe3; /* Blue highlight color */ | |
| 303 } | |
| 304 | |
| 305 .theme-light .dbg-expression-button { | |
| 306 color: #0088cc; /* Blue highlight color */ | |
| 307 } | |
| 308 | |
| 309 /* Event listeners view */ | |
| 310 | |
| 311 .dbg-event-listener-type { | |
| 312 font-weight: 600; | |
| 313 } | |
| 314 | |
| 315 .theme-dark .dbg-event-listener-location { | |
| 316 color: #a9bacb; /* Light content text */ | |
| 317 } | |
| 318 | |
| 319 .theme-light .dbg-event-listener-location { | |
| 320 color: #667380; /* Dark grey content text */ | |
| 321 } | |
| 322 | |
| 323 .theme-dark .dbg-event-listener-separator { | |
| 324 color: #b6babf; /* Grey foreground text */ | |
| 325 } | |
| 326 | |
| 327 .theme-light .dbg-event-listener-separator { | |
| 328 color: #585959; /* Grey foreground text */ | |
| 329 } | |
| 330 | |
| 331 .theme-dark .dbg-event-listener-targets { | |
| 332 color: #5e88b0; /* Highlight blue grey */ | |
| 333 } | |
| 334 | |
| 335 .theme-light .dbg-event-listener-targets { | |
| 336 color: #5f88b0; /* Highlight blue grey */ | |
| 337 } | |
| 338 | |
| 339 .theme-dark #event-listeners .selected { | |
| 340 /* Selected items shouldn't be displayed differently. */ | |
| 341 background: none; | |
| 342 color: #fff; | |
| 343 } | |
| 344 | |
| 345 .theme-light #event-listeners .selected { | |
| 346 /* Selected items shouldn't be displayed differently. */ | |
| 347 background: none; | |
| 348 color: #000; | |
| 349 } | |
| 350 | |
| 351 /* Searchbox and the search operations help panel */ | |
| 352 | |
| 353 #searchbox { | |
| 354 min-width: 220px; | |
| 355 -moz-margin-start: 1px; | |
| 356 } | |
| 357 | |
| 358 #filter-label { | |
| 359 -moz-margin-start: 2px; | |
| 360 } | |
| 361 | |
| 362 #searchbox-panel-operators { | |
| 363 margin-top: 5px; | |
| 364 margin-bottom: 8px; | |
| 365 -moz-margin-start: 2px; | |
| 366 } | |
| 367 | |
| 368 .searchbox-panel-operator-button { | |
| 369 min-width: 26px; | |
| 370 margin-top: 0; | |
| 371 margin-bottom: 0; | |
| 372 -moz-margin-start: 2px; | |
| 373 -moz-margin-end: 6px; | |
| 374 text-align: center; | |
| 375 } | |
| 376 | |
| 377 .searchbox-panel-operator-label { | |
| 378 padding-bottom: 2px; | |
| 379 } | |
| 380 | |
| 381 /* Searchbox results panel */ | |
| 382 | |
| 383 #results-panel { | |
| 384 border: none; | |
| 385 } | |
| 386 | |
| 387 .results-panel-item { | |
| 388 padding: 6px 8px; | |
| 389 border-top: 1px solid rgba(128,128,128,0.2); | |
| 390 } | |
| 391 | |
| 392 .results-panel-item:first-of-type { | |
| 393 border-top: none; | |
| 394 } | |
| 395 | |
| 396 .results-panel-item-label { | |
| 397 font-weight: 600; | |
| 398 } | |
| 399 | |
| 400 .results-panel-item-label-before { | |
| 401 -moz-padding-end: 6px; | |
| 402 } | |
| 403 | |
| 404 .theme-dark .results-panel-item-label { | |
| 405 color: #f5f7fa; /* Light foreground text */ | |
| 406 } | |
| 407 | |
| 408 .theme-light .results-panel-item-label { | |
| 409 color: #18191a; /* Dark foreground text */ | |
| 410 } | |
| 411 | |
| 412 .theme-dark .results-panel-item-label-before { | |
| 413 color: #5e88b0; /* Highlight blue grey */ | |
| 414 } | |
| 415 | |
| 416 .theme-light .results-panel-item-label-before { | |
| 417 color: #5f88b0; /* Highlight blue grey */ | |
| 418 } | |
| 419 | |
| 420 .theme-dark .results-panel-item-label-below { | |
| 421 color: #5f7387; /* Dark grey content text */ | |
| 422 } | |
| 423 | |
| 424 .theme-light .results-panel-item-label-below { | |
| 425 color: #667380; /* Dark grey content text */ | |
| 426 } | |
| 427 | |
| 428 #results-panel .selected label { | |
| 429 /* Text inside a selected item should not be custom colored. */ | |
| 430 color: inherit !important; | |
| 431 } | |
| 432 | |
| 433 /* Sources search view */ | |
| 434 | |
| 435 #globalsearch { | |
| 436 min-height: 10px; | |
| 437 max-height: 50vh; | |
| 438 } | |
| 439 | |
| 440 .dbg-results-header { | |
| 441 -moz-padding-start: 6px; | |
| 442 } | |
| 443 | |
| 444 .dbg-results-header-location { | |
| 445 font-weight: 600; | |
| 446 } | |
| 447 | |
| 448 .dbg-results-header-match-count { | |
| 449 -moz-padding-start: 6px; | |
| 450 } | |
| 451 | |
| 452 .dbg-results-line-number { | |
| 453 min-width: 3em; | |
| 454 -moz-border-end: 1px solid rgba(128,128,128,0.2); | |
| 455 -moz-padding-end: 4px; | |
| 456 text-align: end; | |
| 457 } | |
| 458 | |
| 459 .dbg-results-line-contents { | |
| 460 -moz-padding-start: 4px; | |
| 461 } | |
| 462 | |
| 463 .dbg-results-line-contents-string[match=true] { | |
| 464 background-color: rgba(255,255,0,0.2); | |
| 465 border: 1px solid rgba(128,128,128,0.7); | |
| 466 border-radius: 4px; | |
| 467 margin-top: -1px !important; | |
| 468 margin-bottom: -1px !important; | |
| 469 cursor: pointer; | |
| 470 } | |
| 471 | |
| 472 .dbg-results-line-contents-string[match=true][focusing] { | |
| 473 transition: transform 0.3s ease-in-out; | |
| 474 } | |
| 475 | |
| 476 .dbg-results-line-contents-string[match=true][focused] { | |
| 477 transition-duration: 0.1s; | |
| 478 transform: scale(1.75, 1.75); | |
| 479 } | |
| 480 | |
| 481 .theme-dark .dbg-source-results:not(.selected):hover { | |
| 482 background-color: #181d20; /* Sidebar background */ | |
| 483 } | |
| 484 | |
| 485 .theme-light .dbg-source-results:not(.selected):hover { | |
| 486 background-color: #f7f7f7; /* Sidebar background */ | |
| 487 } | |
| 488 | |
| 489 .theme-dark .dbg-results-header { | |
| 490 background-color: #252c33; /* Tab toolbar */ | |
| 491 color: #a9bacb; /* Light content text */ | |
| 492 } | |
| 493 | |
| 494 .theme-light .dbg-results-header { | |
| 495 background-color: #ebeced; /* Tab toolbar */ | |
| 496 color: #667380; /* Dark grey content text */ | |
| 497 } | |
| 498 | |
| 499 .theme-dark .dbg-search-result:hover { | |
| 500 background-color: rgba(29,79,115,.2); /* Select highlight blue at 40% alpha */ | |
| 501 } | |
| 502 | |
| 503 .theme-light .dbg-search-result:hover { | |
| 504 background-color: rgba(76,158,217,.2); /* Select highlight blue at 40% alpha */ | |
| 505 } | |
| 506 | |
| 507 .theme-dark .dbg-results-header-match-count { | |
| 508 color: #5f7387; /* Dark grey content text */ | |
| 509 } | |
| 510 | |
| 511 .theme-light .dbg-results-header-match-count { | |
| 512 color: #667380; /* Dark grey content text */ | |
| 513 } | |
| 514 | |
| 515 .theme-dark .dbg-results-line-number { | |
| 516 background-color: #252c33; /* Tab toolbars */ | |
| 517 color: #b6babf; /* Grey foreground text */ | |
| 518 } | |
| 519 | |
| 520 .theme-light .dbg-results-line-number { | |
| 521 background-color: #ebeced; /* Tab toolbars */ | |
| 522 color: #585959; /* Grey foreground text */ | |
| 523 } | |
| 524 | |
| 525 .theme-dark .dbg-results-line-contents-string { | |
| 526 color: #b6babf; /* Grey foreground text */ | |
| 527 } | |
| 528 | |
| 529 .theme-light .dbg-results-line-contents-string { | |
| 530 color: #585959; /* Grey foreground text */ | |
| 531 } | |
| 532 | |
| 533 .theme-dark .dbg-results-line-contents-string[match=true] { | |
| 534 color: #f5f7fa; /* Light foreground text */ | |
| 535 } | |
| 536 | |
| 537 .theme-light .dbg-results-line-contents-string[match=true] { | |
| 538 color: #18191a; /* Dark foreground text */ | |
| 539 } | |
| 540 | |
| 541 /* Toolbar controls */ | |
| 542 | |
| 543 .devtools-sidebar-tabs > tabs > tab { | |
| 544 min-height: 1em !important; | |
| 545 padding: 0 !important; | |
| 546 } | |
| 547 | |
| 548 #resume { | |
| 549 list-style-image: url(debugger-pause.png); | |
| 550 -moz-image-region: rect(0px,16px,16px,0px); | |
| 551 transition: background 0.15s ease-in-out; | |
| 552 } | |
| 553 | |
| 554 #resume[checked] { | |
| 555 background: none; | |
| 556 list-style-image: url(debugger-play.png); | |
| 557 -moz-image-region: rect(0px,32px,16px,16px); | |
| 558 } | |
| 559 | |
| 560 #resume ~ toolbarbutton { | |
| 561 transition: opacity 0.15s ease-in-out; | |
| 562 } | |
| 563 | |
| 564 #resume:not([checked]) ~ toolbarbutton { | |
| 565 opacity: 0.5; | |
| 566 } | |
| 567 | |
| 568 #step-over { | |
| 569 list-style-image: url(debugger-step-over.png); | |
| 570 } | |
| 571 | |
| 572 #step-in { | |
| 573 list-style-image: url(debugger-step-in.png); | |
| 574 } | |
| 575 | |
| 576 #step-out { | |
| 577 list-style-image: url(debugger-step-out.png); | |
| 578 } | |
| 579 | |
| 580 #instruments-pane-toggle { | |
| 581 background: none; | |
| 582 box-shadow: none; | |
| 583 border: none; | |
| 584 list-style-image: url(debugger-collapse.png); | |
| 585 -moz-image-region: rect(0px,16px,16px,0px); | |
| 586 } | |
| 587 | |
| 588 #instruments-pane-toggle[pane-collapsed] { | |
| 589 list-style-image: url(debugger-expand.png); | |
| 590 } | |
| 591 | |
| 592 #instruments-pane-toggle:active { | |
| 593 -moz-image-region: rect(0px,32px,16px,16px); | |
| 594 } | |
| 595 | |
| 596 /* Horizontal vs. vertical layout */ | |
| 597 | |
| 598 #vertical-layout-panes-container { | |
| 599 min-height: 35vh; | |
| 600 max-height: 80vh; | |
| 601 } | |
| 602 | |
| 603 #body[layout=vertical] #sources-pane > tabs { | |
| 604 -moz-border-end: none; | |
| 605 } | |
| 606 | |
| 607 #body[layout=vertical] #instruments-pane { | |
| 608 margin: 0 !important; | |
| 609 /* To prevent all the margin hacks to hide the sidebar. */ | |
| 610 } | |
| 611 | |
| 612 #body[layout=vertical] .side-menu-widget-container, | |
| 613 #body[layout=vertical] .side-menu-widget-empty-text { | |
| 614 box-shadow: none !important; | |
| 615 } | |
| 616 | |
| 617 #body[layout=vertical] .side-menu-widget-item-arrow { | |
| 618 background-image: none !important; | |
| 619 } | |
| 620 | |
| 621 #body[layout=vertical] .side-menu-widget-group, | |
| 622 #body[layout=vertical] .side-menu-widget-item { | |
| 623 -moz-margin-end: 0; | |
| 624 } |
