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