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;
227 .small-section-header a,
237 .result-name .primitive > i, .result-name .keyword > i,
238 .content .method .where,
240 .content .where.fmt-newline {
241 color: var(--main-color);
247 ul ul, ol ul, ul ol, ol ol {
248 margin-bottom: .625em;
252 /* Paragraph spacing at least 1.5 times line spacing per Web Content Accessibility Guidelines.
253 Line-height is 1.5rem, so line spacing is .5rem; .75em is 1.5 times that.
254 https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
262 /* Fix some style changes due to normalize.css 8 */
270 border-collapse: collapse;
284 /* Buttons on Safari have different default padding than other platforms. Make them the same. */
288 /* end tweaks for normalize.css 8 */
299 padding: 10px 15px 40px 45px;
312 .source .width-limiter {
316 details:not(.rustdoc-toggle) summary {
320 code, pre, a.test-arrow, .code-header {
321 font-family: "Source Code Pro", monospace;
323 .docblock code, .docblock-short code {
327 .docblock pre code, .docblock-short pre code {
333 .docblock.item-decl {
340 .source .content pre {
360 .sub-logo-container {
365 .source .sub-logo-container {
369 .source .sub-logo-container > img {
375 .sidebar, .mobile-topbar, .sidebar-menu-toggle {
376 background-color: var(--sidebar-background-color);
391 .sidebar > .location {
396 overflow-wrap: anywhere;
399 .rustdoc.source .sidebar {
406 border-right: 1px solid;
408 /* The sidebar is by default hidden */
412 .rustdoc.source .sidebar .sidebar-logo {
416 .source .sidebar, #sidebar-toggle, #source-sidebar {
417 background-color: var(--sidebar-background-color);
420 #sidebar-toggle > button:hover, #sidebar-toggle > button:focus {
421 background-color: var(--sidebar-background-color-hover);
424 .source .sidebar > *:not(#sidebar-toggle) {
429 .source-sidebar-expanded .source .sidebar {
433 .source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
442 /* Improve the scrollbar display on firefox */
444 scrollbar-width: initial;
445 scrollbar-color: var(--scrollbar-color);
448 scrollbar-width: thin;
449 scrollbar-color: var(--scrollbar-color);
452 /* Improve the scrollbar display on webkit-based browsers */
453 ::-webkit-scrollbar {
456 .sidebar::-webkit-scrollbar {
459 ::-webkit-scrollbar-track {
460 -webkit-box-shadow: inset 0;
461 background-color: var(--scrollbar-track-background-color);
463 .sidebar::-webkit-scrollbar-track {
464 background-color: var(--scrollbar-track-background-color);
466 ::-webkit-scrollbar-thumb, .sidebar::-webkit-scrollbar-thumb {
467 background-color: var(--scrollbar-thumb-background-color);
470 /* Everything else */
473 display: none !important;
476 .sidebar .logo-container {
480 justify-content: center;
484 overflow-wrap: break-word;
487 .logo-container > img {
496 .location a:first-of-type {
503 .block ul, .block li {
513 margin-left: -0.25rem;
515 text-overflow: ellipsis;
525 margin-bottom: 0.7rem;
529 font-size: 1.125rem; /* 18px */
535 .sidebar-elems .block {
539 .sidebar-elems .block li a {
547 .source .content pre.rust {
553 .rustdoc .example-wrap {
554 display: inline-flex;
563 .example-wrap > pre.line-number {
568 border-top-left-radius: 5px;
569 border-bottom-left-radius: 5px;
572 .example-wrap > pre.rust a:hover {
573 text-decoration: underline;
579 .rustdoc:not(.source) .example-wrap > pre:not(.line-number) {
584 .rustdoc:not(.source) .example-wrap > pre.line-numbers {
589 .rustdoc .example-wrap > pre {
597 .content > .example-wrap pre.line-numbers {
599 -webkit-user-select: none;
600 -moz-user-select: none;
601 -ms-user-select: none;
609 overflow-wrap: break-word;
610 overflow-wrap: anywhere;
612 text-overflow: ellipsis;
614 /* Wrap non-pre code blocks (`text`) but not (```text```). */
615 .docblock > :not(pre) > code,
616 .docblock-short > code {
617 white-space: pre-wrap;
620 .top-doc .docblock h2 { font-size: 1.375rem; }
621 .top-doc .docblock h3 { font-size: 1.25rem; }
622 .top-doc .docblock h4,
623 .top-doc .docblock h5 {
626 .top-doc .docblock h6 {
630 .docblock h5 { font-size: 1rem; }
631 .docblock h6 { font-size: 0.875rem; }
632 .docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5, .docblock h6 {
633 border-bottom-color: var(--headings-border-bottom-color);
641 .docblock > :not(.more-examples-toggle):not(.example-wrap) {
646 .content .out-of-band {
653 .method > .code-header, .trait-impl > .code-header {
654 max-width: calc(100% - 41px);
662 /* We use overflow-wrap: break-word for Safari, which doesn't recognize
663 `anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
664 overflow-wrap: break-word;
665 /* Then override it with `anywhere`, which is required to make non-Safari browsers break
666 more aggressively when we want them to. */
667 overflow-wrap: anywhere;
668 background-color: var(--main-background-color);
671 .in-band > code, .in-band > .code-header {
672 display: inline-block;
675 .docblock code, .docblock-short code,
676 pre, .rustdoc.source .example-wrap {
677 background-color: var(--code-block-background-color);
686 width: calc(100% - 2px);
693 border: 1px dashed var(--border-color);
700 border: 1px solid var(--border-color);
703 .content .item-list {
704 list-style-type: none;
708 .content > .methods > .method {
712 /* Shift "where ..." part of method or fn definition down a line */
713 .content .method .where,
715 .content .where.fmt-newline {
724 .content .item-info code {
728 .content .item-info {
733 .content .impl-items .docblock, .content .impl-items .item-info {
737 #main-content > .item-info {
751 nav.sum { text-align: right; }
752 nav.sub form { display: inline; }
755 text-decoration: none;
758 .small-section-header {
760 justify-content: space-between;
764 .small-section-header:hover > .anchor {
768 .in-band:hover > .anchor, .impl:hover > .anchor, .method.trait-impl:hover > .anchor,
769 .type.trait-impl:hover > .anchor, .associatedconstant.trait-impl:hover > .anchor,
770 .associatedtype.trait-impl:hover > .anchor {
771 display: inline-block;
778 background: none !important;
783 .small-section-header > .anchor {
787 h2.small-section-header > .anchor {
794 .docblock a:not(.srclink):not(.test-arrow):not(.scrape-help):hover,
795 .docblock-short a:not(.srclink):not(.test-arrow):not(.scrape-help):hover, .item-info a {
796 text-decoration: underline;
799 .block a.current.crate { font-weight: 500; }
801 /* In most contexts we use `overflow-wrap: anywhere` to ensure that we can wrap
802 as much as needed on mobile (see
803 src/test/rustdoc-gui/type-declaration-overflow.goml for an example of why
804 this matters). The `anywhere` value means:
806 "Soft wrap opportunities introduced by the word break are considered when
807 calculating min-content intrinsic sizes."
809 https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#values
811 For table layouts, that becomes a problem: the browser tries to make each
812 column as narrow as possible, and `overflow-wrap: anywhere` means it can do
813 so by breaking words - even if some other column could be shrunk without
814 breaking words! This shows up, for instance, in the `Structs` / `Modules` /
815 `Functions` (etcetera) sections of a module page, and when a docblock
818 So, for table layouts, override the default with break-word, which does
819 _not_ affect min-content intrinsic sizes.
823 overflow-wrap: break-word;
832 .item-left, .item-right {
836 padding-right: 1.25rem;
845 .search-container > * {
848 .search-results-title {
851 /* flex layout allows shrinking the <select> appropriately if it becomes too large */
852 display: inline-flex;
854 /* make things look like in a line, despite the fact that we're using a layout
855 with boxes (i.e. from the flex layout) */
856 align-items: baseline;
859 display: inline-block;
860 /* ensures that 100% in properties of #crate-search-div:after
861 are relative to the size of this div */
863 /* allows this div (and with it the <select>-element "#crate-search") to be shrunk */
869 /* keep these two in sync with "@-moz-document url-prefix()" below */
872 /* prevents the <select> from overflowing the containing div in case it's shrunk */
874 /* contents can overflow because of max-width limit, then show ellipsis */
875 text-overflow: ellipsis;
876 border: 1px solid var(--border-color);
880 -moz-appearance: none;
881 -webkit-appearance: none;
882 /* Removes default arrow from firefox */
884 background-color: var(--main-background-color);
886 /* cancel stylistic differences in padding in firefox
887 for "appearance: none"-style (or equivalent) <select>s */
888 @-moz-document url-prefix() {
890 padding-left: 0px; /* == 4px - 4px */
891 padding-right: 19px; /* == 23px - 4px */
894 /* pseudo-element for holding the dropdown-arrow image; needs to be a separate thing
895 so that we can apply CSS-filters to change the arrow color in themes */
896 #crate-search-div::after {
897 /* lets clicks through! */
898 pointer-events: none;
899 /* completely covers the underlying div */
906 background-repeat: no-repeat;
907 background-size: 20px;
908 background-position: calc(100% - 2px) 56%;
909 /* image is black color, themes should apply a "filter" property to change the color */
910 background-image: /* AUTOREPLACE: */url("down-arrow.svg");
912 #crate-search > option {
916 /* Override Normalize.css: it has a rule that sets
917 -webkit-appearance: textfield for search inputs. That
918 causes rounded corners and no border on iOS Safari. */
919 -webkit-appearance: none;
920 /* Override Normalize.css: we have margins and do
921 not want to overflow - the `moz` attribute is necessary
922 until Firefox 29, too early to drop at this point */
923 -moz-box-sizing: border-box !important;
924 box-sizing: border-box !important;
926 border: 1px solid var(--border-color);
931 background-color: var(--button-background-color);
933 .search-input:focus {
934 border-color: var(--search-input-focused-border-color);
942 .search-results.active {
944 /* prevent overhanging tabs from moving the first result */
948 .search-results .desc > span {
950 text-overflow: ellipsis;
955 .search-results > a {
957 /* A little margin ensures the browser's outlining of focused links has room to display. */
960 border-bottom: 1px solid #aaa3;
963 .search-results > a > div {
968 .search-results .result-name, .search-results div.desc, .search-results .result-description {
971 .search-results .result-name {
983 border: 1px solid var(--border-color);
987 /* This rule is to draw the little arrow connecting the settings menu to the gear icon. */
992 border: solid var(--border-color);
993 border-width: 1px 1px 0 0;
994 display: inline-block;
996 transform: rotate(-45deg);
1000 .popover, .popover::before {
1001 background-color: var(--main-background-color);
1002 color: var(--main-color);
1005 #help-button .popover {
1009 #help-button .popover::before {
1017 margin-right: 0.5rem;
1019 #help-button span.top, #help-button span.bottom {
1022 font-size: 1.125rem;
1024 #help-button span.top {
1028 border-bottom: 1px solid var(--border-color);
1029 padding-bottom: 4px;
1032 #help-button span.bottom {
1034 border-top: 1px solid var(--border-color);
1037 text-align: initial;
1039 .side-by-side > div {
1042 padding: 0 20px 20px 17px;
1047 /* This min-height is needed to unify the height of the stab elements because some of them
1052 align-items: center;
1053 white-space: pre-wrap;
1058 font-size: 0.875rem;
1059 font-weight: normal;
1068 margin-right: 0.3rem;
1071 /* Black one-pixel outline around emoji shapes */
1081 .import-item .stab {
1083 display: inline-block;
1084 font-size: 0.875rem;
1087 margin-left: 0.3125em;
1089 vertical-align: text-bottom;
1092 .module-item.unstable,
1093 .import-item.unstable {
1098 font-weight: normal;
1111 color: var(--right-side-color);
1115 .impl-items .srclink, .impl .srclink, .methods .srclink {
1116 /* Override header settings otherwise it's too bold */
1117 font-weight: normal;
1129 pre.rust .question-mark {
1133 .example-wrap.compile_fail,
1134 .example-wrap.should_panic {
1135 border-left: 2px solid var(--codeblock-error-color);
1138 .ignore.example-wrap {
1139 border-left: 2px solid var(--codeblock-ignore-color);
1142 .example-wrap.compile_fail:hover,
1143 .example-wrap.should_panic:hover {
1144 border-left: 2px solid var(--codeblock-error-hover-color);
1147 .example-wrap.ignore:hover {
1148 border-left: 2px solid var(--codeblock-ignore-hover-color);
1151 .example-wrap.compile_fail .tooltip,
1152 .example-wrap.should_panic .tooltip {
1153 color: var(--codeblock-error-color);
1156 .example-wrap.ignore .tooltip {
1157 color: var(--codeblock-ignore-color);
1160 .example-wrap.compile_fail:hover .tooltip,
1161 .example-wrap.should_panic:hover .tooltip {
1162 color: var(--codeblock-error-hover-color);
1165 .example-wrap.ignore:hover .tooltip {
1166 color: var(--codeblock-ignore-hover-color);
1169 .example-wrap .tooltip {
1177 .example-wrap .tooltip::after {
1180 padding: 5px 3px 3px 3px;
1184 border: 1px solid var(--border-color);
1191 .example-wrap .tooltip::before {
1198 border-style: solid;
1203 .example-wrap.ignore .tooltip::after {
1204 content: "This example is not tested";
1206 .example-wrap.compile_fail .tooltip::after {
1207 content: "This example deliberately fails to compile";
1209 .example-wrap.should_panic .tooltip::after {
1210 content: "This example panics";
1212 .example-wrap.edition .tooltip::after {
1213 content: "This code runs with edition " attr(data-edition);
1216 .example-wrap .tooltip:hover::before, .example-wrap .tooltip:hover::after {
1220 .example-wrap.compile_fail .tooltip,
1221 .example-wrap.should_panic .tooltip,
1222 .example-wrap.ignore .tooltip {
1228 display: inline-block;
1231 padding: 5px 10px 5px 10px;
1233 font-size: 1.375rem;
1238 .example-wrap:hover .test-arrow {
1239 visibility: visible;
1241 a.test-arrow:hover {
1242 text-decoration: none;
1247 color: var(--code-attribute-color);
1255 .out-of-band > span.since {
1261 font-size: 1.125rem;
1262 margin-bottom: 10px;
1263 border-bottom: none;
1269 border-bottom: none;
1276 margin-bottom: 40px;
1279 .sub-variant > .sub-variant-field {
1283 :target > code, :target > .code-header {
1291 .notable-traits-tooltip {
1292 display: inline-block;
1296 .notable-traits:hover .notable-traits-tooltiptext,
1297 .notable-traits .notable-traits-tooltiptext.force-tooltip {
1298 display: inline-block;
1301 .notable-traits .notable-traits-tooltiptext {
1303 padding: 5px 3px 3px 3px;
1313 .notable-traits-tooltip::after {
1314 /* The margin on the tooltip does not capture hover events,
1315 this extends the area of hover enough so that mouse hover is not
1316 lost when moving the mouse to the tooltip */
1317 content: "\00a0\00a0\00a0";
1320 .notable-traits .notable, .notable-traits .docblock {
1324 .notable-traits .notable {
1326 margin-bottom: 13px;
1327 font-size: 1.1875rem;
1332 .notable-traits .docblock code.content {
1338 /* Example code has the "Run" button that needs to be positioned relative to the pre */
1339 pre.rust.rust-example-rendered {
1354 .search-failed.active {
1358 .search-failed > ul {
1367 flex-direction: row;
1374 font-size: 1.125rem;
1377 border-top: 2px solid;
1381 #titles > button > div.count {
1382 display: inline-block;
1398 border-bottom: 1px solid;
1401 justify-content: center;
1402 align-items: center;
1410 #source-sidebar > .title {
1413 border-bottom: 1px solid var(--border-color);
1416 #sidebar-toggle > button {
1428 /* work around button layout strangeness: https://stackoverflow.com/q/7271561 */
1430 /* iOS button gradient: https://stackoverflow.com/q/5438567 */
1431 -webkit-appearance: none;
1434 #settings-menu, #help-button {
1439 #settings-menu > a, #help-button > button, #copy-path {
1442 border: 1px solid var(--border-color);
1447 #settings-menu > a, #help-button > button {
1451 background-color: var(--button-background-color);
1455 color: var(--copy-path-button-color);
1458 filter: var(--copy-path-img-filter);
1460 #copy-path:hover > img {
1461 filter: var(--copy-path-img-hover-filter);
1464 @keyframes rotating {
1466 transform: rotate(0deg);
1469 transform: rotate(360deg);
1472 #settings-menu.rotate > a img {
1473 animation: rotating 2s linear infinite;
1476 .setting-line .radio-line input:checked {
1477 box-shadow: inset 0 0 0 3px var(--main-background-color);
1478 background-color: var(--settings-input-color);
1480 .setting-line .radio-line input:focus {
1481 box-shadow: 0 0 1px 1px var(--settings-input-color);
1483 /* In here we combine both `:focus` and `:checked` properties. */
1484 .setting-line .radio-line input:checked:focus {
1485 box-shadow: inset 0 0 0 3px var(--main-background-color),
1486 0 0 2px 2px var(--settings-input-color);
1488 .setting-line .radio-line input:hover {
1489 border-color: var(--settings-input-color) !important;
1491 input:checked + .slider {
1492 background-color: var(--settings-input-color);
1495 #help-button > button {
1497 /* Rare exception to specifying font sizes in rem. Since this is acting
1498 as an icon, it's okay to specify their sizes in pixels. */
1505 background-color: var(--main-background-color);
1513 display: inline-block;
1515 font: 15px monospace;
1517 vertical-align: middle;
1518 border: solid 1px var(--border-color);
1523 #main-content > ul {
1526 #main-content > ul > li {
1538 details.dir-entry > summary {
1540 list-style-position: outside;
1544 details.dir-entry div.folders, details.dir-entry div.files {
1548 details.dir-entry a {
1552 /* The hideme class is used on summary tags that contain a span with
1553 placeholder text shown only when the toggle is closed. For instance,
1554 "Expand description" or "Show methods". */
1555 details.rustdoc-toggle > summary.hideme {
1559 details.rustdoc-toggle > summary {
1562 details.rustdoc-toggle > summary::-webkit-details-marker,
1563 details.rustdoc-toggle > summary::marker {
1567 details.rustdoc-toggle > summary.hideme > span {
1571 details.rustdoc-toggle > summary::before {
1576 background-repeat: no-repeat;
1577 background-position: top left;
1578 display: inline-block;
1579 vertical-align: middle;
1583 details.rustdoc-toggle > summary.hideme > span,
1584 details.rustdoc-toggle > summary::before,
1585 .more-examples-toggle summary, .more-examples-toggle .hide-more {
1586 color: var(--toggles-color);
1589 /* Screen readers see the text version at the end the line.
1590 Visual readers see the icon at the start of the line, but small and transparent. */
1591 details.rustdoc-toggle > summary::after {
1599 details.rustdoc-toggle > summary.hideme::after {
1600 /* "hideme" toggles already have a description when they're contracted */
1604 details.rustdoc-toggle > summary:focus::before,
1605 details.rustdoc-toggle > summary:hover::before {
1609 details.rustdoc-toggle.top-doc > summary,
1610 details.rustdoc-toggle.top-doc > summary::before,
1611 details.rustdoc-toggle.non-exhaustive > summary,
1612 details.rustdoc-toggle.non-exhaustive > summary::before {
1616 details.non-exhaustive {
1620 details.rustdoc-toggle > summary.hideme::before {
1624 details.rustdoc-toggle > summary:not(.hideme)::before {
1630 .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before {
1635 /* When a "hideme" summary is open and the "Expand description" or "Show
1636 methods" text is hidden, we want the [-] toggle that remains to not
1637 affect the layout of the items to its right. To do that, we use
1638 absolute positioning. Note that we also set position: relative
1639 on the parent <details> to make this work properly. */
1640 details.rustdoc-toggle[open] > summary.hideme {
1644 details.rustdoc-toggle {
1648 details.rustdoc-toggle[open] > summary.hideme > span {
1652 details.rustdoc-toggle[open] > summary::before,
1653 details.rustdoc-toggle[open] > summary.hideme::before {
1654 background-image: /* AUTOREPLACE: */url("toggle-minus.svg");
1657 details.rustdoc-toggle > summary::before {
1658 background-image: /* AUTOREPLACE: */url("toggle-plus.svg");
1661 details.rustdoc-toggle[open] > summary::before,
1662 details.rustdoc-toggle[open] > summary.hideme::before {
1665 background-repeat: no-repeat;
1666 background-position: top left;
1667 display: inline-block;
1671 details.rustdoc-toggle[open] > summary::after,
1672 details.rustdoc-toggle[open] > summary.hideme::after {
1673 content: "Collapse";
1676 /* This is needed in docblocks to have the "â–¶" element to be on the same line. */
1677 .docblock summary > * {
1678 display: inline-block;
1684 WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY;
1685 If you update this line, then you also need to update the line with the same warning
1686 in storage.js plus the media query with (max-width: 700px)
1688 @media (min-width: 701px) {
1689 /* In case there is no documentation before a code block, we need to add some margin at the top
1690 to prevent an overlay between the "collapse toggle" and the information tooltip.
1691 However, it's not needed with smaller screen width because the doc/code block is always put
1692 "one line" below. */
1693 .docblock > .example-wrap:first-child .tooltip {
1697 /* When we expand the sidebar on the source code page, we hide the logo on the left of the
1698 search bar to have more space. */
1699 .source-sidebar-expanded .source .sidebar + main .width-limiter .sub-logo-container.rust-logo {
1703 .source-sidebar-expanded .source .sidebar {
1709 WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
1710 If you update this line, then you also need to update the line with the same warning
1711 in storage.js plus the media query with (min-width: 701px)
1713 @media (max-width: 700px) {
1714 /* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
1715 or visiting a URL with a fragment like `#method.new`, we don't want the item to be obscured
1716 by the topbar. Anything with an `id` gets scroll-margin-top equal to .mobile-topbar's size.
1719 scroll-margin-top: 45px;
1724 /* Sidebar should overlay main content, rather than pushing main content to the right.
1725 Turn off `display: flex` on the body element. */
1735 flex-direction: column;
1738 .content .out-of-band {
1740 margin-left: initial;
1744 .content .out-of-band .since::before {
1752 /* Hide the logo and item name from the sidebar. Those are displayed
1753 in the mobile-topbar instead. */
1754 .sidebar .sidebar-logo,
1755 .sidebar .location {
1762 /* Hide the sidebar offscreen while not in use. Doing this instead of display: none means
1763 the sidebar stays visible for screen readers, which is useful for navigation. */
1769 /* Reduce height slightly to account for mobile topbar. */
1770 height: calc(100vh - 45px);
1773 /* The source view uses a different design for the sidebar toggle, and doesn't have a topbar,
1774 so don't bump down the main content or the sidebar. */
1776 .rustdoc.source .sidebar {
1784 .source-sidebar-expanded .source .sidebar,
1785 .sidebar:focus-within {
1789 .rustdoc.source > .sidebar {
1796 .mobile-topbar .location a {
1801 .mobile-topbar .location {
1804 margin: auto 0.5em auto auto;
1805 text-overflow: ellipsis;
1807 white-space: nowrap;
1808 /* Rare exception to specifying font sizes in rem. Since the topbar
1809 height is specified in pixels, this also has to be specified in
1810 pixels to avoid overflowing the topbar when the user sets a bigger
1815 .mobile-topbar .logo-container {
1819 .mobile-topbar .logo-container > img {
1829 flex-direction: row;
1839 .source .mobile-topbar {
1843 .sidebar-menu-toggle {
1845 /* Rare exception to specifying font sizes in rem. Since this is acting
1846 as an icon, it's okay to specify its sizes in pixels. */
1853 background-color: var(--sidebar-background-color);
1865 display: none !important;
1874 #titles > button > div.count {
1878 /* Because of ios, we need to actually have a full height sidebar title so the
1879 * actual sidebar can show up. But then we need to make it transparent so we don't
1880 * hide content. The filler just allows to create the background for the sidebar
1881 * title. But because of the absolute position, I had to lower the z-index.
1886 width: calc(100% - 45px);
1890 border-bottom: 1px solid;
1893 #main-content > details.rustdoc-toggle > summary::before,
1894 #main-content > div > details.rustdoc-toggle > summary::before {
1907 border-top-right-radius: 3px;
1908 border-bottom-right-radius: 3px;
1915 .source-sidebar-expanded #sidebar-toggle {
1919 border-top-right-radius: unset;
1920 border-bottom-right-radius: unset;
1923 border-bottom: 1px solid;
1930 #main-content > .line-numbers {
1934 .notable-traits .notable-traits-tooltiptext {
1939 /* We don't display the help button on mobile devices. */
1944 /* Display an alternating layout on tablets and phones */
1950 flex-flow: column wrap;
1952 .item-left, .item-right {
1956 /* Display an alternating layout on tablets and phones */
1957 .search-results > a {
1958 border-bottom: 1px solid #aaa9;
1961 .search-results .result-name, .search-results div.desc, .search-results .result-description {
1964 .search-results div.desc, .search-results .result-description, .item-right {
1968 .source-sidebar-expanded .source .sidebar {
1973 /* Position of the "[-]" element. */
1974 details.rustdoc-toggle:not(.top-doc) > summary {
1977 .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before,
1978 #main-content > details.rustdoc-toggle:not(.top-doc) > summary::before,
1979 #main-content > div > details.rustdoc-toggle > summary::before {
1983 /* Align summary-nested and unnested item-info gizmos. */
1984 .content .impl-items > .item-info {
1990 nav.sidebar, nav.sub, .content .out-of-band, a.srclink, #copy-path,
1991 details.rustdoc-toggle[open] > summary::before, details.rustdoc-toggle > summary::before,
1992 details.rustdoc-toggle.top-doc > summary {
2005 @media (max-width: 464px) {
2015 overflow-wrap: break-word;
2016 overflow-wrap: anywhere;
2020 flex-direction: column;
2023 .sub-logo-container {
2027 .source .sub-logo-container > img {
2035 .source-sidebar-expanded #sidebar-toggle {
2040 .method-toggle summary,
2041 .implementors-toggle summary,
2043 margin-bottom: 0.75em;
2046 .method-toggle[open] {
2050 .implementors-toggle[open] {
2054 #trait-implementations-list .method-toggle,
2055 #synthetic-implementations-list .method-toggle,
2056 #blanket-implementations-list .method-toggle {
2060 /* Begin: styles for --scrape-examples feature */
2062 .scraped-example-list .scrape-help {
2065 font-weight: normal;
2069 background: transparent;
2071 border-style: solid;
2072 border-radius: 50px;
2075 .scraped-example .code-wrapper {
2078 flex-direction: row;
2083 .scraped-example:not(.expanded) .code-wrapper {
2087 .scraped-example:not(.expanded) .code-wrapper pre {
2093 .scraped-example:not(.expanded) .code-wrapper pre.line-numbers {
2097 .scraped-example .code-wrapper .prev {
2105 .scraped-example .code-wrapper .next {
2113 .scraped-example .code-wrapper .expand {
2121 .scraped-example:not(.expanded) .code-wrapper:before {
2130 .scraped-example:not(.expanded) .code-wrapper:after {
2139 .scraped-example .code-wrapper .line-numbers {
2144 .scraped-example .code-wrapper .line-numbers span {
2148 .scraped-example .code-wrapper .example-wrap {
2155 .scraped-example:not(.expanded) .code-wrapper .example-wrap {
2159 .scraped-example .code-wrapper .example-wrap pre.rust {
2160 overflow-x: inherit;
2166 .more-examples-toggle {
2167 max-width: calc(100% + 25px);
2172 .more-examples-toggle .hide-more {
2178 .more-scraped-examples {
2181 flex-direction: row;
2184 .more-scraped-examples-inner {
2185 /* 20px is width of toggle-line + toggle-line-inner */
2186 width: calc(100% - 20px);
2190 align-self: stretch;
2197 .toggle-line-inner {
2202 .more-scraped-examples .scraped-example {
2203 margin-bottom: 20px;
2206 .more-scraped-examples .scraped-example:last-child {
2218 /* End: styles for --scrape-examples feature */