1 /* See FiraSans-LICENSE.txt for the Fira Sans license. */
3 font-family: 'Fira Sans';
6 src: local('Fira Sans'),
7 url("FiraSans-Regular.woff2") format("woff2");
11 font-family: 'Fira Sans';
14 src: local('Fira Sans Medium'),
15 url("FiraSans-Medium.woff2") format("woff2");
19 /* See SourceSerif4-LICENSE.md for the Source Serif 4 license. */
21 font-family: 'Source Serif 4';
24 src: local('Source Serif 4'),
25 url("SourceSerif4-Regular.ttf.woff2") format("woff2");
29 font-family: 'Source Serif 4';
32 src: local('Source Serif 4 Italic'),
33 url("SourceSerif4-It.ttf.woff2") format("woff2");
37 font-family: 'Source Serif 4';
40 src: local('Source Serif 4 Bold'),
41 url("SourceSerif4-Bold.ttf.woff2") format("woff2");
45 /* See SourceCodePro-LICENSE.txt for the Source Code Pro license. */
47 font-family: 'Source Code Pro';
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");
56 font-family: 'Source Code Pro';
59 src: url("SourceCodePro-It.ttf.woff2") format("woff2");
63 font-family: 'Source Code Pro';
66 src: url("SourceCodePro-Semibold.ttf.woff2") format("woff2");
70 /* Avoid using legacy CJK serif fonts in Windows like Batang. */
72 font-family: 'NanumBarunGothic';
73 src: url("NanumBarunGothic.ttf.woff2") format("woff2");
75 unicode-range: U+AC00-D7AF, U+1100-11FF, U+3130-318F, U+A960-A97F, U+D7B0-D7FF;
79 -webkit-box-sizing: border-box;
80 -moz-box-sizing: border-box;
81 box-sizing: border-box;
84 /* This part handles the "default" theme being used depending on the system one. */
88 @media (prefers-color-scheme: light) {
93 @media (prefers-color-scheme: dark) {
99 /* General structure and fonts */
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;
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;
114 -webkit-font-feature-settings: "kern", "liga";
115 -moz-font-feature-settings: "kern", "liga";
116 font-feature-settings: "kern", "liga";
118 background-color: var(--main-background-color);
119 color: var(--main-color);
123 font-size: 1.5rem; /* 24px */
126 font-size: 1.375rem; /* 22px */
129 font-size: 1.25rem; /* 20px */
131 h1, h2, h3, h4, h5, h6 {
135 margin: 20px 0 15px 0;
138 .docblock h3, .docblock h4, h5, h6 {
139 margin: 15px 0 5px 0;
144 border-bottom-color: var(--headings-border-bottom-color);
147 border-bottom-color: var(--headings-border-bottom-color);
152 justify-content: space-between;
156 .main-heading a:hover {
157 text-decoration: underline;
160 text-decoration: none;
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. */
168 .top-doc .docblock > h3,
169 .top-doc .docblock > h4 {
170 border-bottom: 1px solid var(--headings-border-bottom-color);
173 font-size: 1.125rem; /* 18px */
180 border-bottom-style: none;
184 margin-bottom: 0.4em;
191 .impl-items .associatedconstant,
192 .methods .associatedconstant,
193 .impl-items .associatedtype,
194 .methods .associatedtype {
200 h1, h2, h3, h4, h5, h6,
205 .search-results .result-name,
209 details.rustdoc-toggle > summary::before,
210 .content ul.crate a.crate,
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,
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;
228 .small-section-header a,
238 .result-name .primitive > i, .result-name .keyword > i,
239 .content .method .where,
241 .content .where.fmt-newline {
242 color: var(--main-color);
248 ul ul, ol ul, ul ol, ol ol {
249 margin-bottom: .625em;
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 */
263 /* Fix some style changes due to normalize.css 8 */
271 border-collapse: collapse;
285 /* Buttons on Safari have different default padding than other platforms. Make them the same. */
289 /* end tweaks for normalize.css 8 */
300 padding: 10px 15px 40px 45px;
313 .source .width-limiter {
317 details:not(.rustdoc-toggle) summary {
321 code, pre, a.test-arrow, .code-header {
322 font-family: "Source Code Pro", monospace;
324 .docblock code, .docblock-short code {
328 .docblock pre code, .docblock-short pre code {
334 .docblock.item-decl {
341 .source .content pre {
361 .sub-logo-container {
366 .source .sub-logo-container {
370 .source .sub-logo-container > img {
376 .sidebar, .mobile-topbar, .sidebar-menu-toggle {
377 background-color: var(--sidebar-background-color);
392 .sidebar > .location {
397 overflow-wrap: anywhere;
400 .rustdoc.source .sidebar {
407 border-right: 1px solid;
409 /* The sidebar is by default hidden */
413 .rustdoc.source .sidebar .sidebar-logo {
417 .source .sidebar, #sidebar-toggle, #source-sidebar {
418 background-color: var(--sidebar-background-color);
421 #sidebar-toggle > button:hover, #sidebar-toggle > button:focus {
422 background-color: var(--sidebar-background-color-hover);
425 .source .sidebar > *:not(#sidebar-toggle) {
430 .source-sidebar-expanded .source .sidebar {
434 .source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
443 /* Improve the scrollbar display on firefox */
445 scrollbar-width: initial;
446 scrollbar-color: var(--scrollbar-color);
449 scrollbar-width: thin;
450 scrollbar-color: var(--scrollbar-color);
453 /* Improve the scrollbar display on webkit-based browsers */
454 ::-webkit-scrollbar {
457 .sidebar::-webkit-scrollbar {
460 ::-webkit-scrollbar-track {
461 -webkit-box-shadow: inset 0;
462 background-color: var(--scrollbar-track-background-color);
464 .sidebar::-webkit-scrollbar-track {
465 background-color: var(--scrollbar-track-background-color);
467 ::-webkit-scrollbar-thumb, .sidebar::-webkit-scrollbar-thumb {
468 background-color: var(--scrollbar-thumb-background-color);
471 /* Everything else */
474 display: none !important;
477 .sidebar .logo-container {
481 justify-content: center;
485 overflow-wrap: break-word;
488 .logo-container > img {
497 .location a:first-of-type {
504 .block ul, .block li {
514 margin-left: -0.25rem;
516 text-overflow: ellipsis;
526 margin-bottom: 0.7rem;
530 font-size: 1.125rem; /* 18px */
536 .sidebar-elems .block {
540 .sidebar-elems .block li a {
548 .source .content pre.rust {
554 .rustdoc .example-wrap {
555 display: inline-flex;
564 .example-wrap > pre.line-number {
569 border-top-left-radius: 5px;
570 border-bottom-left-radius: 5px;
573 .example-wrap > pre.rust a:hover {
574 text-decoration: underline;
580 .rustdoc:not(.source) .example-wrap > pre:not(.line-number) {
585 .rustdoc:not(.source) .example-wrap > pre.line-numbers {
590 .rustdoc .example-wrap > pre {
598 .content > .example-wrap pre.line-numbers {
600 -webkit-user-select: none;
601 -moz-user-select: none;
602 -ms-user-select: none;
610 overflow-wrap: break-word;
611 overflow-wrap: anywhere;
613 text-overflow: ellipsis;
615 /* Wrap non-pre code blocks (`text`) but not (```text```). */
616 .docblock > :not(pre) > code,
617 .docblock-short > code {
618 white-space: pre-wrap;
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 {
627 .top-doc .docblock h6 {
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);
642 .docblock > :not(.more-examples-toggle):not(.example-wrap) {
647 .content .out-of-band {
654 .method > .code-header, .trait-impl > .code-header {
655 max-width: calc(100% - 41px);
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);
672 .in-band > code, .in-band > .code-header {
673 display: inline-block;
676 .docblock code, .docblock-short code,
677 pre, .rustdoc.source .example-wrap {
678 background-color: var(--code-block-background-color);
687 width: calc(100% - 2px);
694 border: 1px dashed var(--border-color);
701 border: 1px solid var(--border-color);
704 .content .item-list {
705 list-style-type: none;
709 .content > .methods > .method {
713 /* Shift "where ..." part of method or fn definition down a line */
714 .content .method .where,
716 .content .where.fmt-newline {
725 .content .item-info code {
729 .content .item-info {
734 .content .impl-items .docblock, .content .impl-items .item-info {
738 #main-content > .item-info {
752 nav.sum { text-align: right; }
753 nav.sub form { display: inline; }
756 text-decoration: none;
757 background: transparent;
760 .small-section-header {
762 justify-content: space-between;
766 .small-section-header:hover > .anchor {
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;
780 background: none !important;
785 .small-section-header > .anchor {
789 h2.small-section-header > .anchor {
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;
801 .block a.current.crate { font-weight: 500; }
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:
808 "Soft wrap opportunities introduced by the word break are considered when
809 calculating min-content intrinsic sizes."
811 https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#values
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
820 So, for table layouts, override the default with break-word, which does
821 _not_ affect min-content intrinsic sizes.
825 overflow-wrap: break-word;
834 .item-left, .item-right {
838 padding-right: 1.25rem;
847 .search-container > * {
850 .search-results-title {
853 /* flex layout allows shrinking the <select> appropriately if it becomes too large */
854 display: inline-flex;
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;
861 display: inline-block;
862 /* ensures that 100% in properties of #crate-search-div:after
863 are relative to the size of this div */
865 /* allows this div (and with it the <select>-element "#crate-search") to be shrunk */
871 /* keep these two in sync with "@-moz-document url-prefix()" below */
874 /* prevents the <select> from overflowing the containing div in case it's shrunk */
876 /* contents can overflow because of max-width limit, then show ellipsis */
877 text-overflow: ellipsis;
878 border: 1px solid var(--border-color);
882 -moz-appearance: none;
883 -webkit-appearance: none;
884 /* Removes default arrow from firefox */
886 background-color: var(--main-background-color);
888 /* cancel stylistic differences in padding in firefox
889 for "appearance: none"-style (or equivalent) <select>s */
890 @-moz-document url-prefix() {
892 padding-left: 0px; /* == 4px - 4px */
893 padding-right: 19px; /* == 23px - 4px */
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 */
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");
914 #crate-search > option {
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;
928 border: 1px solid var(--border-color);
933 background-color: var(--button-background-color);
935 .search-input:focus {
936 border-color: var(--search-input-focused-border-color);
944 .search-results.active {
946 /* prevent overhanging tabs from moving the first result */
950 .search-results .desc > span {
952 text-overflow: ellipsis;
957 .search-results > a {
959 /* A little margin ensures the browser's outlining of focused links has room to display. */
962 border-bottom: 1px solid #aaa3;
965 .search-results > a > div {
970 .search-results .result-name, .search-results div.desc, .search-results .result-description {
973 .search-results .result-name {
985 border: 1px solid var(--border-color);
989 /* This rule is to draw the little arrow connecting the settings menu to the gear icon. */
994 border: solid var(--border-color);
995 border-width: 1px 1px 0 0;
996 display: inline-block;
998 transform: rotate(-45deg);
1002 .popover, .popover::before {
1003 background-color: var(--main-background-color);
1004 color: var(--main-color);
1007 #help-button .popover {
1011 #help-button .popover::before {
1019 margin-right: 0.5rem;
1021 #help-button span.top, #help-button span.bottom {
1024 font-size: 1.125rem;
1026 #help-button span.top {
1030 border-bottom: 1px solid var(--border-color);
1031 padding-bottom: 4px;
1034 #help-button span.bottom {
1036 border-top: 1px solid var(--border-color);
1039 text-align: initial;
1041 .side-by-side > div {
1044 padding: 0 20px 20px 17px;
1049 /* This min-height is needed to unify the height of the stab elements because some of them
1054 align-items: center;
1055 white-space: pre-wrap;
1060 font-size: 0.875rem;
1061 font-weight: normal;
1070 margin-right: 0.3rem;
1073 /* Black one-pixel outline around emoji shapes */
1083 .import-item .stab {
1085 display: inline-block;
1086 font-size: 0.875rem;
1089 margin-left: 0.3125em;
1091 vertical-align: text-bottom;
1094 .module-item.unstable,
1095 .import-item.unstable {
1100 font-weight: normal;
1113 color: var(--right-side-color);
1117 .impl-items .srclink, .impl .srclink, .methods .srclink {
1118 /* Override header settings otherwise it's too bold */
1119 font-weight: normal;
1131 pre.rust .question-mark {
1135 .example-wrap.compile_fail,
1136 .example-wrap.should_panic {
1137 border-left: 2px solid var(--codeblock-error-color);
1140 .ignore.example-wrap {
1141 border-left: 2px solid var(--codeblock-ignore-color);
1144 .example-wrap.compile_fail:hover,
1145 .example-wrap.should_panic:hover {
1146 border-left: 2px solid var(--codeblock-error-hover-color);
1149 .example-wrap.ignore:hover {
1150 border-left: 2px solid var(--codeblock-ignore-hover-color);
1153 .example-wrap.compile_fail .tooltip,
1154 .example-wrap.should_panic .tooltip {
1155 color: var(--codeblock-error-color);
1158 .example-wrap.ignore .tooltip {
1159 color: var(--codeblock-ignore-color);
1162 .example-wrap.compile_fail:hover .tooltip,
1163 .example-wrap.should_panic:hover .tooltip {
1164 color: var(--codeblock-error-hover-color);
1167 .example-wrap.ignore:hover .tooltip {
1168 color: var(--codeblock-ignore-hover-color);
1171 .example-wrap .tooltip {
1179 .example-wrap .tooltip::after {
1182 padding: 5px 3px 3px 3px;
1186 border: 1px solid var(--border-color);
1193 .example-wrap .tooltip::before {
1200 border-style: solid;
1205 .example-wrap.ignore .tooltip::after {
1206 content: "This example is not tested";
1208 .example-wrap.compile_fail .tooltip::after {
1209 content: "This example deliberately fails to compile";
1211 .example-wrap.should_panic .tooltip::after {
1212 content: "This example panics";
1214 .example-wrap.edition .tooltip::after {
1215 content: "This code runs with edition " attr(data-edition);
1218 .example-wrap .tooltip:hover::before, .example-wrap .tooltip:hover::after {
1222 .example-wrap.compile_fail .tooltip,
1223 .example-wrap.should_panic .tooltip,
1224 .example-wrap.ignore .tooltip {
1230 display: inline-block;
1233 padding: 5px 10px 5px 10px;
1235 font-size: 1.375rem;
1240 .example-wrap:hover .test-arrow {
1241 visibility: visible;
1243 a.test-arrow:hover {
1244 text-decoration: none;
1249 color: var(--code-attribute-color);
1257 .out-of-band > span.since {
1263 font-size: 1.125rem;
1264 margin-bottom: 10px;
1265 border-bottom: none;
1271 border-bottom: none;
1278 margin-bottom: 40px;
1281 .sub-variant > .sub-variant-field {
1285 :target > code, :target > .code-header {
1293 .notable-traits-tooltip {
1294 display: inline-block;
1298 .notable-traits:hover .notable-traits-tooltiptext,
1299 .notable-traits .notable-traits-tooltiptext.force-tooltip {
1300 display: inline-block;
1303 .notable-traits .notable-traits-tooltiptext {
1305 padding: 5px 3px 3px 3px;
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";
1322 .notable-traits .notable, .notable-traits .docblock {
1326 .notable-traits .notable {
1328 margin-bottom: 13px;
1329 font-size: 1.1875rem;
1334 .notable-traits .docblock code.content {
1340 /* Example code has the "Run" button that needs to be positioned relative to the pre */
1341 pre.rust.rust-example-rendered {
1356 .search-failed.active {
1360 .search-failed > ul {
1369 flex-direction: row;
1376 font-size: 1.125rem;
1379 border-top: 2px solid;
1383 #titles > button > div.count {
1384 display: inline-block;
1400 border-bottom: 1px solid;
1403 justify-content: center;
1404 align-items: center;
1412 #source-sidebar > .title {
1415 border-bottom: 1px solid var(--border-color);
1418 #sidebar-toggle > button {
1430 /* work around button layout strangeness: https://stackoverflow.com/q/7271561 */
1432 /* iOS button gradient: https://stackoverflow.com/q/5438567 */
1433 -webkit-appearance: none;
1436 #settings-menu, #help-button {
1441 #settings-menu > a, #help-button > button, #copy-path {
1444 border: 1px solid var(--border-color);
1449 #settings-menu > a, #help-button > button {
1453 background-color: var(--button-background-color);
1457 color: var(--copy-path-button-color);
1460 filter: var(--copy-path-img-filter);
1462 #copy-path:hover > img {
1463 filter: var(--copy-path-img-hover-filter);
1466 @keyframes rotating {
1468 transform: rotate(0deg);
1471 transform: rotate(360deg);
1474 #settings-menu.rotate > a img {
1475 animation: rotating 2s linear infinite;
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);
1482 .setting-line .radio-line input:focus {
1483 box-shadow: 0 0 1px 1px var(--settings-input-color);
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);
1490 .setting-line .radio-line input:hover {
1491 border-color: var(--settings-input-color) !important;
1493 input:checked + .slider {
1494 background-color: var(--settings-input-color);
1497 #help-button > button {
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. */
1507 background-color: var(--main-background-color);
1515 display: inline-block;
1517 font: 15px monospace;
1519 vertical-align: middle;
1520 border: solid 1px var(--border-color);
1525 #main-content > ul {
1528 #main-content > ul > li {
1540 details.dir-entry > summary {
1542 list-style-position: outside;
1546 details.dir-entry div.folders, details.dir-entry div.files {
1550 details.dir-entry a {
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 {
1561 details.rustdoc-toggle > summary {
1564 details.rustdoc-toggle > summary::-webkit-details-marker,
1565 details.rustdoc-toggle > summary::marker {
1569 details.rustdoc-toggle > summary.hideme > span {
1573 details.rustdoc-toggle > summary::before {
1578 background-repeat: no-repeat;
1579 background-position: top left;
1580 display: inline-block;
1581 vertical-align: middle;
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);
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 {
1601 details.rustdoc-toggle > summary.hideme::after {
1602 /* "hideme" toggles already have a description when they're contracted */
1606 details.rustdoc-toggle > summary:focus::before,
1607 details.rustdoc-toggle > summary:hover::before {
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 {
1618 details.non-exhaustive {
1622 details.rustdoc-toggle > summary.hideme::before {
1626 details.rustdoc-toggle > summary:not(.hideme)::before {
1632 .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before {
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 {
1646 details.rustdoc-toggle {
1650 details.rustdoc-toggle[open] > summary.hideme > span {
1654 details.rustdoc-toggle[open] > summary::before,
1655 details.rustdoc-toggle[open] > summary.hideme::before {
1656 background-image: /* AUTOREPLACE: */url("toggle-minus.svg");
1659 details.rustdoc-toggle > summary::before {
1660 background-image: /* AUTOREPLACE: */url("toggle-plus.svg");
1663 details.rustdoc-toggle[open] > summary::before,
1664 details.rustdoc-toggle[open] > summary.hideme::before {
1667 background-repeat: no-repeat;
1668 background-position: top left;
1669 display: inline-block;
1673 details.rustdoc-toggle[open] > summary::after,
1674 details.rustdoc-toggle[open] > summary.hideme::after {
1675 content: "Collapse";
1678 /* This is needed in docblocks to have the "â–¶" element to be on the same line. */
1679 .docblock summary > * {
1680 display: inline-block;
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)
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 {
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 {
1705 .source-sidebar-expanded .source .sidebar {
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)
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.
1721 scroll-margin-top: 45px;
1726 /* Sidebar should overlay main content, rather than pushing main content to the right.
1727 Turn off `display: flex` on the body element. */
1737 flex-direction: column;
1740 .content .out-of-band {
1742 margin-left: initial;
1746 .content .out-of-band .since::before {
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 {
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. */
1771 /* Reduce height slightly to account for mobile topbar. */
1772 height: calc(100vh - 45px);
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. */
1778 .rustdoc.source .sidebar {
1786 .source-sidebar-expanded .source .sidebar,
1787 .sidebar:focus-within {
1791 .rustdoc.source > .sidebar {
1798 .mobile-topbar .location a {
1803 .mobile-topbar .location {
1806 margin: auto 0.5em auto auto;
1807 text-overflow: ellipsis;
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
1817 .mobile-topbar .logo-container {
1821 .mobile-topbar .logo-container > img {
1831 flex-direction: row;
1841 .source .mobile-topbar {
1845 .sidebar-menu-toggle {
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. */
1855 background-color: var(--sidebar-background-color);
1867 display: none !important;
1876 #titles > button > div.count {
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.
1888 width: calc(100% - 45px);
1892 border-bottom: 1px solid;
1895 #main-content > details.rustdoc-toggle > summary::before,
1896 #main-content > div > details.rustdoc-toggle > summary::before {
1909 border-top-right-radius: 3px;
1910 border-bottom-right-radius: 3px;
1917 .source-sidebar-expanded #sidebar-toggle {
1921 border-top-right-radius: unset;
1922 border-bottom-right-radius: unset;
1925 border-bottom: 1px solid;
1932 #main-content > .line-numbers {
1936 .notable-traits .notable-traits-tooltiptext {
1941 /* We don't display the help button on mobile devices. */
1946 /* Display an alternating layout on tablets and phones */
1952 flex-flow: column wrap;
1954 .item-left, .item-right {
1958 /* Display an alternating layout on tablets and phones */
1959 .search-results > a {
1960 border-bottom: 1px solid #aaa9;
1963 .search-results .result-name, .search-results div.desc, .search-results .result-description {
1966 .search-results div.desc, .search-results .result-description, .item-right {
1970 .source-sidebar-expanded .source .sidebar {
1975 /* Position of the "[-]" element. */
1976 details.rustdoc-toggle:not(.top-doc) > summary {
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 {
1985 /* Align summary-nested and unnested item-info gizmos. */
1986 .content .impl-items > .item-info {
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 {
2007 @media (max-width: 464px) {
2017 overflow-wrap: break-word;
2018 overflow-wrap: anywhere;
2022 flex-direction: column;
2025 .sub-logo-container {
2029 .source .sub-logo-container > img {
2037 .source-sidebar-expanded #sidebar-toggle {
2042 .method-toggle summary,
2043 .implementors-toggle summary,
2045 margin-bottom: 0.75em;
2048 .method-toggle[open] {
2052 .implementors-toggle[open] {
2056 #trait-implementations-list .method-toggle,
2057 #synthetic-implementations-list .method-toggle,
2058 #blanket-implementations-list .method-toggle {
2062 /* Begin: styles for --scrape-examples feature */
2064 .scraped-example-list .scrape-help {
2067 font-weight: normal;
2071 background: transparent;
2073 border-style: solid;
2074 border-radius: 50px;
2077 .scraped-example .code-wrapper {
2080 flex-direction: row;
2085 .scraped-example:not(.expanded) .code-wrapper {
2089 .scraped-example:not(.expanded) .code-wrapper pre {
2095 .scraped-example:not(.expanded) .code-wrapper pre.line-numbers {
2099 .scraped-example .code-wrapper .prev {
2107 .scraped-example .code-wrapper .next {
2115 .scraped-example .code-wrapper .expand {
2123 .scraped-example:not(.expanded) .code-wrapper:before {
2132 .scraped-example:not(.expanded) .code-wrapper:after {
2141 .scraped-example .code-wrapper .line-numbers {
2146 .scraped-example .code-wrapper .line-numbers span {
2150 .scraped-example .code-wrapper .example-wrap {
2157 .scraped-example:not(.expanded) .code-wrapper .example-wrap {
2161 .scraped-example .code-wrapper .example-wrap pre.rust {
2162 overflow-x: inherit;
2168 .more-examples-toggle {
2169 max-width: calc(100% + 25px);
2174 .more-examples-toggle .hide-more {
2180 .more-scraped-examples {
2183 flex-direction: row;
2186 .more-scraped-examples-inner {
2187 /* 20px is width of toggle-line + toggle-line-inner */
2188 width: calc(100% - 20px);
2192 align-self: stretch;
2199 .toggle-line-inner {
2204 .more-scraped-examples .scraped-example {
2205 margin-bottom: 20px;
2208 .more-scraped-examples .scraped-example:last-child {
2220 /* End: styles for --scrape-examples feature */