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