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