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

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