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