src/css/doc.css

   1 .doc {
   2   color: var(--doc-font-color);
   3   font-size: var(--doc-font-size);
   4   hyphens: auto;
   5   line-height: var(--doc-line-height);
   6   margin: var(--doc-margin);
   7   max-width: var(--doc-max-width);
   8   padding: 0 1rem 4rem;
   9 }
  10
  11 @media screen and (min-width: 1024px) {
  12   .doc {
  13     flex: auto;
  14     font-size: var(--doc-font-size--desktop);
  15     margin: var(--doc-margin--desktop);
  16     max-width: var(--doc-max-width--desktop);
  17     min-width: 0;
  18   }
  19 }
  20
  21 .doc h1,
  22 .doc h2,
  23 .doc h3,
  24 .doc h4,
  25 .doc h5,
  26 .doc h6 {
  27   color: var(--heading-font-color);
  28   font-weight: var(--heading-font-weight);
  29   hyphens: none;
  30   line-height: 1.3;
  31   margin: 1rem 0 0;
  32 }
  33
  34 .doc > h1.page:first-child {
  35   font-size: calc(36 / var(--rem-base) * 1rem);
  36   margin: 1.5rem 0;
  37 }
  38
  39 @media screen and (min-width: 769px) {
  40   .doc > h1.page:first-child {
  41     margin-top: 2.5rem;
  42   }
  43 }
  44
  45 h1.page + aside.toc.embedded {
  46   margin-top: -0.5rem;
  47 }
  48
  49 #preamble + .sect1,
  50 .doc .sect1 + .sect1 {
  51   margin-top: 2rem;
  52 }
  53
  54 .doc h1.sect0 {
  55   background: var(--abstract-background);
  56   font-size: 1.8em;
  57   margin: 1.5rem -1rem 0;
  58   padding: 0.5rem 1rem;
  59 }
  60
  61 .doc h2:not(.discrete) {
  62   border-bottom: 1px solid var(--section-divider-color);
  63   margin-left: -1rem;
  64   margin-right: -1rem;
  65   padding: 0.4rem 1rem 0.1rem;
  66 }
  67
  68 .doc h3:not(.discrete) {
  69   font-weight: var(--alt-heading-font-weight);
  70 }
  71
  72 .doc h1 .anchor,
  73 .doc h2 .anchor,
  74 .doc h3 .anchor,
  75 .doc h4 .anchor,
  76 .doc h5 .anchor,
  77 .doc h6 .anchor {
  78   position: absolute;
  79   text-decoration: none;
  80   width: 1.75ex;
  81   margin-left: -1.5ex;
  82   visibility: hidden;
  83   font-size: 0.8em;
  84   font-weight: normal;
  85   padding-top: 0.05em;
  86 }
  87
  88 .doc h1 .anchor::before,
  89 .doc h2 .anchor::before,
  90 .doc h3 .anchor::before,
  91 .doc h4 .anchor::before,
  92 .doc h5 .anchor::before,
  93 .doc h6 .anchor::before {
  94   content: "\00a7";
  95 }
  96
  97 .doc h1:hover .anchor,
  98 .doc h2:hover .anchor,
  99 .doc h3:hover .anchor,
 100 .doc h4:hover .anchor,
 101 .doc h5:hover .anchor,
 102 .doc h6:hover .anchor {
 103   visibility: visible;
 104 }
 105
 106 .doc p,
 107 .doc dl {
 108   margin: 0;
 109 }
 110
 111 .doc a {
 112   color: var(--link-font-color);
 113 }
 114
 115 .doc a:hover {
 116   color: var(--link_hover-font-color);
 117 }
 118
 119 .doc a.bare {
 120   hyphens: none;
 121 }
 122
 123 .doc a.unresolved {
 124   color: var(--link_unresolved-font-color);
 125 }
 126
 127 .doc i.fa {
 128   hyphens: none;
 129   font-style: normal;
 130 }
 131
 132 .doc p code,
 133 .doc thead code {
 134   color: var(--code-font-color);
 135   background: var(--code-background);
 136   border-radius: 0.25em;
 137   font-size: 0.95em;
 138   padding: 0.125em 0.25em;
 139 }
 140
 141 .doc code,
 142 .doc pre {
 143   hyphens: none;
 144 }
 145
 146 .doc pre {
 147   font-size: calc(16 / var(--rem-base) * 1rem);
 148   line-height: 1.5;
 149   margin: 0;
 150 }
 151
 152 .doc blockquote {
 153   margin: 0;
 154 }
 155
 156 .doc .paragraph.lead > p {
 157   font-size: calc(18 / var(--rem-base) * 1rem);
 158 }
 159
 160 .doc .right {
 161   float: right;
 162 }
 163
 164 .doc .left {
 165   float: left;
 166 }
 167
 168 .doc .stretch {
 169   width: 100%;
 170 }
 171
 172 .doc .underline {
 173   text-decoration: underline;
 174 }
 175
 176 .doc .line-through {
 177   text-decoration: line-through;
 178 }
 179
 180 .doc .paragraph,
 181 .doc .dlist,
 182 .doc .hdlist,
 183 .doc .olist,
 184 .doc .ulist,
 185 .doc .exampleblock,
 186 .doc .imageblock,
 187 .doc .listingblock,
 188 .doc .literalblock,
 189 .doc .sidebarblock,
 190 .doc .verseblock,
 191 .doc .quoteblock,
 192 .doc .partintro,
 193 .doc details,
 194 .doc hr {
 195   margin: 1rem 0 0;
 196 }
 197
 198 .doc table.tableblock {
 199   font-size: calc(15 / var(--rem-base) * 1rem);
 200   margin: 1.5rem 0 0;
 201 }
 202
 203 .doc table.tableblock + * {
 204   margin-top: 1.5rem;
 205 }
 206
 207 .doc td.tableblock > .content > :first-child {
 208   margin-top: 0;
 209 }
 210
 211 .doc table.tableblock th,
 212 .doc table.tableblock td {
 213   padding: 0.5rem;
 214 }
 215
 216 .doc table.tableblock thead th {
 217   border-bottom: 2.5px solid var(--table-border-color);
 218 }
 219
 220 .doc table.tableblock td,
 221 .doc table.tableblock > :not(thead) th {
 222   border-top: 1px solid var(--table-border-color);
 223   border-bottom: 1px solid var(--table-border-color);
 224 }
 225
 226 .doc table.stripes-all > tbody > tr,
 227 .doc table.stripes-odd > tbody > tr:nth-of-type(odd),
 228 .doc table.stripes-even > tbody > tr:nth-of-type(even),
 229 .doc table.stripes-hover > tbody > tr:hover {
 230   background: var(--table-stripe-background);
 231 }
 232
 233 .doc table.tableblock > tfoot {
 234   background: var(--table-footer-background);
 235 }
 236
 237 .doc .halign-left {
 238   text-align: left;
 239 }
 240
 241 .doc .halign-right {
 242   text-align: right;
 243 }
 244
 245 .doc .halign-center {
 246   text-align: center;
 247 }
 248
 249 .doc .valign-top {
 250   vertical-align: top;
 251 }
 252
 253 .doc .valign-bottom {
 254   vertical-align: bottom;
 255 }
 256
 257 .doc .valign-middle {
 258   vertical-align: middle;
 259 }
 260
 261 .doc .admonitionblock {
 262   margin: 1.4rem 0 0;
 263 }
 264
 265 .doc .admonitionblock p,
 266 .doc .admonitionblock td.content {
 267   font-size: calc(16 / var(--rem-base) * 1rem);
 268 }
 269
 270 .doc .admonitionblock td.content > :not(.title):first-child,
 271 .doc .admonitionblock td.content > .title + * {
 272   margin-top: 0;
 273 }
 274
 275 .doc .admonitionblock pre {
 276   font-size: calc(15 / var(--rem-base) * 1rem);
 277 }
 278
 279 .doc .admonitionblock > table {
 280   table-layout: fixed;
 281   position: relative;
 282   width: 100%;
 283 }
 284
 285 .doc .admonitionblock td.content {
 286   padding: 1rem 1rem 0.75rem;
 287   background: var(--admonition-background);
 288   width: 100%;
 289   word-wrap: anywhere;
 290 }
 291
 292 .doc .admonitionblock .icon {
 293   position: absolute;
 294   top: 0;
 295   left: 0;
 296   font-size: calc(15 / var(--rem-base) * 1rem);
 297   padding: 0 0.5rem;
 298   height: 1.25rem;
 299   line-height: 1;
 300   font-weight: var(--admonition-label-font-weight);
 301   text-transform: uppercase;
 302   border-radius: 0.45rem;
 303   transform: translate(-0.5rem, -50%);
 304 }
 305
 306 .doc .admonitionblock.caution .icon {
 307   background-color: var(--caution-color);
 308   color: var(--caution-on-color);
 309 }
 310
 311 .doc .admonitionblock.important .icon {
 312   background-color: var(--important-color);
 313   color: var(--important-on-color);
 314 }
 315
 316 .doc .admonitionblock.note .icon {
 317   background-color: var(--note-color);
 318   color: var(--note-on-color);
 319 }
 320
 321 .doc .admonitionblock.tip .icon {
 322   background-color: var(--tip-color);
 323   color: var(--tip-on-color);
 324 }
 325
 326 .doc .admonitionblock.warning .icon {
 327   background-color: var(--warning-color);
 328   color: var(--warning-on-color);
 329 }
 330
 331 .doc .admonitionblock .icon i {
 332   display: inline-flex;
 333   align-items: center;
 334   height: 100%;
 335 }
 336
 337 .doc .admonitionblock .icon i::after {
 338   content: attr(title);
 339 }
 340
 341 .doc .imageblock {
 342   display: flex;
 343   flex-direction: column;
 344   align-items: center;
 345 }
 346
 347 .doc .imageblock img,
 348 .doc .image > img {
 349   display: inline-block;
 350   height: auto;
 351   max-width: 100%;
 352   vertical-align: middle;
 353 }
 354
 355 .doc .image:not(.left):not(.right) > img {
 356   margin-top: -0.2em;
 357 }
 358
 359 #preamble .abstract blockquote {
 360   background: var(--abstract-background);
 361   border-left: 5px solid var(--abstract-border-color);
 362   color: var(--abstract-font-color);
 363   font-size: calc(16 / var(--rem-base) * 1rem);
 364   padding: 0.75em 1em;
 365 }
 366
 367 .doc .quoteblock,
 368 .doc .verseblock {
 369   background: var(--quote-background);
 370   border-left: 5px solid var(--quote-border-color);
 371   color: var(--quote-font-color);
 372 }
 373
 374 .doc .quoteblock {
 375   padding: 0.25rem 2rem 1.25rem;
 376 }
 377
 378 .doc .quoteblock .attribution {
 379   color: var(--quote-attribution-font-color);
 380   font-size: calc(15 / var(--rem-base) * 1rem);
 381   margin-top: 0.75rem;
 382 }
 383
 384 .doc .quoteblock blockquote {
 385   margin-top: 1rem;
 386 }
 387
 388 .doc .quoteblock .paragraph {
 389   font-style: italic;
 390 }
 391
 392 .doc .quoteblock cite {
 393   padding-left: 1em;
 394 }
 395
 396 .doc .verseblock {
 397   font-size: 1.15em;
 398   padding: 1rem 2rem;
 399 }
 400
 401 .doc .verseblock pre {
 402   font-family: inherit;
 403   font-size: inherit;
 404 }
 405
 406 .doc ol,
 407 .doc ul {
 408   margin: 0;
 409   padding: 0 0 0 2rem;
 410 }
 411
 412 .doc ul.checklist,
 413 .doc ul.none,
 414 .doc ol.none,
 415 .doc ul.no-bullet,
 416 .doc ol.unnumbered,
 417 .doc ul.unstyled,
 418 .doc ol.unstyled {
 419   list-style-type: none;
 420 }
 421
 422 .doc ul.no-bullet,
 423 .doc ol.unnumbered {
 424   padding-left: 1.25rem;
 425 }
 426
 427 .doc ul.unstyled,
 428 .doc ol.unstyled {
 429   padding-left: 0;
 430 }
 431
 432 .doc ul.circle {
 433   list-style-type: square;
 434 }
 435
 436 .doc ul.disc {
 437   list-style-type: square;
 438 }
 439
 440 .doc ul.square {
 441   list-style-type: square;
 442 }
 443
 444 .doc ol.arabic {
 445   list-style-type: decimal;
 446 }
 447
 448 .doc ol.decimal {
 449   list-style-type: decimal-leading-zero;
 450 }
 451
 452 .doc ol.loweralpha {
 453   list-style-type: lower-alpha;
 454 }
 455
 456 .doc ol.upperalpha {
 457   list-style-type: upper-alpha;
 458 }
 459
 460 .doc ol.lowerroman {
 461   list-style-type: lower-roman;
 462 }
 463
 464 .doc ol.upperroman {
 465   list-style-type: upper-roman;
 466 }
 467
 468 .doc ol.lowergreek {
 469   list-style-type: lower-greek;
 470 }
 471
 472 .doc ul.checklist {
 473   padding-left: 0.5rem;
 474 }
 475
 476 .doc ul.checklist p > i.fa-check-square-o:first-child,
 477 .doc ul.checklist p > i.fa-square-o:first-child {
 478   display: inline-flex;
 479   justify-content: center;
 480   width: 1.25rem;
 481 }
 482
 483 .doc ul.checklist i.fa-check-square-o::before {
 484   content: "\2713";
 485 }
 486
 487 .doc ul.checklist i.fa-square-o::before {
 488   content: "\274f";
 489 }
 490
 491 .doc .dlist .dlist,
 492 .doc .dlist .olist,
 493 .doc .dlist .ulist,
 494 .doc .olist .dlist,
 495 .doc .olist .olist,
 496 .doc .olist .ulist,
 497 .doc .ulist .dlist,
 498 .doc .ulist .olist,
 499 .doc .ulist .ulist {
 500   margin-top: 0.5rem;
 501 }
 502
 503 .doc .olist li,
 504 .doc .ulist li {
 505   margin-bottom: 0.5rem;
 506 }
 507
 508 .doc .ulist .listingblock,
 509 .doc .olist .listingblock,
 510 .doc .admonitionblock .listingblock {
 511   padding: 0;
 512 }
 513
 514 .doc .admonitionblock .title,
 515 .doc .exampleblock .title,
 516 .doc .imageblock .title,
 517 .doc .literalblock .title,
 518 .doc .listingblock .title,
 519 .doc .openblock .title,
 520 .doc .tableblock caption {
 521   color: var(--caption-font-color);
 522   font-size: calc(16 / var(--rem-base) * 1rem);
 523   font-weight: var(--caption-font-weight);
 524   font-style: italic;
 525   hyphens: none;
 526   letter-spacing: 0.01em;
 527   padding-bottom: 0.075rem;
 528   text-align: left;
 529 }
 530
 531 .doc .imageblock .title {
 532   margin-top: 0.5rem;
 533   padding-bottom: 0;
 534 }
 535
 536 .doc .exampleblock > .content {
 537   background: var(--example-background);
 538   border: 0.25rem solid var(--example-border-color);
 539   border-radius: 0.5rem;
 540   padding: 0.75rem;
 541 }
 542
 543 .doc .exampleblock > .content > :first-child {
 544   margin-top: 0;
 545 }
 546
 547 .doc .sidebarblock {
 548   background: var(--sidebar-background);
 549   border-radius: 0.75rem;
 550   padding: 0.75rem 1.5rem;
 551 }
 552
 553 .doc .sidebarblock > .content > .title {
 554   font-size: calc(22.5 / var(--rem-base) * 1rem);
 555   font-weight: var(--alt-heading-font-weight);
 556   line-height: 1.3;
 557   margin-bottom: -0.3em;
 558   text-align: center;
 559 }
 560
 561 .doc .sidebarblock > .content > :not(.title):first-child {
 562   margin-top: 0;
 563 }
 564
 565 /* NEEDS REVIEW prevent pre in table from causing article to exceed bounds */
 566 .doc .tableblock pre,
 567 .doc .listingblock.wrap pre {
 568   white-space: pre-wrap;
 569 }
 570
 571 .doc pre.highlight code,
 572 .doc .listingblock pre:not(.highlight),
 573 .doc .literalblock pre {
 574   background: var(--pre-background);
 575   box-shadow: inset 0 0 1.75px var(--pre-border-color);
 576   display: block;
 577   overflow-x: auto;
 578   padding: 0.75rem;
 579 }
 580
 581 .doc pre.highlight {
 582   position: relative;
 583 }
 584
 585 .doc .source-toolbox {
 586   display: flex;
 587   visibility: hidden;
 588   position: absolute;
 589   top: 0.25rem;
 590   right: 0.5rem;
 591   color: var(--pre-annotation-font-color);
 592   font-family: var(--body-font-family);
 593   font-size: calc(13.5 / var(--rem-base) * 1rem);
 594   line-height: 1;
 595 }
 596
 597 .doc .listingblock:hover .source-toolbox {
 598   visibility: visible;
 599 }
 600
 601 .doc .source-toolbox .source-lang {
 602   text-transform: uppercase;
 603   letter-spacing: 0.075em;
 604   font-size: 0.96em;
 605   line-height: 1.0425;
 606 }
 607
 608 .doc .source-toolbox > :not(:last-child)::after {
 609   content: "|";
 610   letter-spacing: 0;
 611   padding: 0 1ch;
 612 }
 613
 614 .doc .source-toolbox .copy-button {
 615   display: flex;
 616   flex-direction: column;
 617   align-items: center;
 618   background: transparent;
 619   border: none;
 620   color: inherit;
 621   outline: none;
 622   padding: 0;
 623   font-size: inherit;
 624   line-height: inherit;
 625   width: 1em;
 626   height: 1em;
 627 }
 628
 629 .doc .source-toolbox .copy-icon {
 630   flex: none;
 631   width: inherit;
 632   height: inherit;
 633 }
 634
 635 .doc .source-toolbox img.copy-icon {
 636   filter: invert(50.2%);
 637 }
 638
 639 .doc .source-toolbox svg.copy-icon {
 640   fill: currentColor;
 641 }
 642
 643 .doc .source-toolbox .copy-toast {
 644   flex: none;
 645   position: relative;
 646   display: inline-flex;
 647   justify-content: center;
 648   margin-top: 1em;
 649   background-color: var(--doc-font-color);
 650   border-radius: 0.25em;
 651   padding: 0.5em;
 652   color: var(--color-white);
 653   cursor: auto;
 654   opacity: 0;
 655   transition: opacity 0.5s ease 0.75s;
 656 }
 657
 658 .doc .source-toolbox .copy-toast::after {
 659   content: "";
 660   position: absolute;
 661   top: 0;
 662   width: 1em;
 663   height: 1em;
 664   border: 0.55em solid transparent;
 665   border-left-color: var(--doc-font-color);
 666   transform: rotate(-90deg) translateX(50%) translateY(50%);
 667   transform-origin: left;
 668 }
 669
 670 .doc .source-toolbox .copy-button.clicked .copy-toast {
 671   opacity: 1;
 672   transition: none;
 673 }
 674
 675 .doc .language-console .hljs-meta {
 676   user-select: none;
 677 }
 678
 679 .doc .dlist dt {
 680   font-style: italic;
 681 }
 682
 683 .doc .dlist dd {
 684   margin: 0 0 0.25rem 1.5rem;
 685 }
 686
 687 .doc .dlist dd:last-of-type {
 688   margin-bottom: 0;
 689 }
 690
 691 .doc td.hdlist1,
 692 .doc td.hdlist2 {
 693   padding: 0.5rem 0 0;
 694   vertical-align: top;
 695 }
 696
 697 .doc tr:first-child > .hdlist1,
 698 .doc tr:first-child > .hdlist2 {
 699   padding-top: 0;
 700 }
 701
 702 .doc td.hdlist1 {
 703   font-weight: var(--body-font-weight-bold);
 704   padding-right: 0.25rem;
 705 }
 706
 707 .doc td.hdlist2 {
 708   padding-left: 0.25rem;
 709 }
 710
 711 .doc .colist {
 712   font-size: calc(16 / var(--rem-base) * 1rem);
 713   margin: 0.25rem 0 -0.25rem;
 714 }
 715
 716 .doc .colist > table > tr > :first-child,
 717 .doc .colist > table > tbody > tr > :first-child {
 718   padding: 0.25em 0.5rem 0;
 719   vertical-align: top;
 720 }
 721
 722 .doc .colist > table > tr > :last-child,
 723 .doc .colist > table > tbody > tr > :last-child {
 724   padding: 0.25rem 0;
 725 }
 726
 727 .doc .conum[data-value] {
 728   border: 1px solid currentColor;
 729   border-radius: 100%;
 730   display: inline-block;
 731   font-family: var(--body-font-family);
 732   font-size: calc(13.5 / var(--rem-base) * 1rem);
 733   font-style: normal;
 734   line-height: 1.2;
 735   text-align: center;
 736   width: 1.25em;
 737   height: 1.25em;
 738   letter-spacing: -0.25ex;
 739   text-indent: -0.25ex;
 740 }
 741
 742 .doc .conum[data-value]::after {
 743   content: attr(data-value);
 744 }
 745
 746 .doc .conum[data-value] + b {
 747   display: none;
 748 }
 749
 750 .doc hr {
 751   border: solid var(--section-divider-color);
 752   border-width: 2px 0 0;
 753   height: 0;
 754 }
 755
 756 .doc b.button {
 757   white-space: nowrap; /* effectively ignores hyphens setting */
 758 }
 759
 760 .doc b.button::before {
 761   content: "[";
 762   padding-right: 0.25em;
 763 }
 764
 765 .doc b.button::after {
 766   content: "]";
 767   padding-left: 0.25em;
 768 }
 769
 770 .doc kbd {
 771   display: inline-block;
 772   font-size: calc(12 / var(--rem-base) * 1rem);
 773   background: var(--kbd-background);
 774   border: 1px solid var(--kbd-border-color);
 775   border-radius: 0.25em;
 776   box-shadow: 0 1px 0 var(--kbd-border-color), 0 0 0 0.1em var(--body-background) inset;
 777   padding: 0.25em 0.5em;
 778   vertical-align: text-bottom;
 779   white-space: nowrap; /* effectively ignores hyphens setting */
 780 }
 781
 782 .doc kbd,
 783 .doc .keyseq {
 784   line-height: 1;
 785 }
 786
 787 .doc .keyseq {
 788   font-size: calc(16 / var(--rem-base) * 1rem);
 789 }
 790
 791 .doc .keyseq kbd {
 792   margin: 0 0.125em;
 793 }
 794
 795 .doc .keyseq kbd:first-child {
 796   margin-left: 0;
 797 }
 798
 799 .doc .keyseq kbd:last-child {
 800   margin-right: 0;
 801 }
 802
 803 .doc .menuseq,
 804 .doc .path {
 805   hyphens: none;
 806 }
 807
 808 .doc .menuseq i.caret::before {
 809   content: "\203a";
 810   font-size: 1.1em;
 811   font-weight: var(--body-font-weight-bold);
 812   line-height: calc(1 / 1.1);
 813 }
 814
 815 .doc .nowrap {
 816   white-space: nowrap;
 817 }
 818
 819 .doc .nobreak {
 820   hyphens: none;
 821   word-wrap: normal;
 822 }