src/librustdoc/html/static/css/rustdoc.css

   1 /* See FiraSans-LICENSE.txt for the Fira Sans license. */
   2 @font-face {
   3         font-family: 'Fira Sans';
   4         font-style: normal;
   5         font-weight: 400;
   6         src: local('Fira Sans'),
   7                 url("FiraSans-Regular.woff2") format("woff2");
   8         font-display: swap;
   9 }
  10 @font-face {
  11         font-family: 'Fira Sans';
  12         font-style: normal;
  13         font-weight: 500;
  14         src: local('Fira Sans Medium'),
  15                 url("FiraSans-Medium.woff2") format("woff2");
  16         font-display: swap;
  17 }
  18
  19 /* See SourceSerif4-LICENSE.md for the Source Serif 4 license. */
  20 @font-face {
  21         font-family: 'Source Serif 4';
  22         font-style: normal;
  23         font-weight: 400;
  24         src: local('Source Serif 4'),
  25                 url("SourceSerif4-Regular.ttf.woff2") format("woff2");
  26         font-display: swap;
  27 }
  28 @font-face {
  29         font-family: 'Source Serif 4';
  30         font-style: italic;
  31         font-weight: 400;
  32         src: local('Source Serif 4 Italic'),
  33                 url("SourceSerif4-It.ttf.woff2") format("woff2");
  34         font-display: swap;
  35 }
  36 @font-face {
  37         font-family: 'Source Serif 4';
  38         font-style: normal;
  39         font-weight: 700;
  40         src: local('Source Serif 4 Bold'),
  41                 url("SourceSerif4-Bold.ttf.woff2") format("woff2");
  42         font-display: swap;
  43 }
  44
  45 /* See SourceCodePro-LICENSE.txt for the Source Code Pro license. */
  46 @font-face {
  47         font-family: 'Source Code Pro';
  48         font-style: normal;
  49         font-weight: 400;
  50         /* Avoid using locally installed font because bad versions are in circulation:
  51          * see https://github.com/rust-lang/rust/issues/24355 */
  52         src: url("SourceCodePro-Regular.ttf.woff2") format("woff2");
  53         font-display: swap;
  54 }
  55 @font-face {
  56         font-family: 'Source Code Pro';
  57         font-style: italic;
  58         font-weight: 400;
  59         src: url("SourceCodePro-It.ttf.woff2") format("woff2");
  60         font-display: swap;
  61 }
  62 @font-face {
  63         font-family: 'Source Code Pro';
  64         font-style: normal;
  65         font-weight: 600;
  66         src: url("SourceCodePro-Semibold.ttf.woff2") format("woff2");
  67         font-display: swap;
  68 }
  69
  70 /* Avoid using legacy CJK serif fonts in Windows like Batang. */
  71 @font-face {
  72         font-family: 'NanumBarunGothic';
  73         src: url("NanumBarunGothic.ttf.woff2") format("woff2");
  74         font-display: swap;
  75         unicode-range: U+AC00-D7AF, U+1100-11FF, U+3130-318F, U+A960-A97F, U+D7B0-D7FF;
  76 }
  77
  78 * {
  79         -webkit-box-sizing: border-box;
  80         -moz-box-sizing: border-box;
  81         box-sizing: border-box;
  82 }
  83
  84 /* This part handles the "default" theme being used depending on the system one. */
  85 html {
  86         content: "";
  87 }
  88 @media (prefers-color-scheme: light) {
  89         html {
  90                 content: "light";
  91         }
  92 }
  93 @media (prefers-color-scheme: dark) {
  94         html {
  95                 content: "dark";
  96         }
  97 }
  98
  99 /* General structure and fonts */
 100
 101 body {
 102         /* Line spacing at least 1.5 per Web Content Accessibility Guidelines
 103            https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
 104         font: 1rem/1.5 "Source Serif 4", NanumBarunGothic, serif;
 105         margin: 0;
 106         position: relative;
 107         /* We use overflow-wrap: break-word for Safari, which doesn't recognize
 108            `anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
 109         overflow-wrap: break-word;
 110         /* Then override it with `anywhere`, which is required to make non-Safari browsers break
 111            more aggressively when we want them to. */
 112         overflow-wrap: anywhere;
 113
 114         -webkit-font-feature-settings: "kern", "liga";
 115         -moz-font-feature-settings: "kern", "liga";
 116         font-feature-settings: "kern", "liga";
 117
 118         background-color: var(--main-background-color);
 119         color: var(--main-color);
 120 }
 121
 122 h1 {
 123         font-size: 1.5rem; /* 24px */
 124 }
 125 h2 {
 126         font-size: 1.375rem; /* 22px */
 127 }
 128 h3 {
 129         font-size: 1.25rem; /* 20px */
 130 }
 131 h1, h2, h3, h4, h5, h6 {
 132         font-weight: 500;
 133 }
 134 h1, h2, h3, h4 {
 135         margin: 20px 0 15px 0;
 136         padding-bottom: 6px;
 137 }
 138 .docblock h3, .docblock h4, h5, h6 {
 139         margin: 15px 0 5px 0;
 140 }
 141 h1.fqn {
 142         margin: 0;
 143         padding: 0;
 144         border-bottom-color: var(--headings-border-bottom-color);
 145 }
 146 h2, h3, h4 {
 147         border-bottom-color: var(--headings-border-bottom-color);
 148 }
 149 .main-heading {
 150         display: flex;
 151         flex-wrap: wrap;
 152         justify-content: space-between;
 153         padding-bottom: 6px;
 154         margin-bottom: 15px;
 155 }
 156 .main-heading a:hover {
 157         text-decoration: underline;
 158 }
 159 #toggle-all-docs {
 160         text-decoration: none;
 161 }
 162 /* The only headings that get underlines are:
 163          Markdown-generated headings within the top-doc
 164          Rustdoc-generated h2 section headings (e.g. "Implementations", "Required Methods", etc)
 165         Underlines elsewhere in the documentation break up visual flow and tend to invert
 166         section hierarchies. */
 167 h2,
 168 .top-doc .docblock > h3,
 169 .top-doc .docblock > h4 {
 170         border-bottom: 1px solid var(--headings-border-bottom-color);
 171 }
 172 h3.code-header {
 173         font-size: 1.125rem; /* 18px */
 174 }
 175 h4.code-header {
 176         font-size: 1rem;
 177 }
 178 .code-header {
 179         font-weight: 600;
 180         border-bottom-style: none;
 181         margin: 0;
 182         padding: 0;
 183         margin-top: 0.6em;
 184         margin-bottom: 0.4em;
 185 }
 186 .impl,
 187 .impl-items .method,
 188 .methods .method,
 189 .impl-items .type,
 190 .methods .type,
 191 .impl-items .associatedconstant,
 192 .methods .associatedconstant,
 193 .impl-items .associatedtype,
 194 .methods .associatedtype {
 195         flex-basis: 100%;
 196         font-weight: 600;
 197         position: relative;
 198 }
 199
 200 h1, h2, h3, h4, h5, h6,
 201 .sidebar,
 202 .mobile-topbar,
 203 a.source,
 204 .search-input,
 205 .search-results .result-name,
 206 .item-left > a,
 207 .out-of-band,
 208 span.since,
 209 details.rustdoc-toggle > summary::before,
 210 .content ul.crate a.crate,
 211 a.srclink,
 212 #help-button > button,
 213 details.rustdoc-toggle.top-doc > summary,
 214 details.rustdoc-toggle.top-doc > summary::before,
 215 details.rustdoc-toggle.non-exhaustive > summary,
 216 details.rustdoc-toggle.non-exhaustive > summary::before,
 217 .scraped-example-title,
 218 .more-examples-toggle summary, .more-examples-toggle .hide-more,
 219 .example-links a,
 220 /* This selector is for the items listed in the "all items" page. */
 221 #main-content > ul.docblock > li > a {
 222         font-family: "Fira Sans", Arial, NanumBarunGothic, sans-serif;
 223 }
 224
 225 h1, h2, h3, h4,
 226 a#toggle-all-docs,
 227 a.anchor,
 228 .small-section-header a,
 229 #source-sidebar a,
 230 pre.rust a,
 231 .sidebar h2 a,
 232 .sidebar h3 a,
 233 .mobile-topbar h2 a,
 234 .in-band a,
 235 .search-results a,
 236 .module-item .stab,
 237 .import-item .stab,
 238 .result-name .primitive > i, .result-name .keyword > i,
 239 .content .method .where,
 240 .content .fn .where,
 241 .content .where.fmt-newline {
 242         color: var(--main-color);
 243 }
 244
 245 ol, ul {
 246         padding-left: 24px;
 247 }
 248 ul ul, ol ul, ul ol, ol ol {
 249         margin-bottom: .625em;
 250 }
 251
 252 p {
 253         /* Paragraph spacing at least 1.5 times line spacing per Web Content Accessibility Guidelines.
 254            Line-height is 1.5rem, so line spacing is .5rem; .75em is 1.5 times that.
 255            https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
 256         margin: 0 0 .75em 0;
 257 }
 258
 259 summary {
 260         outline: none;
 261 }
 262
 263 /* Fix some style changes due to normalize.css 8 */
 264
 265 td,
 266 th {
 267         padding: 0;
 268 }
 269
 270 table {
 271         border-collapse: collapse;
 272 }
 273
 274 button,
 275 input,
 276 optgroup,
 277 select,
 278 textarea {
 279         color: inherit;
 280         font: inherit;
 281         margin: 0;
 282 }
 283
 284 button {
 285         /* Buttons on Safari have different default padding than other platforms. Make them the same. */
 286         padding: 1px 6px;
 287 }
 288
 289 /* end tweaks for normalize.css 8 */
 290
 291 .rustdoc {
 292         display: flex;
 293         flex-direction: row;
 294         flex-wrap: nowrap;
 295 }
 296
 297 main {
 298         position: relative;
 299         flex-grow: 1;
 300         padding: 10px 15px 40px 45px;
 301         min-width: 0;
 302 }
 303
 304 .source main {
 305         padding: 15px;
 306 }
 307
 308 .width-limiter {
 309         max-width: 960px;
 310         margin-right: auto;
 311 }
 312
 313 .source .width-limiter {
 314         max-width: unset;
 315 }
 316
 317 details:not(.rustdoc-toggle) summary {
 318         margin-bottom: .6em;
 319 }
 320
 321 code, pre, a.test-arrow, .code-header {
 322         font-family: "Source Code Pro", monospace;
 323 }
 324 .docblock code, .docblock-short code {
 325         border-radius: 3px;
 326         padding: 0 0.125em;
 327 }
 328 .docblock pre code, .docblock-short pre code {
 329         padding: 0;
 330 }
 331 pre {
 332         padding: 14px;
 333 }
 334 .docblock.item-decl {
 335         margin-left: 0;
 336 }
 337 .item-decl pre {
 338         overflow-x: auto;
 339 }
 340
 341 .source .content pre {
 342         padding: 20px;
 343 }
 344
 345 img {
 346         max-width: 100%;
 347 }
 348
 349 .source .content {
 350         max-width: none;
 351         overflow: visible;
 352         margin-left: 0px;
 353 }
 354
 355 .sub-container {
 356         display: flex;
 357         flex-direction: row;
 358         flex-wrap: nowrap;
 359 }
 360
 361 .sub-logo-container {
 362         display: none;
 363         margin-right: 20px;
 364 }
 365
 366 .source .sub-logo-container {
 367         display: block;
 368 }
 369
 370 .source .sub-logo-container > img {
 371         height: 60px;
 372         width: 60px;
 373         object-fit: contain;
 374 }
 375
 376 .sidebar, .mobile-topbar, .sidebar-menu-toggle {
 377         background-color: var(--sidebar-background-color);
 378 }
 379
 380 .sidebar {
 381         font-size: 0.875rem;
 382         width: 250px;
 383         min-width: 200px;
 384         overflow-y: scroll;
 385         position: sticky;
 386         height: 100vh;
 387         top: 0;
 388         left: 0;
 389 }
 390
 391 .sidebar-elems,
 392 .sidebar > .location {
 393         padding-left: 24px;
 394 }
 395
 396 .sidebar .location {
 397         overflow-wrap: anywhere;
 398 }
 399
 400 .rustdoc.source .sidebar {
 401         width: 50px;
 402         min-width: 0px;
 403         max-width: 300px;
 404         flex-grow: 0;
 405         flex-shrink: 0;
 406         flex-basis: auto;
 407         border-right: 1px solid;
 408         overflow-x: hidden;
 409         /* The sidebar is by default hidden  */
 410         overflow-y: hidden;
 411 }
 412
 413 .rustdoc.source .sidebar .sidebar-logo {
 414         display: none;
 415 }
 416
 417 .source .sidebar, #sidebar-toggle, #source-sidebar {
 418         background-color: var(--sidebar-background-color);
 419 }
 420
 421 #sidebar-toggle > button:hover, #sidebar-toggle > button:focus {
 422         background-color: var(--sidebar-background-color-hover);
 423 }
 424
 425 .source .sidebar > *:not(#sidebar-toggle) {
 426         opacity: 0;
 427         visibility: hidden;
 428 }
 429
 430 .source-sidebar-expanded .source .sidebar {
 431         overflow-y: auto;
 432 }
 433
 434 .source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
 435         opacity: 1;
 436         visibility: visible;
 437 }
 438
 439 #all-types {
 440         margin-top: 1em;
 441 }
 442
 443 /* Improve the scrollbar display on firefox */
 444 * {
 445         scrollbar-width: initial;
 446         scrollbar-color: var(--scrollbar-color);
 447 }
 448 .sidebar {
 449         scrollbar-width: thin;
 450         scrollbar-color: var(--scrollbar-color);
 451 }
 452
 453 /* Improve the scrollbar display on webkit-based browsers */
 454 ::-webkit-scrollbar {
 455         width: 12px;
 456 }
 457 .sidebar::-webkit-scrollbar {
 458         width: 8px;
 459 }
 460 ::-webkit-scrollbar-track {
 461         -webkit-box-shadow: inset 0;
 462         background-color: var(--scrollbar-track-background-color);
 463 }
 464 .sidebar::-webkit-scrollbar-track {
 465         background-color: var(--scrollbar-track-background-color);
 466 }
 467 ::-webkit-scrollbar-thumb, .sidebar::-webkit-scrollbar-thumb {
 468         background-color: var(--scrollbar-thumb-background-color);
 469 }
 470
 471 /* Everything else */
 472
 473 .hidden {
 474         display: none !important;
 475 }
 476
 477 .sidebar .logo-container {
 478         display: flex;
 479         margin-top: 10px;
 480         margin-bottom: 10px;
 481         justify-content: center;
 482 }
 483
 484 .version {
 485         overflow-wrap: break-word;
 486 }
 487
 488 .logo-container > img {
 489         height: 100px;
 490         width: 100px;
 491 }
 492
 493 .location:empty {
 494         border: none;
 495 }
 496
 497 .location a:first-of-type {
 498         font-weight: 500;
 499 }
 500
 501 .block {
 502         padding: 0;
 503 }
 504 .block ul, .block li {
 505         padding: 0;
 506         margin: 0;
 507         list-style: none;
 508 }
 509
 510 .block a,
 511 h2.location a {
 512         display: block;
 513         padding: 0.25rem;
 514         margin-left: -0.25rem;
 515
 516         text-overflow: ellipsis;
 517         overflow: hidden;
 518 }
 519
 520 .sidebar h2 {
 521         border-bottom: none;
 522         font-weight: 500;
 523         padding: 0;
 524         margin: 0;
 525         margin-top: 0.7rem;
 526         margin-bottom: 0.7rem;
 527 }
 528
 529 .sidebar h3 {
 530         font-size: 1.125rem; /* 18px */
 531         font-weight: 500;
 532         padding: 0;
 533         margin: 0;
 534 }
 535
 536 .sidebar-elems .block {
 537         margin-bottom: 2em;
 538 }
 539
 540 .sidebar-elems .block li a {
 541         white-space: nowrap;
 542 }
 543
 544 .mobile-topbar {
 545         display: none;
 546 }
 547
 548 .source .content pre.rust {
 549         white-space: pre;
 550         overflow: auto;
 551         padding-left: 0;
 552 }
 553
 554 .rustdoc .example-wrap {
 555         display: inline-flex;
 556         margin-bottom: 10px;
 557 }
 558
 559 .example-wrap {
 560         position: relative;
 561         width: 100%;
 562 }
 563
 564 .example-wrap > pre.line-number {
 565         overflow: initial;
 566         border: 1px solid;
 567         padding: 13px 8px;
 568         text-align: right;
 569         border-top-left-radius: 5px;
 570         border-bottom-left-radius: 5px;
 571 }
 572
 573 .example-wrap > pre.rust a:hover {
 574         text-decoration: underline;
 575 }
 576
 577 .line-numbers {
 578         text-align: right;
 579 }
 580 .rustdoc:not(.source) .example-wrap > pre:not(.line-number) {
 581         width: 100%;
 582         overflow-x: auto;
 583 }
 584
 585 .rustdoc:not(.source) .example-wrap > pre.line-numbers {
 586         width: auto;
 587         overflow-x: visible;
 588 }
 589
 590 .rustdoc .example-wrap > pre {
 591         margin: 0;
 592 }
 593
 594 .search-loading {
 595         text-align: center;
 596 }
 597
 598 .content > .example-wrap pre.line-numbers {
 599         position: relative;
 600         -webkit-user-select: none;
 601         -moz-user-select: none;
 602         -ms-user-select: none;
 603         user-select: none;
 604 }
 605 .line-numbers span {
 606         cursor: pointer;
 607 }
 608
 609 .docblock-short {
 610         overflow-wrap: break-word;
 611         overflow-wrap: anywhere;
 612 }
 613 .docblock-short p {
 614         display: inline;
 615         overflow: hidden;
 616         text-overflow: ellipsis;
 617         margin: 0;
 618 }
 619 /* Wrap non-pre code blocks (`text`) but not (```text```). */
 620 .docblock > :not(pre) > code,
 621 .docblock-short > :not(pre) > code {
 622         white-space: pre-wrap;
 623 }
 624
 625 .top-doc .docblock h2 { font-size: 1.375rem; }
 626 .top-doc .docblock h3 { font-size: 1.25rem; }
 627 .top-doc .docblock h4,
 628 .top-doc .docblock h5 {
 629         font-size: 1.125rem;
 630 }
 631 .top-doc .docblock h6 {
 632         font-size: 1rem;
 633 }
 634
 635 .docblock h5 { font-size: 1rem; }
 636 .docblock h6 { font-size: 0.875rem; }
 637 .docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5, .docblock h6 {
 638         border-bottom-color: var(--headings-border-bottom-color);
 639 }
 640
 641 .docblock {
 642         margin-left: 24px;
 643         position: relative;
 644 }
 645
 646 .docblock > :not(.more-examples-toggle):not(.example-wrap) {
 647         max-width: 100%;
 648         overflow-x: auto;
 649 }
 650
 651 .content .out-of-band {
 652         flex-grow: 0;
 653         font-size: 1.125rem;
 654         font-weight: normal;
 655         float: right;
 656 }
 657
 658 .method > .code-header, .trait-impl > .code-header {
 659         max-width: calc(100% - 41px);
 660         display: block;
 661 }
 662
 663 .content .in-band {
 664         flex-grow: 1;
 665         margin: 0px;
 666         padding: 0px;
 667         /* We use overflow-wrap: break-word for Safari, which doesn't recognize
 668            `anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
 669         overflow-wrap: break-word;
 670         /* Then override it with `anywhere`, which is required to make non-Safari browsers break
 671            more aggressively when we want them to. */
 672         overflow-wrap: anywhere;
 673         background-color: var(--main-background-color);
 674 }
 675
 676 .in-band > code, .in-band > .code-header {
 677         display: inline-block;
 678 }
 679
 680 .docblock code, .docblock-short code,
 681 pre, .rustdoc.source .example-wrap {
 682         background-color: var(--code-block-background-color);
 683 }
 684
 685 #main-content {
 686         position: relative;
 687 }
 688
 689 .content table {
 690         border-spacing: 0 5px;
 691 }
 692 .content td { vertical-align: top; }
 693 .content td:first-child { padding-right: 20px; }
 694 .content td p:first-child { margin-top: 0; }
 695 .content td h1, .content td h2 { margin-left: 0; font-size: 1.125rem; }
 696 .content tr:first-child td { border-top: 0; }
 697
 698 .docblock table {
 699         margin: .5em 0;
 700         width: calc(100% - 2px);
 701         overflow-x: auto;
 702         display: block;
 703 }
 704
 705 .docblock table td {
 706         padding: .5em;
 707         border: 1px dashed var(--border-color);
 708 }
 709
 710 .docblock table th {
 711         padding: .5em;
 712         text-align: left;
 713         border: 1px solid var(--border-color);
 714 }
 715
 716 .content .item-list {
 717         list-style-type: none;
 718         padding: 0;
 719 }
 720
 721 .content > .methods > .method {
 722         font-size: 1rem;
 723         position: relative;
 724 }
 725 /* Shift "where ..." part of method or fn definition down a line */
 726 .content .method .where,
 727 .content .fn .where,
 728 .content .where.fmt-newline {
 729         display: block;
 730         font-size: 0.875rem;
 731 }
 732
 733 .item-info {
 734         display: block;
 735 }
 736
 737 .content .item-info code {
 738         font-size: 0.875rem;
 739 }
 740
 741 .content .item-info {
 742         position: relative;
 743         margin-left: 24px;
 744 }
 745
 746 .content .impl-items .docblock, .content .impl-items .item-info {
 747         margin-bottom: .6em;
 748 }
 749
 750 #main-content > .item-info {
 751         margin-top: 0;
 752         margin-left: 0;
 753 }
 754
 755 nav.sub {
 756         position: relative;
 757         font-size: 1rem;
 758         flex-grow: 1;
 759         margin-bottom: 25px;
 760 }
 761 .source nav.sub {
 762         margin-left: 32px;
 763 }
 764 nav.sum { text-align: right; }
 765 nav.sub form { display: inline; }
 766
 767 a {
 768         text-decoration: none;
 769 }
 770
 771 .small-section-header {
 772         display: flex;
 773         justify-content: space-between;
 774         position: relative;
 775 }
 776
 777 .small-section-header:hover > .anchor {
 778         display: initial;
 779 }
 780
 781 .in-band:hover > .anchor, .impl:hover > .anchor, .method.trait-impl:hover > .anchor,
 782 .type.trait-impl:hover > .anchor, .associatedconstant.trait-impl:hover > .anchor,
 783 .associatedtype.trait-impl:hover > .anchor {
 784         display: inline-block;
 785         position: absolute;
 786 }
 787 .anchor {
 788         display: none;
 789         position: absolute;
 790         left: -0.5em;
 791         background: none !important;
 792 }
 793 .anchor.field {
 794         left: -5px;
 795 }
 796 .small-section-header > .anchor {
 797         left: -15px;
 798         padding-right: 8px;
 799 }
 800 h2.small-section-header > .anchor {
 801         padding-right: 6px;
 802 }
 803 .anchor::before {
 804         content: '§';
 805 }
 806
 807 .docblock a:not(.srclink):not(.test-arrow):not(.scrape-help):hover,
 808 .docblock-short a:not(.srclink):not(.test-arrow):not(.scrape-help):hover, .item-info a {
 809         text-decoration: underline;
 810 }
 811
 812 .block a.current.crate { font-weight: 500; }
 813
 814 /*  In most contexts we use `overflow-wrap: anywhere` to ensure that we can wrap
 815         as much as needed on mobile (see
 816         src/test/rustdoc-gui/type-declaration-overflow.goml for an example of why
 817         this matters). The `anywhere` value means:
 818
 819         "Soft wrap opportunities introduced by the word break are considered when
 820          calculating min-content intrinsic sizes."
 821
 822         https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#values
 823
 824         For table layouts, that becomes a problem: the browser tries to make each
 825         column as narrow as possible, and `overflow-wrap: anywhere` means it can do
 826         so by breaking words - even if some other column could be shrunk without
 827         breaking words! This shows up, for instance, in the `Structs` / `Modules` /
 828         `Functions` (etcetera) sections of a module page, and when a docblock
 829         contains a table.
 830
 831         So, for table layouts, override the default with break-word, which does
 832         _not_ affect min-content intrinsic sizes.
 833 */
 834 table,
 835 .item-table {
 836         overflow-wrap: break-word;
 837 }
 838
 839 .item-table {
 840         display: table;
 841 }
 842 .item-row {
 843         display: table-row;
 844 }
 845 .item-left, .item-right {
 846         display: table-cell;
 847 }
 848 .item-left {
 849         padding-right: 1.25rem;
 850 }
 851
 852 .search-container {
 853         position: relative;
 854         display: flex;
 855         height: 34px;
 856         margin-top: 4px;
 857 }
 858 .search-container > * {
 859         height: 100%;
 860 }
 861 .search-results-title {
 862         margin-top: 0;
 863         white-space: nowrap;
 864         /* flex layout allows shrinking the <select> appropriately if it becomes too large */
 865         display: inline-flex;
 866         max-width: 100%;
 867         /* make things look like in a line, despite the fact that we're using a layout
 868         with boxes (i.e. from the flex layout) */
 869         align-items: baseline;
 870 }
 871 #crate-search-div {
 872         display: inline-block;
 873         /* ensures that 100% in properties of #crate-search-div:after
 874         are relative to the size of this div */
 875         position: relative;
 876         /* allows this div (and with it the <select>-element "#crate-search") to be shrunk */
 877         min-width: 5em;
 878 }
 879 #crate-search {
 880         min-width: 115px;
 881         padding: 0;
 882         /* keep these two in sync with "@-moz-document url-prefix()" below */
 883         padding-left: 4px;
 884         padding-right: 23px;
 885         /* prevents the <select> from overflowing the containing div in case it's shrunk */
 886         max-width: 100%;
 887         /* contents can overflow because of max-width limit, then show ellipsis */
 888         text-overflow: ellipsis;
 889         border: 1px solid var(--border-color);
 890         border-radius: 4px;
 891         outline: none;
 892         cursor: pointer;
 893         -moz-appearance: none;
 894         -webkit-appearance: none;
 895         /* Removes default arrow from firefox */
 896         text-indent: 0.01px;
 897         background-color: var(--main-background-color);
 898 }
 899 /* cancel stylistic differences in padding in firefox
 900 for "appearance: none"-style (or equivalent) <select>s */
 901 @-moz-document url-prefix() {
 902         #crate-search {
 903                 padding-left: 0px; /* == 4px - 4px */
 904                 padding-right: 19px; /* == 23px - 4px */
 905         }
 906 }
 907 /* pseudo-element for holding the dropdown-arrow image; needs to be a separate thing
 908 so that we can apply CSS-filters to change the arrow color in themes */
 909 #crate-search-div::after {
 910         /* lets clicks through! */
 911         pointer-events: none;
 912         /* completely covers the underlying div */
 913         width: 100%;
 914         height: 100%;
 915         position: absolute;
 916         top: 0;
 917         left: 0;
 918         content: "";
 919         background-repeat: no-repeat;
 920         background-size: 20px;
 921         background-position: calc(100% - 2px) 56%;
 922         /* image is black color, themes should apply a "filter" property to change the color */
 923         background-image: /* AUTOREPLACE: */url("down-arrow.svg");
 924 }
 925 #crate-search > option {
 926         font-size: 1rem;
 927 }
 928 .search-input {
 929         /* Override Normalize.css: it has a rule that sets
 930            -webkit-appearance: textfield for search inputs. That
 931            causes rounded corners and no border on iOS Safari. */
 932         -webkit-appearance: none;
 933         /* Override Normalize.css: we have margins and do
 934          not want to overflow - the `moz` attribute is necessary
 935          until Firefox 29, too early to drop at this point */
 936         -moz-box-sizing: border-box !important;
 937         box-sizing: border-box !important;
 938         outline: none;
 939         border: 1px solid var(--border-color);
 940         border-radius: 2px;
 941         padding: 8px;
 942         font-size: 1rem;
 943         width: 100%;
 944         background-color: var(--button-background-color);
 945 }
 946 .search-input:focus {
 947         border-color: var(--search-input-focused-border-color);
 948 }
 949
 950 .search-results {
 951         display: none;
 952         padding-bottom: 2em;
 953 }
 954
 955 .search-results.active {
 956         display: block;
 957         /* prevent overhanging tabs from moving the first result */
 958         clear: both;
 959 }
 960
 961 .search-results .desc > span {
 962         white-space: nowrap;
 963         text-overflow: ellipsis;
 964         overflow: hidden;
 965         display: block;
 966 }
 967
 968 .search-results > a {
 969         display: block;
 970         /* A little margin ensures the browser's outlining of focused links has room to display. */
 971         margin-left: 2px;
 972         margin-right: 2px;
 973         border-bottom: 1px solid #aaa3;
 974 }
 975
 976 .search-results > a > div {
 977         display: flex;
 978         flex-flow: row wrap;
 979 }
 980
 981 .search-results .result-name, .search-results div.desc, .search-results .result-description {
 982         width: 50%;
 983 }
 984 .search-results .result-name {
 985         padding-right: 1em;
 986 }
 987
 988 .popover {
 989         font-size: 1rem;
 990         position: absolute;
 991         right: 0;
 992         z-index: 2;
 993         display: block;
 994         margin-top: 7px;
 995         border-radius: 3px;
 996         border: 1px solid var(--border-color);
 997         font-size: 1rem;
 998 }
 999
1000 /* This rule is to draw the little arrow connecting the settings menu to the gear icon. */
1001 .popover::before {
1002         content: '';
1003         position: absolute;
1004         right: 11px;
1005         border: solid var(--border-color);
1006         border-width: 1px 1px 0 0;
1007         display: inline-block;
1008         padding: 4px;
1009         transform: rotate(-45deg);
1010         top: -5px;
1011 }
1012
1013 .popover, .popover::before {
1014         background-color: var(--main-background-color);
1015         color: var(--main-color);
1016 }
1017
1018 #help-button .popover {
1019         max-width: 600px;
1020 }
1021
1022 #help-button .popover::before {
1023         right: 48px;
1024 }
1025
1026 #help-button dt {
1027         float: left;
1028         clear: left;
1029         display: block;
1030         margin-right: 0.5rem;
1031 }
1032 #help-button span.top, #help-button span.bottom {
1033         text-align: center;
1034         display: block;
1035         font-size: 1.125rem;
1036 }
1037 #help-button span.top {
1038         text-align: center;
1039         display: block;
1040         margin: 10px 0;
1041         border-bottom: 1px solid var(--border-color);
1042         padding-bottom: 4px;
1043         margin-bottom: 6px;
1044 }
1045 #help-button span.bottom {
1046         clear: both;
1047         border-top: 1px solid var(--border-color);
1048 }
1049 .side-by-side {
1050         text-align: initial;
1051 }
1052 .side-by-side > div {
1053         width: 50%;
1054         float: left;
1055         padding: 0 20px 20px 17px;
1056 }
1057
1058 .item-info .stab {
1059         width: fit-content;
1060         /* This min-height is needed to unify the height of the stab elements because some of them
1061            have emojis.
1062         */
1063         min-height: 36px;
1064         display: flex;
1065         align-items: center;
1066         white-space: pre-wrap;
1067 }
1068 .stab {
1069         padding: 3px;
1070         margin-bottom: 5px;
1071         font-size: 0.875rem;
1072         font-weight: normal;
1073 }
1074 .stab p {
1075         display: inline;
1076         margin: 0;
1077 }
1078
1079 .stab .emoji {
1080         font-size: 1.25rem;
1081         margin-right: 0.3rem;
1082 }
1083
1084 /* Black one-pixel outline around emoji shapes */
1085 .emoji {
1086         text-shadow:
1087                 1px 0 0 black,
1088                 -1px 0 0 black,
1089                 0  1px 0 black,
1090                 0 -1px 0 black;
1091 }
1092
1093 .module-item .stab,
1094 .import-item .stab {
1095         border-radius: 3px;
1096         display: inline-block;
1097         font-size: 0.875rem;
1098         line-height: 1.2;
1099         margin-bottom: 0;
1100         margin-left: 0.3125em;
1101         padding: 2px;
1102         vertical-align: text-bottom;
1103 }
1104
1105 .module-item.unstable,
1106 .import-item.unstable {
1107         opacity: 0.65;
1108 }
1109
1110 .since {
1111         font-weight: normal;
1112         font-size: initial;
1113 }
1114
1115 .rightside {
1116         padding-left: 12px;
1117         padding-right: 2px;
1118         position: initial;
1119         float: right;
1120 }
1121
1122 .rightside:not(a),
1123 .out-of-band {
1124         color: var(--right-side-color);
1125 }
1126
1127
1128 .impl-items .srclink, .impl .srclink, .methods .srclink {
1129         /* Override header settings otherwise it's too bold */
1130         font-weight: normal;
1131         font-size: 1rem;
1132 }
1133
1134 td.summary-column {
1135         width: 100%;
1136 }
1137
1138 .summary {
1139         padding-right: 0px;
1140 }
1141
1142 pre.rust .question-mark {
1143         font-weight: bold;
1144 }
1145
1146 .example-wrap.compile_fail,
1147 .example-wrap.should_panic {
1148         border-left: 2px solid var(--codeblock-error-color);
1149 }
1150
1151 .ignore.example-wrap {
1152         border-left: 2px solid var(--codeblock-ignore-color);
1153 }
1154
1155 .example-wrap.compile_fail:hover,
1156 .example-wrap.should_panic:hover {
1157         border-left: 2px solid var(--codeblock-error-hover-color);
1158 }
1159
1160 .example-wrap.ignore:hover {
1161         border-left: 2px solid var(--codeblock-ignore-hover-color);
1162 }
1163
1164 .example-wrap.compile_fail .tooltip,
1165 .example-wrap.should_panic .tooltip {
1166         color: var(--codeblock-error-color);
1167 }
1168
1169 .example-wrap.ignore .tooltip {
1170         color:  var(--codeblock-ignore-color);
1171 }
1172
1173 .example-wrap.compile_fail:hover .tooltip,
1174 .example-wrap.should_panic:hover .tooltip {
1175         color: var(--codeblock-error-hover-color);
1176 }
1177
1178 .example-wrap.ignore:hover .tooltip {
1179         color: var(--codeblock-ignore-hover-color);
1180 }
1181
1182 .example-wrap .tooltip {
1183         position: absolute;
1184         display: block;
1185         cursor: pointer;
1186         left: -25px;
1187         top: 5px;
1188 }
1189
1190 .example-wrap .tooltip::after {
1191         display: none;
1192         text-align: center;
1193         padding: 5px 3px 3px 3px;
1194         border-radius: 6px;
1195         margin-left: 5px;
1196         font-size: 1rem;
1197         border: 1px solid var(--border-color);
1198         position: absolute;
1199         width: max-content;
1200         top: -2px;
1201         z-index: 1;
1202 }
1203
1204 .example-wrap .tooltip::before {
1205         content: " ";
1206         position: absolute;
1207         top: 50%;
1208         left: 16px;
1209         margin-top: -5px;
1210         border-width: 5px;
1211         border-style: solid;
1212         display: none;
1213         z-index: 1;
1214 }
1215
1216 .example-wrap.ignore .tooltip::after {
1217         content: "This example is not tested";
1218 }
1219 .example-wrap.compile_fail .tooltip::after {
1220         content: "This example deliberately fails to compile";
1221 }
1222 .example-wrap.should_panic .tooltip::after {
1223         content: "This example panics";
1224 }
1225 .example-wrap.edition .tooltip::after {
1226         content: "This code runs with edition " attr(data-edition);
1227 }
1228
1229 .example-wrap .tooltip:hover::before, .example-wrap .tooltip:hover::after {
1230         display: inline;
1231 }
1232
1233 .example-wrap.compile_fail .tooltip,
1234 .example-wrap.should_panic .tooltip,
1235 .example-wrap.ignore .tooltip {
1236         font-weight: bold;
1237         font-size: 1.25rem;
1238 }
1239
1240 a.test-arrow {
1241         display: inline-block;
1242         visibility: hidden;
1243         position: absolute;
1244         padding: 5px 10px 5px 10px;
1245         border-radius: 5px;
1246         font-size: 1.375rem;
1247         top: 5px;
1248         right: 5px;
1249         z-index: 1;
1250 }
1251 .example-wrap:hover .test-arrow {
1252         visibility: visible;
1253 }
1254 a.test-arrow:hover {
1255         text-decoration: none;
1256 }
1257
1258 .code-attribute {
1259         font-weight: 300;
1260         color: var(--code-attribute-color);
1261 }
1262
1263 .item-spacer {
1264         width: 100%;
1265         height: 12px;
1266 }
1267
1268 .out-of-band > span.since {
1269         position: initial;
1270         font-size: 1.25rem;
1271 }
1272
1273 h3.variant {
1274         font-weight: 600;
1275         font-size: 1.125rem;
1276         margin-bottom: 10px;
1277         border-bottom: none;
1278 }
1279
1280 .sub-variant h4 {
1281         font-size: 1rem;
1282         font-weight: 400;
1283         border-bottom: none;
1284         margin-top: 0;
1285         margin-bottom: 0;
1286 }
1287
1288 .sub-variant {
1289         margin-left: 24px;
1290         margin-bottom: 40px;
1291 }
1292
1293 .sub-variant > .sub-variant-field {
1294         margin-left: 24px;
1295 }
1296
1297 :target > code, :target > .code-header {
1298         opacity: 1;
1299 }
1300
1301 :target {
1302         padding-right: 3px;
1303 }
1304
1305 .notable-traits-tooltip {
1306         display: inline-block;
1307         cursor: pointer;
1308 }
1309
1310 .notable-traits:hover .notable-traits-tooltiptext,
1311 .notable-traits .notable-traits-tooltiptext.force-tooltip {
1312         display: inline-block;
1313 }
1314
1315 .notable-traits .notable-traits-tooltiptext {
1316         display: none;
1317         padding: 5px 3px 3px 3px;
1318         border-radius: 6px;
1319         margin-left: 5px;
1320         z-index: 10;
1321         font-size: 1rem;
1322         cursor: default;
1323         position: absolute;
1324         border: 1px solid;
1325 }
1326
1327 .notable-traits-tooltip::after {
1328         /* The margin on the tooltip does not capture hover events,
1329            this extends the area of hover enough so that mouse hover is not
1330            lost when moving the mouse to the tooltip */
1331         content: "\00a0\00a0\00a0";
1332 }
1333
1334 .notable-traits .notable, .notable-traits .docblock {
1335         margin: 0;
1336 }
1337
1338 .notable-traits .notable {
1339         margin: 0;
1340         margin-bottom: 13px;
1341         font-size: 1.1875rem;
1342         font-weight: 600;
1343         display: block;
1344 }
1345
1346 .notable-traits .docblock code.content {
1347         margin: 0;
1348         padding: 0;
1349         font-size: 1.25rem;
1350 }
1351
1352 /* Example code has the "Run" button that needs to be positioned relative to the pre */
1353 pre.rust.rust-example-rendered {
1354         position: relative;
1355 }
1356
1357 pre.rust {
1358         tab-size: 4;
1359         -moz-tab-size: 4;
1360 }
1361
1362 .search-failed {
1363         text-align: center;
1364         margin-top: 20px;
1365         display: none;
1366 }
1367
1368 .search-failed.active {
1369         display: block;
1370 }
1371
1372 .search-failed > ul {
1373         text-align: left;
1374         max-width: 570px;
1375         margin-left: auto;
1376         margin-right: auto;
1377 }
1378
1379 #titles {
1380         height: 35px;
1381 }
1382
1383 #titles > button {
1384         float: left;
1385         width: 33.3%;
1386         text-align: center;
1387         font-size: 1.125rem;
1388         cursor: pointer;
1389         border: 0;
1390         border-top: 2px solid;
1391 }
1392
1393 #titles > button:first-child:last-child {
1394         margin-right: 1px;
1395         width: calc(100% - 1px);
1396 }
1397
1398 #titles > button:not(:last-child) {
1399         margin-right: 1px;
1400         width: calc(33.3% - 1px);
1401 }
1402
1403 #titles > button > div.count {
1404         display: inline-block;
1405         font-size: 1rem;
1406 }
1407
1408 .notable-traits {
1409         cursor: pointer;
1410         z-index: 2;
1411         margin-left: 5px;
1412 }
1413
1414 #sidebar-toggle {
1415         position: sticky;
1416         top: 0;
1417         left: 0;
1418         font-weight: bold;
1419         font-size: 1.25rem;
1420         border-bottom: 1px solid;
1421         display: flex;
1422         height: 40px;
1423         justify-content: center;
1424         align-items: center;
1425         z-index: 10;
1426 }
1427 #source-sidebar {
1428         width: 100%;
1429         z-index: 1;
1430         overflow: auto;
1431 }
1432 #source-sidebar > .title {
1433         font-size: 1.5rem;
1434         text-align: center;
1435         border-bottom: 1px solid var(--border-color);
1436         margin-bottom: 6px;
1437 }
1438 #sidebar-toggle > button {
1439         background: none;
1440         color: inherit;
1441         cursor: pointer;
1442         text-align: center;
1443         border: none;
1444         outline: none;
1445         position: absolute;
1446         top: 0;
1447         bottom: 0;
1448         left: 0;
1449         right: 0;
1450         /* work around button layout strangeness: https://stackoverflow.com/q/7271561 */
1451         width: 100%;
1452         /* iOS button gradient: https://stackoverflow.com/q/5438567 */
1453         -webkit-appearance: none;
1454         opacity: 1;
1455 }
1456 #settings-menu, #help-button {
1457         margin-left: 4px;
1458         outline: none;
1459 }
1460
1461 #settings-menu > a, #help-button > button, #copy-path {
1462         padding: 5px;
1463         width: 33px;
1464         border: 1px solid var(--border-color);
1465         border-radius: 2px;
1466         cursor: pointer;
1467 }
1468
1469 #settings-menu > a, #help-button > button {
1470         padding: 5px;
1471         height: 100%;
1472         display: block;
1473         background-color: var(--button-background-color);
1474 }
1475
1476 #copy-path {
1477         color: var(--copy-path-button-color);
1478 }
1479 #copy-path > img {
1480         filter: var(--copy-path-img-filter);
1481 }
1482 #copy-path:hover > img {
1483         filter: var(--copy-path-img-hover-filter);
1484 }
1485
1486 @keyframes rotating {
1487         from {
1488                 transform: rotate(0deg);
1489         }
1490         to {
1491                 transform: rotate(360deg);
1492         }
1493 }
1494 #settings-menu.rotate > a img {
1495         animation: rotating 2s linear infinite;
1496 }
1497
1498 .setting-line .radio-line input:checked {
1499         box-shadow: inset 0 0 0 3px var(--main-background-color);
1500         background-color: var(--settings-input-color);
1501 }
1502 .setting-line .radio-line input:focus {
1503         box-shadow: 0 0 1px 1px var(--settings-input-color);
1504 }
1505 /* In here we combine both `:focus` and `:checked` properties. */
1506 .setting-line .radio-line input:checked:focus {
1507         box-shadow: inset 0 0 0 3px var(--main-background-color),
1508                 0 0 2px 2px var(--settings-input-color);
1509 }
1510 .setting-line .radio-line input:hover {
1511         border-color: var(--settings-input-color) !important;
1512 }
1513 input:checked + .slider {
1514         background-color: var(--settings-input-color);
1515 }
1516
1517 #help-button > button {
1518         text-align: center;
1519         /* Rare exception to specifying font sizes in rem. Since this is acting
1520            as an icon, it's okay to specify their sizes in pixels. */
1521         font-size: 20px;
1522         padding-top: 2px;
1523 }
1524
1525 #copy-path {
1526         height: 34px;
1527         background-color: var(--main-background-color);
1528         margin-left: 10px;
1529         padding: 0;
1530         padding-left: 2px;
1531         border: 0;
1532 }
1533
1534 kbd {
1535         display: inline-block;
1536         padding: 3px 5px;
1537         font: 15px monospace;
1538         line-height: 10px;
1539         vertical-align: middle;
1540         border: solid 1px var(--border-color);
1541         border-radius: 3px;
1542         cursor: default;
1543 }
1544
1545 #main-content > ul {
1546         padding-left: 10px;
1547 }
1548 #main-content > ul > li {
1549         list-style: none;
1550 }
1551
1552 .non-exhaustive {
1553         margin-bottom: 1em;
1554 }
1555
1556 details.dir-entry {
1557         padding-left: 4px;
1558 }
1559
1560 details.dir-entry > summary {
1561         margin: 0 0 0 13px;
1562         list-style-position: outside;
1563         cursor: pointer;
1564 }
1565
1566 details.dir-entry div.folders, details.dir-entry div.files {
1567         padding-left: 23px;
1568 }
1569
1570 details.dir-entry a {
1571         display: block;
1572 }
1573
1574 /* The hideme class is used on summary tags that contain a span with
1575         placeholder text shown only when the toggle is closed. For instance,
1576         "Expand description" or "Show methods". */
1577 details.rustdoc-toggle > summary.hideme {
1578         cursor: pointer;
1579 }
1580
1581 details.rustdoc-toggle > summary {
1582         list-style: none;
1583 }
1584 details.rustdoc-toggle > summary::-webkit-details-marker,
1585 details.rustdoc-toggle > summary::marker {
1586         display: none;
1587 }
1588
1589 details.rustdoc-toggle > summary.hideme > span {
1590         margin-left: 9px;
1591 }
1592
1593 details.rustdoc-toggle > summary::before {
1594         content: "";
1595         cursor: pointer;
1596         width: 16px;
1597         height: 16px;
1598         background-repeat: no-repeat;
1599         background-position: top left;
1600         display: inline-block;
1601         vertical-align: middle;
1602         opacity: .5;
1603 }
1604
1605 details.rustdoc-toggle > summary.hideme > span,
1606 details.rustdoc-toggle > summary::before,
1607 .more-examples-toggle summary, .more-examples-toggle .hide-more {
1608         color: var(--toggles-color);
1609 }
1610
1611 /* Screen readers see the text version at the end the line.
1612         Visual readers see the icon at the start of the line, but small and transparent. */
1613 details.rustdoc-toggle > summary::after {
1614         content: "Expand";
1615         overflow: hidden;
1616         width: 0;
1617         height: 0;
1618         position: absolute;
1619 }
1620
1621 details.rustdoc-toggle > summary.hideme::after {
1622         /* "hideme" toggles already have a description when they're contracted */
1623         content: "";
1624 }
1625
1626 details.rustdoc-toggle > summary:focus::before,
1627 details.rustdoc-toggle > summary:hover::before {
1628         opacity: 1;
1629 }
1630
1631 details.rustdoc-toggle.top-doc > summary,
1632 details.rustdoc-toggle.top-doc > summary::before,
1633 details.rustdoc-toggle.non-exhaustive > summary,
1634 details.rustdoc-toggle.non-exhaustive > summary::before {
1635         font-size: 1rem;
1636 }
1637
1638 details.non-exhaustive {
1639         margin-bottom: 8px;
1640 }
1641
1642 details.rustdoc-toggle > summary.hideme::before {
1643         position: relative;
1644 }
1645
1646 details.rustdoc-toggle > summary:not(.hideme)::before {
1647         position: absolute;
1648         left: -24px;
1649         top: 4px;
1650 }
1651
1652 .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before {
1653         position: absolute;
1654         left: -24px;
1655 }
1656
1657 /* When a "hideme" summary is open and the "Expand description" or "Show
1658         methods" text is hidden, we want the [-] toggle that remains to not
1659         affect the layout of the items to its right. To do that, we use
1660         absolute positioning. Note that we also set position: relative
1661         on the parent <details> to make this work properly. */
1662 details.rustdoc-toggle[open] > summary.hideme {
1663         position: absolute;
1664 }
1665
1666 details.rustdoc-toggle {
1667         position: relative;
1668 }
1669
1670 details.rustdoc-toggle[open] > summary.hideme > span {
1671         display: none;
1672 }
1673
1674 details.rustdoc-toggle[open] > summary::before,
1675 details.rustdoc-toggle[open] > summary.hideme::before {
1676         background-image: /* AUTOREPLACE: */url("toggle-minus.svg");
1677 }
1678
1679 details.rustdoc-toggle > summary::before {
1680         background-image: /* AUTOREPLACE: */url("toggle-plus.svg");
1681 }
1682
1683 details.rustdoc-toggle[open] > summary::before,
1684 details.rustdoc-toggle[open] > summary.hideme::before {
1685         width: 16px;
1686         height: 16px;
1687         background-repeat: no-repeat;
1688         background-position: top left;
1689         display: inline-block;
1690         content: "";
1691 }
1692
1693 details.rustdoc-toggle[open] > summary::after,
1694 details.rustdoc-toggle[open] > summary.hideme::after {
1695         content: "Collapse";
1696 }
1697
1698 /* This is needed in docblocks to have the "▶" element to be on the same line. */
1699 .docblock summary > * {
1700         display: inline-block;
1701 }
1702
1703 /* Media Queries */
1704
1705 /*
1706 WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY;
1707 If you update this line, then you also need to update the line with the same warning
1708 in storage.js plus the media query with (max-width: 700px)
1709 */
1710 @media (min-width: 701px) {
1711         /* In case there is no documentation before a code block, we need to add some margin at the top
1712         to prevent an overlay between the "collapse toggle" and the information tooltip.
1713         However, it's not needed with smaller screen width because the doc/code block is always put
1714         "one line" below. */
1715         .docblock > .example-wrap:first-child .tooltip {
1716                 margin-top: 16px;
1717         }
1718
1719         /* When we expand the sidebar on the source code page, we hide the logo on the left of the
1720         search bar to have more space. */
1721         .source-sidebar-expanded .source .sidebar + main .width-limiter .sub-logo-container.rust-logo {
1722                 display: none;
1723         }
1724
1725         .source-sidebar-expanded .source .sidebar {
1726                 width: 300px;
1727         }
1728 }
1729
1730 /*
1731 WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
1732 If you update this line, then you also need to update the line with the same warning
1733 in storage.js plus the media query with (min-width: 701px)
1734 */
1735 @media (max-width: 700px) {
1736         /* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
1737            or visiting a URL with a fragment like `#method.new`, we don't want the item to be obscured
1738            by the topbar. Anything with an `id` gets scroll-margin-top equal to .mobile-topbar's size.
1739         */
1740         *[id] {
1741                 scroll-margin-top: 45px;
1742         }
1743
1744         .rustdoc {
1745                 padding-top: 0px;
1746                 /* Sidebar should overlay main content, rather than pushing main content to the right.
1747                    Turn off `display: flex` on the body element. */
1748                 display: block;
1749         }
1750
1751         main {
1752                 padding-left: 15px;
1753                 padding-top: 0px;
1754         }
1755
1756         .main-heading {
1757                 flex-direction: column;
1758         }
1759
1760         .content .out-of-band {
1761                 text-align: left;
1762                 margin-left: initial;
1763                 padding: initial;
1764         }
1765
1766         .content .out-of-band .since::before {
1767                 content: "Since ";
1768         }
1769
1770         #copy-path {
1771                 display: none;
1772         }
1773
1774         /* Hide the logo and item name from the sidebar. Those are displayed
1775            in the mobile-topbar instead. */
1776         .sidebar .sidebar-logo,
1777         .sidebar .location {
1778                 display: none;
1779         }
1780
1781         .sidebar {
1782                 position: fixed;
1783                 top: 45px;
1784                 /* Hide the sidebar offscreen while not in use. Doing this instead of display: none means
1785                    the sidebar stays visible for screen readers, which is useful for navigation. */
1786                 left: -1000px;
1787                 margin-left: 0;
1788                 margin: 0;
1789                 padding: 0;
1790                 z-index: 11;
1791                 /* Reduce height slightly to account for mobile topbar. */
1792                 height: calc(100vh - 45px);
1793         }
1794
1795         /* The source view uses a different design for the sidebar toggle, and doesn't have a topbar,
1796            so don't bump down the main content or the sidebar. */
1797         .source main,
1798         .rustdoc.source .sidebar {
1799                 top: 0;
1800                 padding: 0;
1801                 height: 100vh;
1802                 border: 0;
1803         }
1804
1805         .sidebar.shown,
1806         .source-sidebar-expanded .source .sidebar,
1807         .sidebar:focus-within {
1808                 left: 0;
1809         }
1810
1811         .rustdoc.source > .sidebar {
1812                 position: fixed;
1813                 margin: 0;
1814                 z-index: 11;
1815                 width: 0;
1816         }
1817
1818         .mobile-topbar .location a {
1819                 padding: 0;
1820                 margin: 0;
1821         }
1822
1823         .mobile-topbar .location {
1824                 border: none;
1825                 padding: 0;
1826                 margin: auto 0.5em auto auto;
1827                 text-overflow: ellipsis;
1828                 overflow: hidden;
1829                 white-space: nowrap;
1830                 /* Rare exception to specifying font sizes in rem. Since the topbar
1831                    height is specified in pixels, this also has to be specified in
1832                    pixels to avoid overflowing the topbar when the user sets a bigger
1833                    font size. */
1834                 font-size: 24px;
1835         }
1836
1837         .mobile-topbar .logo-container {
1838                 max-height: 45px;
1839         }
1840
1841         .mobile-topbar .logo-container > img {
1842                 max-width: 35px;
1843                 max-height: 35px;
1844                 margin-left: 20px;
1845                 margin-top: 5px;
1846                 margin-bottom: 5px;
1847         }
1848
1849         .mobile-topbar {
1850                 display: flex;
1851                 flex-direction: row;
1852                 position: sticky;
1853                 z-index: 10;
1854                 font-size: 2rem;
1855                 height: 45px;
1856                 width: 100%;
1857                 left: 0;
1858                 top: 0;
1859         }
1860
1861         .source .mobile-topbar {
1862                 display: none;
1863         }
1864
1865         .sidebar-menu-toggle {
1866                 width: 45px;
1867                 /* Rare exception to specifying font sizes in rem. Since this is acting
1868                    as an icon, it's okay to specify its sizes in pixels. */
1869                 font-size: 32px;
1870                 border: none;
1871         }
1872
1873         .sidebar-elems {
1874                 margin-top: 1em;
1875                 background-color: var(--sidebar-background-color);
1876         }
1877
1878         .content {
1879                 margin-left: 0px;
1880         }
1881
1882         .source .content {
1883                 margin-top: 10px;
1884         }
1885
1886         .anchor {
1887                 display: none !important;
1888         }
1889
1890         .notable-traits {
1891                 position: absolute;
1892                 left: -22px;
1893                 top: 24px;
1894         }
1895
1896         #titles > button > div.count {
1897                 float: left;
1898                 width: 100%;
1899         }
1900
1901         #titles {
1902                 height: 50px;
1903         }
1904
1905         /* Because of ios, we need to actually have a full height sidebar title so the
1906          * actual sidebar can show up. But then we need to make it transparent so we don't
1907          * hide content. The filler just allows to create the background for the sidebar
1908          * title. But because of the absolute position, I had to lower the z-index.
1909          */
1910         #sidebar-filler {
1911                 position: fixed;
1912                 left: 45px;
1913                 width: calc(100% - 45px);
1914                 top: 0;
1915                 height: 45px;
1916                 z-index: -1;
1917                 border-bottom: 1px solid;
1918         }
1919
1920         #main-content > details.rustdoc-toggle > summary::before,
1921         #main-content > div > details.rustdoc-toggle > summary::before {
1922                 left: -11px;
1923         }
1924
1925         #sidebar-toggle {
1926                 position: fixed;
1927                 left: 1px;
1928                 top: 100px;
1929                 width: 30px;
1930                 font-size: 1.5rem;
1931                 text-align: center;
1932                 padding: 0;
1933                 z-index: 10;
1934                 border-top-right-radius: 3px;
1935                 border-bottom-right-radius: 3px;
1936                 cursor: pointer;
1937                 font-weight: bold;
1938                 border: 1px solid;
1939                 border-left: 0;
1940         }
1941
1942         .source-sidebar-expanded #sidebar-toggle {
1943                 left: unset;
1944                 top: unset;
1945                 width: unset;
1946                 border-top-right-radius: unset;
1947                 border-bottom-right-radius: unset;
1948                 position: sticky;
1949                 border: 0;
1950                 border-bottom: 1px solid;
1951         }
1952
1953         #source-sidebar {
1954                 z-index: 11;
1955         }
1956
1957         #main-content > .line-numbers {
1958                 margin-top: 0;
1959         }
1960
1961         .notable-traits .notable-traits-tooltiptext {
1962                 left: 0;
1963                 top: 100%;
1964         }
1965
1966         /* We don't display the help button on mobile devices. */
1967         #help-button {
1968                 display: none;
1969         }
1970
1971         /* Display an alternating layout on tablets and phones */
1972         .item-table {
1973                 display: block;
1974         }
1975         .item-row {
1976                 display: flex;
1977                 flex-flow: column wrap;
1978         }
1979         .item-left, .item-right {
1980                 width: 100%;
1981         }
1982
1983         /* Display an alternating layout on tablets and phones */
1984         .search-results > a {
1985                 border-bottom: 1px solid #aaa9;
1986                 padding: 5px 0px;
1987         }
1988         .search-results .result-name, .search-results div.desc, .search-results .result-description {
1989                 width: 100%;
1990         }
1991         .search-results div.desc, .search-results .result-description, .item-right {
1992                 padding-left: 2em;
1993         }
1994
1995         .source-sidebar-expanded .source .sidebar {
1996                 max-width: 100vw;
1997                 width: 100vw;
1998         }
1999
2000         /* Position of the "[-]" element. */
2001         details.rustdoc-toggle:not(.top-doc) > summary {
2002                 margin-left: 10px;
2003         }
2004         .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before,
2005         #main-content > details.rustdoc-toggle:not(.top-doc) > summary::before,
2006         #main-content > div > details.rustdoc-toggle > summary::before {
2007                 left: -11px;
2008         }
2009
2010         /* Align summary-nested and unnested item-info gizmos. */
2011         .content .impl-items > .item-info {
2012                 margin-left: 34px;
2013         }
2014 }
2015
2016 @media print {
2017         nav.sidebar, nav.sub, .content .out-of-band, a.srclink, #copy-path,
2018         details.rustdoc-toggle[open] > summary::before, details.rustdoc-toggle > summary::before,
2019         details.rustdoc-toggle.top-doc > summary {
2020                 display: none;
2021         }
2022
2023         .docblock {
2024                 margin-left: 0;
2025         }
2026
2027         main {
2028                 padding: 10px;
2029         }
2030 }
2031
2032 @media (max-width: 464px) {
2033         #titles, #titles > button {
2034                 height: 73px;
2035         }
2036
2037         #crate-search {
2038                 border-radius: 4px;
2039         }
2040
2041         .docblock {
2042                 margin-left: 12px;
2043         }
2044
2045         .docblock code {
2046                 overflow-wrap: break-word;
2047                 overflow-wrap: anywhere;
2048         }
2049
2050         .sub-container {
2051                 flex-direction: column;
2052         }
2053
2054         .sub-logo-container {
2055                 align-self: center;
2056         }
2057
2058         .source .sub-logo-container > img {
2059                 height: 35px;
2060                 width: 35px;
2061         }
2062
2063         #sidebar-toggle {
2064                 top: 10px;
2065         }
2066         .source-sidebar-expanded #sidebar-toggle {
2067                 top: unset;
2068         }
2069 }
2070
2071 .method-toggle summary,
2072 .implementors-toggle summary,
2073 .impl {
2074         margin-bottom: 0.75em;
2075 }
2076
2077 .method-toggle[open] {
2078         margin-bottom: 2em;
2079 }
2080
2081 .implementors-toggle[open]  {
2082         margin-bottom: 2em;
2083 }
2084
2085 #trait-implementations-list .method-toggle,
2086 #synthetic-implementations-list .method-toggle,
2087 #blanket-implementations-list .method-toggle {
2088         margin-bottom: 1em;
2089 }
2090
2091 /* Begin: styles for --scrape-examples feature */
2092
2093 .scraped-example-list .scrape-help {
2094         margin-left: 10px;
2095         padding: 0 4px;
2096         font-weight: normal;
2097         font-size: 12px;
2098         position: relative;
2099         bottom: 1px;
2100         background: transparent;
2101         border-width: 1px;
2102         border-style: solid;
2103         border-radius: 50px;
2104 }
2105
2106 .scraped-example .code-wrapper {
2107         position: relative;
2108         display: flex;
2109         flex-direction: row;
2110         flex-wrap: wrap;
2111         width: 100%;
2112 }
2113
2114 .scraped-example:not(.expanded) .code-wrapper {
2115         max-height: 240px;
2116 }
2117
2118 .scraped-example:not(.expanded) .code-wrapper pre {
2119         overflow-y: hidden;
2120         max-height: 240px;
2121         padding-bottom: 0;
2122 }
2123
2124 .scraped-example:not(.expanded) .code-wrapper pre.line-numbers {
2125         overflow-x: hidden;
2126 }
2127
2128 .scraped-example .code-wrapper .prev {
2129         position: absolute;
2130         top: 0.25em;
2131         right: 2.25em;
2132         z-index: 100;
2133         cursor: pointer;
2134 }
2135
2136 .scraped-example .code-wrapper .next {
2137         position: absolute;
2138         top: 0.25em;
2139         right: 1.25em;
2140         z-index: 100;
2141         cursor: pointer;
2142 }
2143
2144 .scraped-example .code-wrapper .expand {
2145         position: absolute;
2146         top: 0.25em;
2147         right: 0.25em;
2148         z-index: 100;
2149         cursor: pointer;
2150 }
2151
2152 .scraped-example:not(.expanded) .code-wrapper:before {
2153         content: " ";
2154         width: 100%;
2155         height: 5px;
2156         position: absolute;
2157         z-index: 100;
2158         top: 0;
2159 }
2160
2161 .scraped-example:not(.expanded) .code-wrapper:after {
2162         content: " ";
2163         width: 100%;
2164         height: 5px;
2165         position: absolute;
2166         z-index: 100;
2167         bottom: 0;
2168 }
2169
2170 .scraped-example .code-wrapper .line-numbers {
2171         margin: 0;
2172         padding: 14px 0;
2173 }
2174
2175 .scraped-example .code-wrapper .line-numbers span {
2176         padding: 0 14px;
2177 }
2178
2179 .scraped-example .code-wrapper .example-wrap {
2180         flex: 1;
2181         overflow-x: auto;
2182         overflow-y: hidden;
2183         margin-bottom: 0;
2184 }
2185
2186 .scraped-example:not(.expanded) .code-wrapper .example-wrap {
2187         overflow-x: hidden;
2188 }
2189
2190 .scraped-example .code-wrapper .example-wrap pre.rust {
2191         overflow-x: inherit;
2192         width: inherit;
2193         overflow-y: hidden;
2194 }
2195
2196
2197 .more-examples-toggle {
2198         max-width: calc(100% + 25px);
2199         margin-top: 10px;
2200         margin-left: -25px;
2201 }
2202
2203 .more-examples-toggle .hide-more {
2204         margin-left: 25px;
2205         margin-bottom: 5px;
2206         cursor: pointer;
2207 }
2208
2209 .more-scraped-examples {
2210         margin-left: 5px;
2211         display: flex;
2212         flex-direction: row;
2213 }
2214
2215 .more-scraped-examples-inner {
2216         /* 20px is width of toggle-line + toggle-line-inner */
2217         width: calc(100% - 20px);
2218 }
2219
2220 .toggle-line {
2221         align-self: stretch;
2222         margin-right: 10px;
2223         margin-top: 5px;
2224         padding: 0 4px;
2225         cursor: pointer;
2226 }
2227
2228 .toggle-line-inner {
2229         min-width: 2px;
2230         height: 100%;
2231 }
2232
2233 .more-scraped-examples .scraped-example {
2234         margin-bottom: 20px;
2235 }
2236
2237 .more-scraped-examples .scraped-example:last-child {
2238         margin-bottom: 0;
2239 }
2240
2241 .example-links a {
2242         margin-top: 20px;
2243 }
2244
2245 .example-links ul {
2246         margin-bottom: 0;
2247 }
2248
2249 /* End: styles for --scrape-examples feature */