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);
245 .content span.enum, .content a.enum,
246 .content span.struct, .content a.struct,
247 .content span.union, .content a.union,
248 .content span.primitive, .content a.primitive,
249 .content span.type, .content a.type,
250 .content span.foreigntype, .content a.foreigntype {
251 color: var(--type-link-color);
254 .content span.trait, .content a.trait,
255 .content span.traitalias, .content a.traitalias {
256 color: var(--trait-link-color);
259 .content span.associatedtype, .content a.associatedtype,
260 .content span.constant, .content a.constant,
261 .content span.static, .content a.static {
262 color: var(--assoc-item-link-color);
265 .content span.fn, .content a.fn,
267 color: var(--function-link-color);
270 .content span.attr, .content a.attr,
271 .content span.derive, .content a.derive,
272 .content span.macro, .content a.macro {
273 color: var(--macro-link-color);
276 .content span.mod, .content a.mod, .block a.current.mod {
277 color: var(--mod-link-color);
280 .content span.keyword, .content a.keyword {
281 color: var(--keyword-link-color);
285 color: var(--link-color);
291 ul ul, ol ul, ul ol, ol ol {
292 margin-bottom: .625em;
296 /* Paragraph spacing at least 1.5 times line spacing per Web Content Accessibility Guidelines.
297 Line-height is 1.5rem, so line spacing is .5rem; .75em is 1.5 times that.
298 https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
306 /* Fix some style changes due to normalize.css 8 */
314 border-collapse: collapse;
328 /* Buttons on Safari have different default padding than other platforms. Make them the same. */
332 /* end tweaks for normalize.css 8 */
343 padding: 10px 15px 40px 45px;
356 .source .width-limiter {
360 details:not(.rustdoc-toggle) summary {
364 code, pre, a.test-arrow, .code-header {
365 font-family: "Source Code Pro", monospace;
367 .docblock code, .docblock-short code {
371 .docblock pre code, .docblock-short pre code {
377 .docblock.item-decl {
384 .source .content pre {
404 .sub-logo-container {
409 .source .sub-logo-container {
413 .source .sub-logo-container > img {
419 .sidebar, .mobile-topbar, .sidebar-menu-toggle {
420 background-color: var(--sidebar-background-color);
435 .sidebar > .location {
440 overflow-wrap: anywhere;
443 .rustdoc.source .sidebar {
450 border-right: 1px solid;
452 /* The sidebar is by default hidden */
456 .rustdoc.source .sidebar .sidebar-logo {
460 .source .sidebar, #sidebar-toggle, #source-sidebar {
461 background-color: var(--sidebar-background-color);
464 #sidebar-toggle > button:hover, #sidebar-toggle > button:focus {
465 background-color: var(--sidebar-background-color-hover);
468 .source .sidebar > *:not(#sidebar-toggle) {
473 .source-sidebar-expanded .source .sidebar {
477 .source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
486 /* Improve the scrollbar display on firefox */
488 scrollbar-width: initial;
489 scrollbar-color: var(--scrollbar-color);
492 scrollbar-width: thin;
493 scrollbar-color: var(--scrollbar-color);
496 /* Improve the scrollbar display on webkit-based browsers */
497 ::-webkit-scrollbar {
500 .sidebar::-webkit-scrollbar {
503 ::-webkit-scrollbar-track {
504 -webkit-box-shadow: inset 0;
505 background-color: var(--scrollbar-track-background-color);
507 .sidebar::-webkit-scrollbar-track {
508 background-color: var(--scrollbar-track-background-color);
510 ::-webkit-scrollbar-thumb, .sidebar::-webkit-scrollbar-thumb {
511 background-color: var(--scrollbar-thumb-background-color);
514 /* Everything else */
517 display: none !important;
520 .sidebar .logo-container {
524 justify-content: center;
528 overflow-wrap: break-word;
531 .logo-container > img {
540 .location a:first-of-type {
547 .block ul, .block li {
557 margin-left: -0.25rem;
559 text-overflow: ellipsis;
569 margin-bottom: 0.7rem;
573 font-size: 1.125rem; /* 18px */
579 .sidebar-elems .block {
583 .sidebar-elems .block li a {
591 .source .content pre.rust {
597 .rustdoc .example-wrap {
598 display: inline-flex;
607 .example-wrap > pre.line-number {
612 border-top-left-radius: 5px;
613 border-bottom-left-radius: 5px;
616 .example-wrap > pre.rust a:hover {
617 text-decoration: underline;
623 .rustdoc:not(.source) .example-wrap > pre:not(.line-number) {
628 .rustdoc:not(.source) .example-wrap > pre.line-numbers {
633 .rustdoc .example-wrap > pre {
641 .content > .example-wrap pre.line-numbers {
643 -webkit-user-select: none;
644 -moz-user-select: none;
645 -ms-user-select: none;
653 overflow-wrap: break-word;
654 overflow-wrap: anywhere;
656 text-overflow: ellipsis;
658 /* Wrap non-pre code blocks (`text`) but not (```text```). */
659 .docblock > :not(pre) > code,
660 .docblock-short > code {
661 white-space: pre-wrap;
664 .top-doc .docblock h2 { font-size: 1.375rem; }
665 .top-doc .docblock h3 { font-size: 1.25rem; }
666 .top-doc .docblock h4,
667 .top-doc .docblock h5 {
670 .top-doc .docblock h6 {
674 .docblock h5 { font-size: 1rem; }
675 .docblock h6 { font-size: 0.875rem; }
676 .docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5, .docblock h6 {
677 border-bottom-color: var(--headings-border-bottom-color);
685 .docblock > :not(.more-examples-toggle):not(.example-wrap) {
690 .content .out-of-band {
697 .method > .code-header, .trait-impl > .code-header {
698 max-width: calc(100% - 41px);
706 /* We use overflow-wrap: break-word for Safari, which doesn't recognize
707 `anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
708 overflow-wrap: break-word;
709 /* Then override it with `anywhere`, which is required to make non-Safari browsers break
710 more aggressively when we want them to. */
711 overflow-wrap: anywhere;
712 background-color: var(--main-background-color);
715 .in-band > code, .in-band > .code-header {
716 display: inline-block;
719 .docblock code, .docblock-short code,
720 pre, .rustdoc.source .example-wrap {
721 background-color: var(--code-block-background-color);
730 width: calc(100% - 2px);
737 border: 1px dashed var(--border-color);
744 border: 1px solid var(--border-color);
747 .content .item-list {
748 list-style-type: none;
752 .content > .methods > .method {
756 /* Shift "where ..." part of method or fn definition down a line */
757 .content .method .where,
759 .content .where.fmt-newline {
768 .content .item-info code {
772 .content .item-info {
777 .content .impl-items .docblock, .content .impl-items .item-info {
781 #main-content > .item-info {
795 nav.sum { text-align: right; }
796 nav.sub form { display: inline; }
799 text-decoration: none;
802 .small-section-header {
804 justify-content: space-between;
808 .small-section-header:hover > .anchor {
812 .in-band:hover > .anchor, .impl:hover > .anchor, .method.trait-impl:hover > .anchor,
813 .type.trait-impl:hover > .anchor, .associatedconstant.trait-impl:hover > .anchor,
814 .associatedtype.trait-impl:hover > .anchor {
815 display: inline-block;
822 background: none !important;
827 .small-section-header > .anchor {
831 h2.small-section-header > .anchor {
838 .docblock a:not(.srclink):not(.test-arrow):not(.scrape-help):hover,
839 .docblock-short a:not(.srclink):not(.test-arrow):not(.scrape-help):hover, .item-info a {
840 text-decoration: underline;
843 .block a.current.crate { font-weight: 500; }
845 /* In most contexts we use `overflow-wrap: anywhere` to ensure that we can wrap
846 as much as needed on mobile (see
847 src/test/rustdoc-gui/type-declaration-overflow.goml for an example of why
848 this matters). The `anywhere` value means:
850 "Soft wrap opportunities introduced by the word break are considered when
851 calculating min-content intrinsic sizes."
853 https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#values
855 For table layouts, that becomes a problem: the browser tries to make each
856 column as narrow as possible, and `overflow-wrap: anywhere` means it can do
857 so by breaking words - even if some other column could be shrunk without
858 breaking words! This shows up, for instance, in the `Structs` / `Modules` /
859 `Functions` (etcetera) sections of a module page, and when a docblock
862 So, for table layouts, override the default with break-word, which does
863 _not_ affect min-content intrinsic sizes.
867 overflow-wrap: break-word;
876 .item-left, .item-right {
880 padding-right: 1.25rem;
889 .search-container > * {
892 .search-results-title {
895 /* flex layout allows shrinking the <select> appropriately if it becomes too large */
896 display: inline-flex;
898 /* make things look like in a line, despite the fact that we're using a layout
899 with boxes (i.e. from the flex layout) */
900 align-items: baseline;
903 display: inline-block;
904 /* ensures that 100% in properties of #crate-search-div:after
905 are relative to the size of this div */
907 /* allows this div (and with it the <select>-element "#crate-search") to be shrunk */
913 /* keep these two in sync with "@-moz-document url-prefix()" below */
916 /* prevents the <select> from overflowing the containing div in case it's shrunk */
918 /* contents can overflow because of max-width limit, then show ellipsis */
919 text-overflow: ellipsis;
920 border: 1px solid var(--border-color);
924 -moz-appearance: none;
925 -webkit-appearance: none;
926 /* Removes default arrow from firefox */
928 background-color: var(--main-background-color);
930 /* cancel stylistic differences in padding in firefox
931 for "appearance: none"-style (or equivalent) <select>s */
932 @-moz-document url-prefix() {
934 padding-left: 0px; /* == 4px - 4px */
935 padding-right: 19px; /* == 23px - 4px */
938 /* pseudo-element for holding the dropdown-arrow image; needs to be a separate thing
939 so that we can apply CSS-filters to change the arrow color in themes */
940 #crate-search-div::after {
941 /* lets clicks through! */
942 pointer-events: none;
943 /* completely covers the underlying div */
950 background-repeat: no-repeat;
951 background-size: 20px;
952 background-position: calc(100% - 2px) 56%;
953 /* image is black color, themes should apply a "filter" property to change the color */
954 background-image: /* AUTOREPLACE: */url("down-arrow.svg");
956 #crate-search > option {
960 /* Override Normalize.css: it has a rule that sets
961 -webkit-appearance: textfield for search inputs. That
962 causes rounded corners and no border on iOS Safari. */
963 -webkit-appearance: none;
964 /* Override Normalize.css: we have margins and do
965 not want to overflow - the `moz` attribute is necessary
966 until Firefox 29, too early to drop at this point */
967 -moz-box-sizing: border-box !important;
968 box-sizing: border-box !important;
970 border: 1px solid var(--border-color);
975 background-color: var(--button-background-color);
977 .search-input:focus {
978 border-color: var(--search-input-focused-border-color);
986 .search-results.active {
988 /* prevent overhanging tabs from moving the first result */
992 .search-results .desc > span {
994 text-overflow: ellipsis;
999 .search-results > a {
1001 /* A little margin ensures the browser's outlining of focused links has room to display. */
1004 border-bottom: 1px solid #aaa3;
1007 .search-results > a > div {
1009 flex-flow: row wrap;
1012 .search-results .result-name, .search-results div.desc, .search-results .result-description {
1015 .search-results .result-name {
1027 border: 1px solid var(--border-color);
1031 /* This rule is to draw the little arrow connecting the settings menu to the gear icon. */
1036 border: solid var(--border-color);
1037 border-width: 1px 1px 0 0;
1038 display: inline-block;
1040 transform: rotate(-45deg);
1044 .popover, .popover::before {
1045 background-color: var(--main-background-color);
1046 color: var(--main-color);
1049 #help-button .popover {
1053 #help-button .popover::before {
1061 margin-right: 0.5rem;
1063 #help-button span.top, #help-button span.bottom {
1066 font-size: 1.125rem;
1068 #help-button span.top {
1072 border-bottom: 1px solid var(--border-color);
1073 padding-bottom: 4px;
1076 #help-button span.bottom {
1078 border-top: 1px solid var(--border-color);
1081 text-align: initial;
1083 .side-by-side > div {
1086 padding: 0 20px 20px 17px;
1091 /* This min-height is needed to unify the height of the stab elements because some of them
1096 align-items: center;
1097 white-space: pre-wrap;
1102 font-size: 0.875rem;
1103 font-weight: normal;
1112 margin-right: 0.3rem;
1115 /* Black one-pixel outline around emoji shapes */
1125 .import-item .stab {
1127 display: inline-block;
1128 font-size: 0.875rem;
1131 margin-left: 0.3125em;
1133 vertical-align: text-bottom;
1136 .module-item.unstable,
1137 .import-item.unstable {
1142 font-weight: normal;
1155 color: var(--right-side-color);
1159 .impl-items .srclink, .impl .srclink, .methods .srclink {
1160 /* Override header settings otherwise it's too bold */
1161 font-weight: normal;
1173 pre.rust .question-mark {
1177 .example-wrap.compile_fail,
1178 .example-wrap.should_panic {
1179 border-left: 2px solid var(--codeblock-error-color);
1182 .ignore.example-wrap {
1183 border-left: 2px solid var(--codeblock-ignore-color);
1186 .example-wrap.compile_fail:hover,
1187 .example-wrap.should_panic:hover {
1188 border-left: 2px solid var(--codeblock-error-hover-color);
1191 .example-wrap.ignore:hover {
1192 border-left: 2px solid var(--codeblock-ignore-hover-color);
1195 .example-wrap.compile_fail .tooltip,
1196 .example-wrap.should_panic .tooltip {
1197 color: var(--codeblock-error-color);
1200 .example-wrap.ignore .tooltip {
1201 color: var(--codeblock-ignore-color);
1204 .example-wrap.compile_fail:hover .tooltip,
1205 .example-wrap.should_panic:hover .tooltip {
1206 color: var(--codeblock-error-hover-color);
1209 .example-wrap.ignore:hover .tooltip {
1210 color: var(--codeblock-ignore-hover-color);
1213 .example-wrap .tooltip {
1221 .example-wrap .tooltip::after {
1224 padding: 5px 3px 3px 3px;
1228 border: 1px solid var(--border-color);
1235 .example-wrap .tooltip::before {
1242 border-style: solid;
1247 .example-wrap.ignore .tooltip::after {
1248 content: "This example is not tested";
1250 .example-wrap.compile_fail .tooltip::after {
1251 content: "This example deliberately fails to compile";
1253 .example-wrap.should_panic .tooltip::after {
1254 content: "This example panics";
1256 .example-wrap.edition .tooltip::after {
1257 content: "This code runs with edition " attr(data-edition);
1260 .example-wrap .tooltip:hover::before, .example-wrap .tooltip:hover::after {
1264 .example-wrap.compile_fail .tooltip,
1265 .example-wrap.should_panic .tooltip,
1266 .example-wrap.ignore .tooltip {
1272 display: inline-block;
1275 padding: 5px 10px 5px 10px;
1277 font-size: 1.375rem;
1282 .example-wrap:hover .test-arrow {
1283 visibility: visible;
1285 a.test-arrow:hover {
1286 text-decoration: none;
1291 color: var(--code-attribute-color);
1299 .out-of-band > span.since {
1305 font-size: 1.125rem;
1306 margin-bottom: 10px;
1307 border-bottom: none;
1313 border-bottom: none;
1320 margin-bottom: 40px;
1323 .sub-variant > .sub-variant-field {
1327 :target > code, :target > .code-header {
1335 .notable-traits-tooltip {
1336 display: inline-block;
1340 .notable-traits:hover .notable-traits-tooltiptext,
1341 .notable-traits .notable-traits-tooltiptext.force-tooltip {
1342 display: inline-block;
1345 .notable-traits .notable-traits-tooltiptext {
1347 padding: 5px 3px 3px 3px;
1357 .notable-traits-tooltip::after {
1358 /* The margin on the tooltip does not capture hover events,
1359 this extends the area of hover enough so that mouse hover is not
1360 lost when moving the mouse to the tooltip */
1361 content: "\00a0\00a0\00a0";
1364 .notable-traits .notable, .notable-traits .docblock {
1368 .notable-traits .notable {
1370 margin-bottom: 13px;
1371 font-size: 1.1875rem;
1376 .notable-traits .docblock code.content {
1382 /* Example code has the "Run" button that needs to be positioned relative to the pre */
1383 pre.rust.rust-example-rendered {
1398 .search-failed.active {
1402 .search-failed > ul {
1411 flex-direction: row;
1418 font-size: 1.125rem;
1421 border-top: 2px solid;
1425 #titles > button > div.count {
1426 display: inline-block;
1442 border-bottom: 1px solid;
1445 justify-content: center;
1446 align-items: center;
1454 #source-sidebar > .title {
1457 border-bottom: 1px solid var(--border-color);
1460 #sidebar-toggle > button {
1472 /* work around button layout strangeness: https://stackoverflow.com/q/7271561 */
1474 /* iOS button gradient: https://stackoverflow.com/q/5438567 */
1475 -webkit-appearance: none;
1478 #settings-menu, #help-button {
1483 #settings-menu > a, #help-button > button, #copy-path {
1486 border: 1px solid var(--border-color);
1491 #settings-menu > a, #help-button > button {
1495 background-color: var(--button-background-color);
1499 color: var(--copy-path-button-color);
1502 filter: var(--copy-path-img-filter);
1504 #copy-path:hover > img {
1505 filter: var(--copy-path-img-hover-filter);
1508 @keyframes rotating {
1510 transform: rotate(0deg);
1513 transform: rotate(360deg);
1516 #settings-menu.rotate > a img {
1517 animation: rotating 2s linear infinite;
1520 .setting-line .radio-line input:checked {
1521 box-shadow: inset 0 0 0 3px var(--main-background-color);
1522 background-color: var(--settings-input-color);
1524 .setting-line .radio-line input:focus {
1525 box-shadow: 0 0 1px 1px var(--settings-input-color);
1527 /* In here we combine both `:focus` and `:checked` properties. */
1528 .setting-line .radio-line input:checked:focus {
1529 box-shadow: inset 0 0 0 3px var(--main-background-color),
1530 0 0 2px 2px var(--settings-input-color);
1532 .setting-line .radio-line input:hover {
1533 border-color: var(--settings-input-color) !important;
1535 input:checked + .slider {
1536 background-color: var(--settings-input-color);
1539 #help-button > button {
1541 /* Rare exception to specifying font sizes in rem. Since this is acting
1542 as an icon, it's okay to specify their sizes in pixels. */
1549 background-color: var(--main-background-color);
1557 display: inline-block;
1559 font: 15px monospace;
1561 vertical-align: middle;
1562 border: solid 1px var(--border-color);
1567 #main-content > ul {
1570 #main-content > ul > li {
1582 details.dir-entry > summary {
1584 list-style-position: outside;
1588 details.dir-entry div.folders, details.dir-entry div.files {
1592 details.dir-entry a {
1596 /* The hideme class is used on summary tags that contain a span with
1597 placeholder text shown only when the toggle is closed. For instance,
1598 "Expand description" or "Show methods". */
1599 details.rustdoc-toggle > summary.hideme {
1603 details.rustdoc-toggle > summary {
1606 details.rustdoc-toggle > summary::-webkit-details-marker,
1607 details.rustdoc-toggle > summary::marker {
1611 details.rustdoc-toggle > summary.hideme > span {
1615 details.rustdoc-toggle > summary::before {
1620 background-repeat: no-repeat;
1621 background-position: top left;
1622 display: inline-block;
1623 vertical-align: middle;
1627 details.rustdoc-toggle > summary.hideme > span,
1628 details.rustdoc-toggle > summary::before,
1629 .more-examples-toggle summary, .more-examples-toggle .hide-more {
1630 color: var(--toggles-color);
1633 /* Screen readers see the text version at the end the line.
1634 Visual readers see the icon at the start of the line, but small and transparent. */
1635 details.rustdoc-toggle > summary::after {
1643 details.rustdoc-toggle > summary.hideme::after {
1644 /* "hideme" toggles already have a description when they're contracted */
1648 details.rustdoc-toggle > summary:focus::before,
1649 details.rustdoc-toggle > summary:hover::before {
1653 details.rustdoc-toggle.top-doc > summary,
1654 details.rustdoc-toggle.top-doc > summary::before,
1655 details.rustdoc-toggle.non-exhaustive > summary,
1656 details.rustdoc-toggle.non-exhaustive > summary::before {
1660 details.non-exhaustive {
1664 details.rustdoc-toggle > summary.hideme::before {
1668 details.rustdoc-toggle > summary:not(.hideme)::before {
1674 .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before {
1679 /* When a "hideme" summary is open and the "Expand description" or "Show
1680 methods" text is hidden, we want the [-] toggle that remains to not
1681 affect the layout of the items to its right. To do that, we use
1682 absolute positioning. Note that we also set position: relative
1683 on the parent <details> to make this work properly. */
1684 details.rustdoc-toggle[open] > summary.hideme {
1688 details.rustdoc-toggle {
1692 details.rustdoc-toggle[open] > summary.hideme > span {
1696 details.rustdoc-toggle[open] > summary::before,
1697 details.rustdoc-toggle[open] > summary.hideme::before {
1698 background-image: /* AUTOREPLACE: */url("toggle-minus.svg");
1701 details.rustdoc-toggle > summary::before {
1702 background-image: /* AUTOREPLACE: */url("toggle-plus.svg");
1705 details.rustdoc-toggle[open] > summary::before,
1706 details.rustdoc-toggle[open] > summary.hideme::before {
1709 background-repeat: no-repeat;
1710 background-position: top left;
1711 display: inline-block;
1715 details.rustdoc-toggle[open] > summary::after,
1716 details.rustdoc-toggle[open] > summary.hideme::after {
1717 content: "Collapse";
1720 /* This is needed in docblocks to have the "â–¶" element to be on the same line. */
1721 .docblock summary > * {
1722 display: inline-block;
1728 WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY;
1729 If you update this line, then you also need to update the line with the same warning
1730 in storage.js plus the media query with (max-width: 700px)
1732 @media (min-width: 701px) {
1733 /* In case there is no documentation before a code block, we need to add some margin at the top
1734 to prevent an overlay between the "collapse toggle" and the information tooltip.
1735 However, it's not needed with smaller screen width because the doc/code block is always put
1736 "one line" below. */
1737 .docblock > .example-wrap:first-child .tooltip {
1741 /* When we expand the sidebar on the source code page, we hide the logo on the left of the
1742 search bar to have more space. */
1743 .source-sidebar-expanded .source .sidebar + main .width-limiter .sub-logo-container.rust-logo {
1747 .source-sidebar-expanded .source .sidebar {
1753 WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
1754 If you update this line, then you also need to update the line with the same warning
1755 in storage.js plus the media query with (min-width: 701px)
1757 @media (max-width: 700px) {
1758 /* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
1759 or visiting a URL with a fragment like `#method.new`, we don't want the item to be obscured
1760 by the topbar. Anything with an `id` gets scroll-margin-top equal to .mobile-topbar's size.
1763 scroll-margin-top: 45px;
1768 /* Sidebar should overlay main content, rather than pushing main content to the right.
1769 Turn off `display: flex` on the body element. */
1779 flex-direction: column;
1782 .content .out-of-band {
1784 margin-left: initial;
1788 .content .out-of-band .since::before {
1796 /* Hide the logo and item name from the sidebar. Those are displayed
1797 in the mobile-topbar instead. */
1798 .sidebar .sidebar-logo,
1799 .sidebar .location {
1806 /* Hide the sidebar offscreen while not in use. Doing this instead of display: none means
1807 the sidebar stays visible for screen readers, which is useful for navigation. */
1813 /* Reduce height slightly to account for mobile topbar. */
1814 height: calc(100vh - 45px);
1817 /* The source view uses a different design for the sidebar toggle, and doesn't have a topbar,
1818 so don't bump down the main content or the sidebar. */
1820 .rustdoc.source .sidebar {
1828 .source-sidebar-expanded .source .sidebar,
1829 .sidebar:focus-within {
1833 .rustdoc.source > .sidebar {
1840 .mobile-topbar .location a {
1845 .mobile-topbar .location {
1848 margin: auto 0.5em auto auto;
1849 text-overflow: ellipsis;
1851 white-space: nowrap;
1852 /* Rare exception to specifying font sizes in rem. Since the topbar
1853 height is specified in pixels, this also has to be specified in
1854 pixels to avoid overflowing the topbar when the user sets a bigger
1859 .mobile-topbar .logo-container {
1863 .mobile-topbar .logo-container > img {
1873 flex-direction: row;
1883 .source .mobile-topbar {
1887 .sidebar-menu-toggle {
1889 /* Rare exception to specifying font sizes in rem. Since this is acting
1890 as an icon, it's okay to specify its sizes in pixels. */
1897 background-color: var(--sidebar-background-color);
1909 display: none !important;
1918 #titles > button > div.count {
1922 /* Because of ios, we need to actually have a full height sidebar title so the
1923 * actual sidebar can show up. But then we need to make it transparent so we don't
1924 * hide content. The filler just allows to create the background for the sidebar
1925 * title. But because of the absolute position, I had to lower the z-index.
1930 width: calc(100% - 45px);
1934 border-bottom: 1px solid;
1937 #main-content > details.rustdoc-toggle > summary::before,
1938 #main-content > div > details.rustdoc-toggle > summary::before {
1951 border-top-right-radius: 3px;
1952 border-bottom-right-radius: 3px;
1959 .source-sidebar-expanded #sidebar-toggle {
1963 border-top-right-radius: unset;
1964 border-bottom-right-radius: unset;
1967 border-bottom: 1px solid;
1974 #main-content > .line-numbers {
1978 .notable-traits .notable-traits-tooltiptext {
1983 /* We don't display the help button on mobile devices. */
1988 /* Display an alternating layout on tablets and phones */
1994 flex-flow: column wrap;
1996 .item-left, .item-right {
2000 /* Display an alternating layout on tablets and phones */
2001 .search-results > a {
2002 border-bottom: 1px solid #aaa9;
2005 .search-results .result-name, .search-results div.desc, .search-results .result-description {
2008 .search-results div.desc, .search-results .result-description, .item-right {
2012 .source-sidebar-expanded .source .sidebar {
2017 /* Position of the "[-]" element. */
2018 details.rustdoc-toggle:not(.top-doc) > summary {
2021 .impl-items > details.rustdoc-toggle > summary:not(.hideme)::before,
2022 #main-content > details.rustdoc-toggle:not(.top-doc) > summary::before,
2023 #main-content > div > details.rustdoc-toggle > summary::before {
2027 /* Align summary-nested and unnested item-info gizmos. */
2028 .content .impl-items > .item-info {
2034 nav.sidebar, nav.sub, .content .out-of-band, a.srclink, #copy-path,
2035 details.rustdoc-toggle[open] > summary::before, details.rustdoc-toggle > summary::before,
2036 details.rustdoc-toggle.top-doc > summary {
2049 @media (max-width: 464px) {
2059 overflow-wrap: break-word;
2060 overflow-wrap: anywhere;
2064 flex-direction: column;
2067 .sub-logo-container {
2071 .source .sub-logo-container > img {
2079 .source-sidebar-expanded #sidebar-toggle {
2084 .method-toggle summary,
2085 .implementors-toggle summary,
2087 margin-bottom: 0.75em;
2090 .method-toggle[open] {
2094 .implementors-toggle[open] {
2098 #trait-implementations-list .method-toggle,
2099 #synthetic-implementations-list .method-toggle,
2100 #blanket-implementations-list .method-toggle {
2104 /* Begin: styles for --scrape-examples feature */
2106 .scraped-example-list .scrape-help {
2109 font-weight: normal;
2113 background: transparent;
2115 border-style: solid;
2116 border-radius: 50px;
2119 .scraped-example .code-wrapper {
2122 flex-direction: row;
2127 .scraped-example:not(.expanded) .code-wrapper {
2131 .scraped-example:not(.expanded) .code-wrapper pre {
2137 .scraped-example:not(.expanded) .code-wrapper pre.line-numbers {
2141 .scraped-example .code-wrapper .prev {
2149 .scraped-example .code-wrapper .next {
2157 .scraped-example .code-wrapper .expand {
2165 .scraped-example:not(.expanded) .code-wrapper:before {
2174 .scraped-example:not(.expanded) .code-wrapper:after {
2183 .scraped-example .code-wrapper .line-numbers {
2188 .scraped-example .code-wrapper .line-numbers span {
2192 .scraped-example .code-wrapper .example-wrap {
2199 .scraped-example:not(.expanded) .code-wrapper .example-wrap {
2203 .scraped-example .code-wrapper .example-wrap pre.rust {
2204 overflow-x: inherit;
2210 .more-examples-toggle {
2211 max-width: calc(100% + 25px);
2216 .more-examples-toggle .hide-more {
2222 .more-scraped-examples {
2225 flex-direction: row;
2228 .more-scraped-examples-inner {
2229 /* 20px is width of toggle-line + toggle-line-inner */
2230 width: calc(100% - 20px);
2234 align-self: stretch;
2241 .toggle-line-inner {
2246 .more-scraped-examples .scraped-example {
2247 margin-bottom: 20px;
2250 .more-scraped-examples .scraped-example:last-child {
2262 /* End: styles for --scrape-examples feature */