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

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