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