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