src/third_party/WebKit/Source/devtools/front_end/helpScreen.css

   1 .help-window-outer {
   2     position: absolute;
   3     top: 0;
   4     left: 0;
   5     right: 0;
   6     bottom: 0;
   7     z-index: 2000;
   8 }
   9
  10 .help-window-main {
  11     max-height: 100%;
  12     color: white;
  13     background-color: rgba(17, 17, 17, 0.85);
  14     display: -webkit-flex;
  15     -webkit-flex-direction: column;
  16     border-top-width: 0;
  17     border-radius: 10px;
  18 }
  19
  20 .help-window-main a {
  21     color: rgb(17, 85, 204);
  22 }
  23
  24 .help-window-caption {
  25     border-bottom: solid 1px rgb(153, 153, 153);
  26     margin: 0 8px;
  27     padding: 0 2px;
  28     line-height: 28px;
  29 }
  30
  31 .help-window-title {
  32     font-size: 16px;
  33     margin: 0;
  34     padding-top: 1px;
  35     margin-bottom: -1px;
  36 }
  37
  38 .help-content {
  39     overflow-y: auto;
  40     overflow-x: hidden;
  41     margin: 8px;
  42     padding: 0 4px;
  43 }
  44
  45 .help-footnote {
  46     border-top: 1px solid #EEEEEE;
  47     margin: 0;
  48     padding: 12px;
  49 }
  50
  51 .help-window-main .help-container-wrapper::-webkit-scrollbar {
  52     width: 11px;
  53 }
  54
  55 .help-window-main .help-container-wrapper::-webkit-scrollbar-corner,
  56 .help-window-main .help-container-wrapper::-webkit-resizer {
  57     display: none;
  58 }
  59
  60 .help-window-main .help-container-wrapper::-webkit-scrollbar-thumb:vertical {
  61     background: -webkit-gradient(linear, left top, right top, from(rgb(128, 128, 128)), to(rgb(128, 128, 128)), color-stop(40%, rgb(96, 96, 96)));
  62     border-radius: 5px;
  63     min-height: 20px;
  64 }
  65
  66 .help-window-main .help-container-wrapper::-webkit-scrollbar-thumb:vertical:hover,
  67 .help-window-main .help-container-wrapper::-webkit-scrollbar-thumb:vertical:active {
  68     background: -webkit-gradient(linear, left top, right top, from(rgb(176, 176, 176)), to(rgb(176, 176, 176)), color-stop(40%, rgb(144, 144, 144)));
  69 }
  70
  71 .help-window-main .help-container-wrapper::-webkit-scrollbar-track:vertical {
  72     background: -webkit-gradient(linear, left top, right top, from(rgb(10, 10, 10)), to(rgb(32, 32, 32)), color-stop(25%, rgb(32, 32, 32)));
  73     border-radius: 5px;
  74 }
  75
  76 .help-close-button {
  77     position: absolute;
  78     top: 8px;
  79     right: 8px;
  80 }
  81
  82 body.dock-to-bottom .help-content {
  83     margin-bottom: 8px;
  84 }
  85
  86 body.platform-mac .help-window-main .tabbed-pane-header-contents {
  87     margin-left: 27px;
  88 }
  89
  90 body.platform-mac .help-window-main .help-window-title {
  91     margin-left: 18px;
  92 }
  93
  94 .help-container {
  95     width: 100%;
  96     -webkit-user-select: auto;
  97     -webkit-column-width: 470px;
  98 }
  99
 100 body.platform-mac .settings-tab .help-container {
 101     -webkit-column-width: 430px;
 102 }
 103
 104 body.platform-mac .help-container {
 105     -webkit-column-width: 361px;
 106 }
 107
 108 .help-block {
 109     display: block;
 110     padding-bottom: 9px;
 111     width: 470px;
 112     -webkit-column-break-inside: avoid;
 113 }
 114
 115 body.platform-mac .settings-tab .help-block {
 116     width: 430px;
 117 }
 118
 119 .settings-tab.help-container {
 120     -webkit-column-width: 410px;
 121 }
 122
 123 .settings-tab .help-block {
 124     width: 410px;
 125     margin-left: 20px;
 126 }
 127
 128 .settings-tab .field-error-message {
 129     color: DarkRed;
 130 }
 131
 132 .help-line {
 133     padding-bottom: 5px;
 134     margin-bottom: 5px;
 135 }
 136
 137 .help-key-cell {
 138     display: inline-block;
 139     width: 270px;
 140     text-align: right;
 141 }
 142
 143 body.platform-mac .help-key-cell {
 144     width: 151px;
 145 }
 146
 147 .help-cell {
 148     display: inline;
 149 }
 150
 151 .help-section-title {
 152     font-size: 120%;
 153 }
 154
 155 .help-key {
 156     padding: 0.1em 0.6em;
 157     border: 1px solid #ccc;
 158     font-size: 11px;
 159     background-color: #f7f7f7;
 160     color: #333;
 161     box-shadow: 0 1px 0px rgba(0, 0, 0, 0.2), 0 0 0 2px #ffffff inset;
 162     border-radius: 3px;
 163     display: inline-block;
 164     margin: 0 0.1em;
 165     text-shadow: 0 1px 0 #fff;
 166     line-height: 1.5;
 167     white-space: nowrap;
 168 }
 169
 170 body.platform-mac .help-key {
 171     font-family: Lucida Grande, sans-serif;
 172 }
 173
 174 .help-combine-keys,
 175 .help-key-delimiter {
 176     font-size: 9px;
 177 }
 178
 179 .help-combine-keys {
 180     margin: 0 0.3em;
 181 }
 182
 183 .help-key-delimiter {
 184     margin: 0 0.5em;
 185 }
 186
 187 .settings-tab fieldset {
 188     margin: 0;
 189     padding: 0;
 190     border: none;
 191 }
 192
 193 .settings-tab label {
 194     padding-right: 4px;
 195 }
 196
 197 #general-tab-content .help-block fieldset legend {
 198     font-size: 14px;
 199 }
 200
 201 .help-block p p {
 202     padding-left: 30px;
 203 }
 204
 205 #enable-devtools-on-startup {
 206     margin: 0 0 0 80px;
 207     display: inline-block;
 208 }
 209
 210 .help-content p.help-section {
 211     margin: 0 0 15px 0;
 212 }
 213
 214 .settings-experiments-warning-subsection-warning {
 215     color: rgb(200, 0, 0);
 216 }
 217
 218 .settings-experiments-warning-subsection-message {
 219     color: inherit;
 220 }
 221
 222 #resolution-override-section {
 223     margin-left: 13px;
 224 }
 225
 226 .help-content input[type=checkbox] {
 227     height: 13px;
 228     width: 13px;
 229     margin: 0 7px 0 0;
 230     vertical-align: -2px;
 231 }
 232
 233 body.platform-mac .help-content input[type=checkbox] {
 234     vertical-align: -1px;
 235 }
 236
 237 .help-content input[type=radio] {
 238     vertical-align: -2px;
 239 }
 240
 241 body.platform-mac .help-content input[type=radio] {
 242     vertical-align: -1px;
 243 }
 244
 245 .help-content select {
 246     background-color: rgb(64, 64, 64);
 247     color: white;
 248     border-color: black;
 249     padding: 0 4px;
 250 }
 251
 252 .help-content select:disabled {
 253     background-color: rgb(32, 32, 32);
 254     color: graytext;
 255 }
 256
 257 .help-content option {
 258     background-color: #EEEEEE;
 259     color: #222;
 260 }
 261
 262 #settings-screen .help-window-main{
 263     color: rgb(48, 57, 66);
 264     background-color: white;
 265     border-radius: 0;
 266 }
 267
 268 #settings-screen .help-window-main {
 269     position: absolute;
 270     top: 10px;
 271     right: 10px;
 272     bottom: 10px;
 273     left: 10px;
 274     height: initial;
 275     padding: 21px 0 0 21px;
 276     box-shadow: 1px 1px 5px 2px rgba(128, 128, 128, 0.7);
 277 }
 278
 279 #settings-screen .help-window-label {
 280     font-size: 18px;
 281     color: inherit;
 282     padding-top: 1px;
 283 }
 284
 285 .help-container-wrapper {
 286     position: absolute;
 287     top: 54px;
 288     left: 15px;
 289     right: 0;
 290     bottom: 0;
 291     overflow: auto;
 292 }
 293
 294 #settings-screen .tabbed-pane-header {
 295     border: none transparent;
 296     height: auto;
 297     width: 110px;
 298     position: relative;
 299     top: 14px;
 300     flex: auto;
 301 }
 302
 303 #settings-screen .tabbed-pane-header-contents {
 304     margin: 0;
 305 }
 306
 307 #settings-screen .tabbed-pane-header-tabs {
 308     display: flex;
 309     flex-direction: column;
 310     padding-top: 5px;
 311     width: 100px;
 312 }
 313
 314 #settings-screen .tabbed-pane-header-tab {
 315     background-color: transparent;
 316     border: none transparent;
 317     font-weight: normal;
 318     text-shadow: none;
 319     color: #999999;
 320     height: 22px;
 321     padding-left: 0;
 322 }
 323
 324 #settings-screen .tabbed-pane-header-tab:not(.selected) {
 325     cursor: pointer;
 326 }
 327
 328 #settings-screen .tabbed-pane-header-tab.selected {
 329     color: inherit;
 330 }
 331
 332 #settings-screen .tabbed-pane-content {
 333     position: absolute;
 334     top: 0;
 335     right: 0;
 336     bottom: 0;
 337     margin: 8px;
 338 }
 339
 340 #settings-screen .tabbed-pane-content {
 341     left: 120px;
 342 }
 343
 344 .settings-tab.help-content {
 345     margin: 0;
 346     padding: 0;
 347 }
 348
 349 .settings-tab input:not([type]),
 350 .settings-tab input[type="text"] {
 351     border: 1px solid rgb(213, 213, 213);
 352     border-radius: 2px;
 353     color: #444444;
 354     padding: 3px;
 355 }
 356
 357 .settings-tab input.numeric {
 358     text-align: right;
 359 }
 360
 361 .settings-tab-container {
 362     flex: auto;
 363 }
 364
 365 .settings-tab-container header {
 366     padding: 14px 0 6px;
 367     border-bottom: 1px solid #EEEEEE;
 368 }
 369
 370 #tab-shortcuts {
 371     margin-top: 25px !important;
 372 }
 373
 374 #experiments-tab-content .help-container {
 375     -webkit-column-width: 470px;
 376 }
 377
 378 #experiments-tab-content .help-block {
 379     width: 470px;
 380 }
 381
 382 .settings-tab-container header > h3 {
 383     font-size: 18px;
 384     font-weight: normal;
 385     margin: 0;
 386     padding-bottom: 3px;
 387 }
 388
 389 .settings-tab .help-section-title {
 390     margin-left: -20px;
 391     color: #222;
 392 }
 393
 394 .settings-tab .help-block fieldset:disabled label:hover {
 395     color: inherit;
 396 }
 397
 398 .settings-tab .help-block label:hover {
 399     color: #222;
 400 }
 401
 402 .settings-tab p {
 403     margin: 12px 0;
 404 }
 405
 406 .settings-tab select {
 407     background-color: #FAFAFA;
 408     border-color: rgb(213, 213, 213);
 409     border-radius: 2px;
 410     color: inherit;
 411     padding: 0 4px;
 412 }
 413
 414 .settings-tab select:disabled {
 415     background-color: rgb(221, 221, 221);
 416 }
 417
 418 .settings-tab .workspace-settings-row input {
 419     width: 190px;
 420 }
 421
 422 #workspace-tab-content .settings-tab.help-content.help-container {
 423     -webkit-column-width: initial;
 424 }
 425
 426
 427 #workspace-tab-content .button:hover {
 428     opacity: 1.0 !important;
 429 }
 430
 431 #workspace-tab-content .workspace-settings-row:hover .button {
 432     visibility: visible;
 433     opacity: 0.4;
 434 }
 435
 436 #workspace-tab-content .workspace-settings-row .button {
 437     width: 10px;
 438     height: 10px;
 439     border: none;
 440     -webkit-appearance: none;
 441     background-color: transparent;
 442     visibility: hidden;
 443     background-position: center;
 444     margin: 0 0 0 4px;
 445 }
 446
 447 #workspace-tab-content .workspace-settings-row .remove-button {
 448     background-image: url(Images/deleteIcon.png);
 449 }
 450
 451 #workspace-tab-content .workspace-settings-row .add-button {
 452     background-image: url(Images/addIcon.png);
 453 }
 454
 455 #workspace-tab-content .workspace-settings-error {
 456     color: red;
 457 }
 458
 459 .settings-tab-text-button {
 460     background-image: -webkit-linear-gradient(hsl(0, 0%, 93%), hsl(0, 0%, 93%) 38%, hsl(0, 0%, 87%));
 461     border: 1px solid hsla(0, 0%, 0%, 0.25);
 462     border-radius: 2px;
 463     box-shadow: 0 1px 0 hsla(0, 0%, 0%, 0.08), inset 0 1px 2px hsla(0, 100%, 100%, 0.75);
 464     color: hsl(0, 0%, 27%);
 465     font-size: 12px;
 466     margin: 0 1px 0 0;
 467     text-shadow: 0 1px 0 hsl(0, 0%, 94%);
 468     min-height: 2em;
 469     padding-left: 10px;
 470     padding-right: 10px;
 471 }
 472
 473 .settings-tab-text-button:disabled {
 474     background-image: -webkit-linear-gradient(#f1f1f1, #f1f1f1 38%, #e6e6e6);
 475     border-color: rgba(80, 80, 80, 0.2);
 476     box-shadow: 0 1px 0 rgba(80, 80, 80, 0.08), inset 0 1px 2px rgba(255, 255, 255, 0.75);
 477     color: #aaa;
 478 }
 479
 480 .settings-tab-text-button:not(:disabled):hover {
 481     background-image: -webkit-linear-gradient(hsl(0, 0%, 94%), hsl(0, 0%, 94%) 38%, hsl(0, 0%, 88%));
 482     border-color: hsla(0, 0%, 0%, 0.3);
 483     box-shadow: 0 1px 0 hsla(0, 0%, 0%, 0.12), inset 0 1px 2px hsla(0, 100%, 100%, 0.95);
 484     color: hsl(0, 0%, 0%);
 485 }
 486
 487 .settings-tab-text-button:not(:disabled):active {
 488     background-image: -webkit-linear-gradient(hsl(0, 0%, 91%), hsl(0, 0%, 91%) 38%, hsl(0, 0%, 84%));
 489     box-shadow: none;
 490     text-shadow: none;
 491 }
 492
 493 .settings-tab .settings-list-container {
 494     background-color: white;
 495     margin-bottom: 10px;
 496 }
 497
 498 .settings-tab .settings-list {
 499     border: 1px solid hsl(0, 0%, 85%);
 500     border-radius: 2px;
 501 }
 502
 503 .settings-tab .settings-list .settings-list-item .settings-list-item-contents {
 504     width: 100%;
 505     height: 40px;
 506     -webkit-box-align: center;
 507     -webkit-transition: 150ms background-color;
 508     display: -webkit-box;
 509     padding-right: 3px;
 510 }
 511
 512 .settings-tab .settings-list .settings-list-item .settings-list-item-contents > :first-child {
 513     -webkit-box-align: center;
 514     -webkit-box-flex: 1;
 515     -webkit-padding-end: 5px;
 516     display: -webkit-box;
 517 }
 518
 519 .settings-tab .settings-list .settings-list-item.selected:not(.editable) {
 520     background-color: hsl(0, 0%, 82%);
 521 }
 522
 523 .settings-tab .settings-list .settings-list-item:hover {
 524     background-color: hsl(215, 54%, 93%);
 525 }
 526
 527 .settings-tab .settings-list .settings-list-item.selected:not(.editable):hover {
 528     background-color: hsl(215, 51%, 82%);
 529 }
 530
 531 .settings-tab .settings-list .settings-list-item .remove-item-button {
 532     -webkit-transition: 150ms opacity;
 533     background-color: hsla(0, 0%, 0%, 0);
 534     background-image: -webkit-image-set(
 535         url(Images/settingsListRemove.png) 1x,
 536         url(Images/settingsListRemove_2x.png) 2x);
 537     background-size: 48px 16px;
 538     border: none;
 539     display: block;
 540     height: 16px;
 541     width: 16px;
 542     opacity: 0;
 543     pointer-events: none;
 544 }
 545
 546 .settings-tab .settings-list .settings-list-item.selected .remove-item-button,
 547 .settings-tab .settings-list .settings-list-item:hover .remove-item-button {
 548     opacity: 1;
 549     pointer-events: auto;
 550 }
 551
 552 .settings-tab .settings-list .settings-list-item .remove-item-button:hover {
 553     background-position-x: -32px;
 554 }
 555
 556 .settings-tab .settings-list .settings-list-item .remove-item-button:active {
 557     background-position-x: -16px;
 558 }
 559
 560 .settings-list-item-columns {
 561     height: 100%;
 562 }
 563
 564 .settings-tab .settings-list .settings-list-item .list-column {
 565     displaY: -webkit-box;
 566     -webkit-box-align: center;
 567     padding-left: 5px;
 568     padding-right: 2px;
 569     box-sizing: border-box;
 570     overflow: hidden;
 571     text-overflow: ellipsis;
 572     height: 100%;
 573 }
 574
 575 .settings-tab .settings-list .settings-list-item .list-column .list-column-editor {
 576     width: 100%;
 577 }
 578
 579 .settings-tab .settings-list .settings-list-item.add-list-item .remove-item-button {
 580     visibility: hidden;
 581 }
 582
 583 .settings-tab .settings-list .settings-list-item.editable .list-column .list-column-editor {
 584     display: none;
 585 }
 586
 587 .settings-tab .settings-list .settings-list-item.editable.item-editing .list-column .list-column-editor {
 588     display: block;
 589 }
 590
 591 .settings-tab .settings-list .settings-list-item.editable.item-editing .list-column .list-column-text {
 592     display: none;
 593 }
 594
 595 .settings-tab .settings-list .settings-list-item.editable.item-editing .list-column .list-column-editor.editable-item-error {
 596     background-color: pink;
 597 }
 598
 599 .list-column-editor {
 600     border: 1px solid rgb(213, 213, 213);
 601     border-radius: 2px;
 602     color: #444444;
 603     padding: 3px;
 604 }
 605
 606 .settings-tab .settings-list .settings-list-item .file-system-path {
 607     white-space: nowrap;
 608     font-size: 12px;
 609     padding-left: 6px;
 610     padding-right: 5px;
 611     -webkit-box-flex: 1;
 612     color: hsl(210, 16%, 22%);
 613 }
 614
 615 .settings-tab .settings-list .settings-list-item .file-system-path-name {
 616     padding-right: 6px;
 617     font-weight: bold;
 618 }
 619
 620 .file-mappings-list .settings-list-item .list-column.settings-list-column-url {
 621     width: 50%;
 622 }
 623
 624 .file-mappings-list .settings-list-item .list-column.settings-list-column-path {
 625     width: 50%;
 626 }
 627
 628 .excluded-folders-list .settings-list-item .list-column.settings-list-column-path {
 629     width: 100%;
 630 }
 631
 632 .settings-dialog {
 633     border-radius: 3px;
 634     box-shadow: 0 4px 23px 5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0,0,0,0.15);
 635     display: -webkit-flex;
 636     -webkit-flex-direction: column;
 637     background: white;
 638 }
 639
 640 .settings-dialog .dialog-contents {
 641     display: flex;
 642     flex-direction: column;
 643 }
 644
 645 .settings-dialog .header {
 646     flex: 0 0 auto;
 647     color: #333;
 648     font-size: 14px;
 649     margin: 0;
 650     padding: 14px 17px 14px;
 651 }
 652
 653 .settings-dialog .contents {
 654     flex: 1 1 auto;
 655     padding: 0 17px;
 656     overflow: auto;
 657     margin-bottom: 10px;
 658 }
 659
 660 .settings-dialog .block-header {
 661     color: black;
 662     font-size: 1.2em;
 663     margin-bottom: 0.8em;
 664 }
 665
 666 .settings-dialog .done-button {
 667     float: right;
 668 }
 669
 670 .settings-glass-pane {
 671     -webkit-box-align: center;
 672     -webkit-box-orient: vertical;
 673     -webkit-box-pack: center;
 674     display: -webkit-box;
 675     z-index: 2000 !important;
 676     padding: 5px;
 677     background-color: rgba(255, 255, 255, 0.4) !important;
 678 }
 679
 680 #overrides-tab-content .help-container {
 681     -webkit-column-width: auto !important;
 682 }