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