mirror of
https://github.com/actix/actix-extras.git
synced 2024-11-24 16:02:59 +01:00
2124 lines
44 KiB
CSS
2124 lines
44 KiB
CSS
/* See FiraSans-LICENSE.txt for the Fira Sans license. */
|
|
@font-face {
|
|
font-family: 'Fira Sans';
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
src: local('Fira Sans'),
|
|
url("FiraSans-Regular-018c141bf0843ffd.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: 'Fira Sans';
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
src: local('Fira Sans Medium'),
|
|
url("FiraSans-Medium-8f9a781e4970d388.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
|
|
/* See SourceSerif4-LICENSE.md for the Source Serif 4 license. */
|
|
@font-face {
|
|
font-family: 'Source Serif 4';
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
src: local('Source Serif 4'),
|
|
url("SourceSerif4-Regular-1f7d512b176f0f72.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: 'Source Serif 4';
|
|
font-style: italic;
|
|
font-weight: 400;
|
|
src: local('Source Serif 4 Italic'),
|
|
url("SourceSerif4-It-d034fe4ef9d0fa00.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: 'Source Serif 4';
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
src: local('Source Serif 4 Bold'),
|
|
url("SourceSerif4-Bold-124a1ca42af929b6.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
|
|
/* See SourceCodePro-LICENSE.txt for the Source Code Pro license. */
|
|
@font-face {
|
|
font-family: 'Source Code Pro';
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
/* Avoid using locally installed font because bad versions are in circulation:
|
|
* see https://github.com/rust-lang/rust/issues/24355 */
|
|
src: url("SourceCodePro-Regular-562dcc5011b6de7d.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: 'Source Code Pro';
|
|
font-style: italic;
|
|
font-weight: 400;
|
|
src: url("SourceCodePro-It-1cc31594bf4f1f79.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: 'Source Code Pro';
|
|
font-style: normal;
|
|
font-weight: 600;
|
|
src: url("SourceCodePro-Semibold-d899c5a5c4aeb14a.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
}
|
|
|
|
/* Avoid using legacy CJK serif fonts in Windows like Batang. */
|
|
@font-face {
|
|
font-family: 'NanumBarunGothic';
|
|
src: url("NanumBarunGothic-0f09457c7a19b7c6.ttf.woff2") format("woff2");
|
|
font-display: swap;
|
|
unicode-range: U+AC00-D7AF, U+1100-11FF, U+3130-318F, U+A960-A97F, U+D7B0-D7FF;
|
|
}
|
|
|
|
* {
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* This part handles the "default" theme being used depending on the system one. */
|
|
html {
|
|
content: "";
|
|
}
|
|
@media (prefers-color-scheme: light) {
|
|
html {
|
|
content: "light";
|
|
}
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
html {
|
|
content: "dark";
|
|
}
|
|
}
|
|
|
|
/* General structure and fonts */
|
|
|
|
body {
|
|
/* Line spacing at least 1.5 per Web Content Accessibility Guidelines
|
|
https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
|
|
font: 1rem/1.5 "Source Serif 4", NanumBarunGothic, serif;
|
|
margin: 0;
|
|
position: relative;
|
|
/* We use overflow-wrap: break-word for Safari, which doesn't recognize
|
|
`anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
|
|
overflow-wrap: break-word;
|
|
/* Then override it with `anywhere`, which is required to make non-Safari browsers break
|
|
more aggressively when we want them to. */
|
|
overflow-wrap: anywhere;
|
|
|
|
-webkit-font-feature-settings: "kern", "liga";
|
|
-moz-font-feature-settings: "kern", "liga";
|
|
font-feature-settings: "kern", "liga";
|
|
|
|
background-color: var(--main-background-color);
|
|
color: var(--main-color);
|
|
}
|
|
|
|
h1 {
|
|
font-size: 1.5rem; /* 24px */
|
|
}
|
|
h2 {
|
|
font-size: 1.375rem; /* 22px */
|
|
}
|
|
h3 {
|
|
font-size: 1.25rem; /* 20px */
|
|
}
|
|
h1, h2, h3, h4, h5, h6 {
|
|
font-weight: 500;
|
|
}
|
|
h1, h2, h3, h4 {
|
|
margin: 25px 0 15px 0;
|
|
padding-bottom: 6px;
|
|
}
|
|
.docblock h3, .docblock h4, h5, h6 {
|
|
margin: 15px 0 5px 0;
|
|
}
|
|
.docblock > h2:first-child,
|
|
.docblock > h3:first-child,
|
|
.docblock > h4:first-child,
|
|
.docblock > h5:first-child,
|
|
.docblock > h6:first-child {
|
|
margin-top: 0;
|
|
}
|
|
h1.fqn {
|
|
margin: 0;
|
|
padding: 0;
|
|
flex-grow: 1;
|
|
/* We use overflow-wrap: break-word for Safari, which doesn't recognize
|
|
`anywhere`: https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap */
|
|
overflow-wrap: break-word;
|
|
/* Then override it with `anywhere`, which is required to make non-Safari browsers break
|
|
more aggressively when we want them to. */
|
|
overflow-wrap: anywhere;
|
|
}
|
|
.main-heading {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
padding-bottom: 6px;
|
|
margin-bottom: 15px;
|
|
}
|
|
/* The only headings that get underlines are:
|
|
Markdown-generated headings within the top-doc
|
|
Rustdoc-generated h2 section headings (e.g. "Implementations", "Required Methods", etc)
|
|
Underlines elsewhere in the documentation break up visual flow and tend to invert
|
|
section hierarchies. */
|
|
.content h2,
|
|
.top-doc .docblock > h3,
|
|
.top-doc .docblock > h4 {
|
|
border-bottom: 1px solid var(--headings-border-bottom-color);
|
|
}
|
|
h3.code-header {
|
|
font-size: 1.125rem; /* 18px */
|
|
}
|
|
h4.code-header {
|
|
font-size: 1rem;
|
|
}
|
|
.code-header {
|
|
font-weight: 600;
|
|
margin: 0;
|
|
padding: 0;
|
|
/* position notable traits in mobile mode within the header */
|
|
position: relative;
|
|
}
|
|
|
|
#crate-search,
|
|
h1, h2, h3, h4, h5, h6,
|
|
.sidebar,
|
|
.mobile-topbar,
|
|
.search-input,
|
|
.search-results .result-name,
|
|
.item-left > a,
|
|
.out-of-band,
|
|
span.since,
|
|
a.srclink,
|
|
#help-button > a,
|
|
details.rustdoc-toggle.top-doc > summary,
|
|
details.rustdoc-toggle.non-exhaustive > summary,
|
|
.scraped-example-title,
|
|
.more-examples-toggle summary, .more-examples-toggle .hide-more,
|
|
.example-links a,
|
|
/* This selector is for the items listed in the "all items" page. */
|
|
ul.all-items {
|
|
font-family: "Fira Sans", Arial, NanumBarunGothic, sans-serif;
|
|
}
|
|
|
|
#toggle-all-docs,
|
|
a.anchor,
|
|
.small-section-header a,
|
|
#source-sidebar a,
|
|
pre.rust a,
|
|
.sidebar h2 a,
|
|
.sidebar h3 a,
|
|
.mobile-topbar h2 a,
|
|
h1 a,
|
|
.search-results a,
|
|
.module-item .stab,
|
|
.import-item .stab,
|
|
.result-name .primitive > i, .result-name .keyword > i,
|
|
.method .where,
|
|
.fn .where,
|
|
.where.fmt-newline {
|
|
color: var(--main-color);
|
|
}
|
|
|
|
.content span.enum, .content a.enum,
|
|
.content span.struct, .content a.struct,
|
|
.content span.union, .content a.union,
|
|
.content span.primitive, .content a.primitive,
|
|
.content span.type, .content a.type,
|
|
.content span.foreigntype, .content a.foreigntype {
|
|
color: var(--type-link-color);
|
|
}
|
|
|
|
.content span.trait, .content a.trait,
|
|
.content span.traitalias, .content a.traitalias {
|
|
color: var(--trait-link-color);
|
|
}
|
|
|
|
.content span.associatedtype, .content a.associatedtype,
|
|
.content span.constant, .content a.constant,
|
|
.content span.static, .content a.static {
|
|
color: var(--assoc-item-link-color);
|
|
}
|
|
|
|
.content span.fn, .content a.fn,
|
|
.content .fnname,
|
|
.content span.method, .content a.method,
|
|
.content span.tymethod, .content a.tymethod {
|
|
color: var(--function-link-color);
|
|
}
|
|
|
|
.content span.attr, .content a.attr,
|
|
.content span.derive, .content a.derive,
|
|
.content span.macro, .content a.macro {
|
|
color: var(--macro-link-color);
|
|
}
|
|
|
|
.content span.mod, .content a.mod {
|
|
color: var(--mod-link-color);
|
|
}
|
|
|
|
.content span.keyword, .content a.keyword {
|
|
color: var(--keyword-link-color);
|
|
}
|
|
|
|
a {
|
|
color: var(--link-color);
|
|
}
|
|
|
|
ol, ul {
|
|
padding-left: 24px;
|
|
}
|
|
ul ul, ol ul, ul ol, ol ol {
|
|
margin-bottom: .625em;
|
|
}
|
|
|
|
p {
|
|
/* Paragraph spacing at least 1.5 times line spacing per Web Content Accessibility Guidelines.
|
|
Line-height is 1.5rem, so line spacing is .5rem; .75em is 1.5 times that.
|
|
https://www.w3.org/WAI/WCAG21/Understanding/visual-presentation.html */
|
|
margin: 0 0 .75em 0;
|
|
}
|
|
/* For the last child of a div, the margin will be taken care of
|
|
by the margin-top of the next item. */
|
|
p:last-child {
|
|
margin: 0;
|
|
}
|
|
|
|
/* Fix some style changes due to normalize.css 8 */
|
|
|
|
button {
|
|
/* Buttons on Safari have different default padding than other platforms. Make them the same. */
|
|
padding: 1px 6px;
|
|
}
|
|
|
|
button#toggle-all-docs {
|
|
padding: 0;
|
|
background: none;
|
|
border: none;
|
|
cursor: pointer;
|
|
/* iOS button gradient: https://stackoverflow.com/q/5438567 */
|
|
-webkit-appearance: none;
|
|
opacity: 1;
|
|
}
|
|
|
|
/* end tweaks for normalize.css 8 */
|
|
|
|
.rustdoc {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
main {
|
|
position: relative;
|
|
flex-grow: 1;
|
|
padding: 10px 15px 40px 45px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.source main {
|
|
padding: 15px;
|
|
}
|
|
|
|
.width-limiter {
|
|
max-width: 960px;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.source .width-limiter {
|
|
max-width: unset;
|
|
}
|
|
|
|
details:not(.rustdoc-toggle) summary {
|
|
margin-bottom: .6em;
|
|
}
|
|
|
|
code, pre, a.test-arrow, .code-header {
|
|
font-family: "Source Code Pro", monospace;
|
|
}
|
|
.docblock code, .docblock-short code {
|
|
border-radius: 3px;
|
|
padding: 0 0.125em;
|
|
}
|
|
.docblock pre code, .docblock-short pre code {
|
|
padding: 0;
|
|
}
|
|
pre {
|
|
padding: 14px;
|
|
}
|
|
.item-decl pre {
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.source .content pre {
|
|
padding: 20px;
|
|
}
|
|
|
|
img {
|
|
max-width: 100%;
|
|
}
|
|
|
|
.source .content {
|
|
overflow: visible;
|
|
}
|
|
|
|
.sub-logo-container, .logo-container {
|
|
/* zero text boxes so that computed line height = image height exactly */
|
|
line-height: 0;
|
|
}
|
|
|
|
.sub-logo-container > img {
|
|
height: 60px;
|
|
width: 60px;
|
|
object-fit: contain;
|
|
}
|
|
|
|
.rust-logo {
|
|
filter: var(--rust-logo-filter);
|
|
}
|
|
|
|
.sidebar, .mobile-topbar, .sidebar-menu-toggle {
|
|
background-color: var(--sidebar-background-color);
|
|
}
|
|
|
|
.sidebar {
|
|
font-size: 0.875rem;
|
|
width: 200px;
|
|
min-width: 200px;
|
|
overflow-y: scroll;
|
|
position: sticky;
|
|
height: 100vh;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.rustdoc.source .sidebar {
|
|
width: 50px;
|
|
min-width: 0px;
|
|
max-width: 300px;
|
|
flex-grow: 0;
|
|
flex-shrink: 0;
|
|
flex-basis: auto;
|
|
border-right: 1px solid;
|
|
overflow-x: hidden;
|
|
/* The sidebar is by default hidden */
|
|
overflow-y: hidden;
|
|
}
|
|
|
|
.source .sidebar, #sidebar-toggle, #source-sidebar {
|
|
background-color: var(--sidebar-background-color);
|
|
}
|
|
|
|
#sidebar-toggle > button:hover, #sidebar-toggle > button:focus {
|
|
background-color: var(--sidebar-background-color-hover);
|
|
}
|
|
|
|
.source .sidebar > *:not(#sidebar-toggle) {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.source-sidebar-expanded .source .sidebar {
|
|
overflow-y: auto;
|
|
width: 300px;
|
|
}
|
|
|
|
.source-sidebar-expanded .source .sidebar > *:not(#sidebar-toggle) {
|
|
visibility: visible;
|
|
}
|
|
|
|
#all-types {
|
|
margin-top: 1em;
|
|
}
|
|
|
|
/* Improve the scrollbar display on firefox */
|
|
* {
|
|
scrollbar-width: initial;
|
|
scrollbar-color: var(--scrollbar-color);
|
|
}
|
|
.sidebar {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: var(--scrollbar-color);
|
|
}
|
|
|
|
/* Improve the scrollbar display on webkit-based browsers */
|
|
::-webkit-scrollbar {
|
|
width: 12px;
|
|
}
|
|
.sidebar::-webkit-scrollbar {
|
|
width: 8px;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
-webkit-box-shadow: inset 0;
|
|
background-color: var(--scrollbar-track-background-color);
|
|
}
|
|
.sidebar::-webkit-scrollbar-track {
|
|
background-color: var(--scrollbar-track-background-color);
|
|
}
|
|
::-webkit-scrollbar-thumb, .sidebar::-webkit-scrollbar-thumb {
|
|
background-color: var(--scrollbar-thumb-background-color);
|
|
}
|
|
|
|
/* Everything else */
|
|
|
|
.hidden {
|
|
display: none !important;
|
|
}
|
|
|
|
.sidebar .logo-container {
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
.version {
|
|
overflow-wrap: break-word;
|
|
}
|
|
|
|
.logo-container > img {
|
|
height: 100px;
|
|
width: 100px;
|
|
}
|
|
|
|
ul.block, .block li {
|
|
padding: 0;
|
|
margin: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
.block a,
|
|
.sidebar h2 a,
|
|
.sidebar h3 a {
|
|
display: block;
|
|
padding: 0.25rem;
|
|
margin-left: -0.25rem;
|
|
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.sidebar h2 {
|
|
overflow-wrap: anywhere;
|
|
padding: 0;
|
|
margin: 0.7rem 0;
|
|
}
|
|
|
|
.sidebar h3 {
|
|
font-size: 1.125rem; /* 18px */
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.sidebar-elems,
|
|
.sidebar > h2 {
|
|
padding-left: 24px;
|
|
}
|
|
|
|
.sidebar a, .sidebar .current {
|
|
color: var(--sidebar-link-color);
|
|
}
|
|
.sidebar .current,
|
|
.sidebar a:hover {
|
|
background-color: var(--sidebar-current-link-background-color);
|
|
}
|
|
|
|
.sidebar-elems .block {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
.sidebar-elems .block li a {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.mobile-topbar {
|
|
display: none;
|
|
}
|
|
|
|
.source .content pre.rust {
|
|
overflow: auto;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.rustdoc .example-wrap {
|
|
display: flex;
|
|
position: relative;
|
|
margin-bottom: 10px;
|
|
}
|
|
/* For the last child of a div, the margin will be taken care of
|
|
by the margin-top of the next item. */
|
|
.rustdoc .example-wrap:last-child {
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.rustdoc .example-wrap > pre {
|
|
margin: 0;
|
|
flex-grow: 1;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.rustdoc .example-wrap > pre.example-line-numbers,
|
|
.rustdoc .example-wrap > pre.src-line-numbers {
|
|
flex-grow: 0;
|
|
overflow: initial;
|
|
text-align: right;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
|
|
.example-line-numbers {
|
|
border: 1px solid;
|
|
padding: 13px 8px;
|
|
border-top-left-radius: 5px;
|
|
border-bottom-left-radius: 5px;
|
|
border-color: var(--example-line-numbers-border-color);
|
|
}
|
|
|
|
.src-line-numbers span {
|
|
cursor: pointer;
|
|
color: var(--src-line-numbers-span-color);
|
|
}
|
|
.src-line-numbers .line-highlighted {
|
|
background-color: var(--src-line-number-highlighted-background-color);
|
|
}
|
|
.src-line-numbers :target {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.search-loading {
|
|
text-align: center;
|
|
}
|
|
|
|
.docblock-short {
|
|
overflow-wrap: break-word;
|
|
overflow-wrap: anywhere;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
/* Wrap non-pre code blocks (`text`) but not (```text```). */
|
|
.docblock > :not(pre) > code,
|
|
.docblock-short > code {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.top-doc .docblock h2 { font-size: 1.375rem; }
|
|
.top-doc .docblock h3 { font-size: 1.25rem; }
|
|
.top-doc .docblock h4,
|
|
.top-doc .docblock h5 {
|
|
font-size: 1.125rem;
|
|
}
|
|
.top-doc .docblock h6 {
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.docblock h5 { font-size: 1rem; }
|
|
.docblock h6 { font-size: 0.875rem; }
|
|
|
|
.docblock {
|
|
margin-left: 24px;
|
|
position: relative;
|
|
}
|
|
|
|
.docblock > :not(.more-examples-toggle):not(.example-wrap) {
|
|
max-width: 100%;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.out-of-band {
|
|
flex-grow: 0;
|
|
font-size: 1.125rem;
|
|
}
|
|
|
|
.docblock code, .docblock-short code,
|
|
pre, .rustdoc.source .example-wrap {
|
|
background-color: var(--code-block-background-color);
|
|
}
|
|
|
|
#main-content {
|
|
position: relative;
|
|
}
|
|
|
|
.docblock table {
|
|
margin: .5em 0;
|
|
width: calc(100% - 2px);
|
|
overflow-x: auto;
|
|
display: block;
|
|
border-collapse: collapse;
|
|
}
|
|
|
|
.docblock table td {
|
|
padding: .5em;
|
|
border: 1px dashed var(--border-color);
|
|
vertical-align: top;
|
|
}
|
|
|
|
.docblock table th {
|
|
padding: .5em;
|
|
text-align: left;
|
|
border: 1px solid var(--border-color);
|
|
}
|
|
|
|
/* Shift "where ..." part of method or fn definition down a line */
|
|
.method .where,
|
|
.fn .where,
|
|
.where.fmt-newline {
|
|
display: block;
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
.item-info {
|
|
display: block;
|
|
margin-left: 24px;
|
|
}
|
|
|
|
.item-info code {
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
#main-content > .item-info {
|
|
margin-left: 0;
|
|
}
|
|
|
|
nav.sub {
|
|
flex-grow: 1;
|
|
flex-flow: row nowrap;
|
|
margin: 4px 0 25px 0;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.search-form {
|
|
position: relative;
|
|
display: flex;
|
|
height: 34px;
|
|
flex-grow: 1;
|
|
}
|
|
.source nav.sub {
|
|
margin: 0 0 15px 0;
|
|
}
|
|
.source .search-form {
|
|
margin-left: 32px;
|
|
}
|
|
|
|
a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.small-section-header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
position: relative;
|
|
}
|
|
|
|
.small-section-header:hover > .anchor {
|
|
display: initial;
|
|
}
|
|
|
|
.impl:hover > .anchor, .trait-impl:hover > .anchor {
|
|
display: inline-block;
|
|
position: absolute;
|
|
}
|
|
.anchor {
|
|
display: none;
|
|
position: absolute;
|
|
left: -0.5em;
|
|
background: none !important;
|
|
}
|
|
.anchor.field {
|
|
left: -5px;
|
|
}
|
|
.small-section-header > .anchor {
|
|
left: -15px;
|
|
padding-right: 8px;
|
|
}
|
|
h2.small-section-header > .anchor {
|
|
padding-right: 6px;
|
|
}
|
|
.anchor::before {
|
|
content: '§';
|
|
}
|
|
|
|
.main-heading a:hover,
|
|
.example-wrap > pre.rust a:hover,
|
|
.all-items a:hover,
|
|
.docblock a:not(.test-arrow):not(.scrape-help):hover,
|
|
.docblock-short a:not(.test-arrow):not(.scrape-help):hover,
|
|
.item-info a {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.crate.block a.current { font-weight: 500; }
|
|
|
|
/* In most contexts we use `overflow-wrap: anywhere` to ensure that we can wrap
|
|
as much as needed on mobile (see
|
|
src/test/rustdoc-gui/type-declaration-overflow.goml for an example of why
|
|
this matters). The `anywhere` value means:
|
|
|
|
"Soft wrap opportunities introduced by the word break are considered when
|
|
calculating min-content intrinsic sizes."
|
|
|
|
https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap#values
|
|
|
|
For table layouts, that becomes a problem: the browser tries to make each
|
|
column as narrow as possible, and `overflow-wrap: anywhere` means it can do
|
|
so by breaking words - even if some other column could be shrunk without
|
|
breaking words! This shows up, for instance, in the `Structs` / `Modules` /
|
|
`Functions` (etcetera) sections of a module page, and when a docblock
|
|
contains a table.
|
|
|
|
So, for table layouts, override the default with break-word, which does
|
|
_not_ affect min-content intrinsic sizes.
|
|
*/
|
|
table,
|
|
.item-table {
|
|
overflow-wrap: break-word;
|
|
}
|
|
|
|
.item-table {
|
|
display: table;
|
|
}
|
|
.item-row {
|
|
display: table-row;
|
|
}
|
|
.item-left, .item-right {
|
|
display: table-cell;
|
|
}
|
|
.item-left {
|
|
padding-right: 1.25rem;
|
|
}
|
|
|
|
.search-results-title {
|
|
margin-top: 0;
|
|
white-space: nowrap;
|
|
/* flex layout allows shrinking the <select> appropriately if it becomes too large */
|
|
display: inline-flex;
|
|
max-width: 100%;
|
|
/* make things look like in a line, despite the fact that we're using a layout
|
|
with boxes (i.e. from the flex layout) */
|
|
align-items: baseline;
|
|
}
|
|
#crate-search-div {
|
|
display: inline-block;
|
|
/* ensures that 100% in properties of #crate-search-div:after
|
|
are relative to the size of this div */
|
|
position: relative;
|
|
/* allows this div (and with it the <select>-element "#crate-search") to be shrunk */
|
|
min-width: 5em;
|
|
}
|
|
#crate-search {
|
|
min-width: 115px;
|
|
/* keep these two in sync with "@-moz-document url-prefix()" below */
|
|
padding: 0 23px 0 4px;
|
|
/* prevents the <select> from overflowing the containing div in case it's shrunk */
|
|
max-width: 100%;
|
|
/* contents can overflow because of max-width limit, then show ellipsis */
|
|
text-overflow: ellipsis;
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 4px;
|
|
outline: none;
|
|
cursor: pointer;
|
|
-moz-appearance: none;
|
|
-webkit-appearance: none;
|
|
/* Removes default arrow from firefox */
|
|
text-indent: 0.01px;
|
|
background-color: var(--main-background-color);
|
|
color: inherit;
|
|
line-height: 1.5;
|
|
font-weight: 500;
|
|
}
|
|
#crate-search:hover, #crate-search:focus {
|
|
border-color: var(--crate-search-hover-border);
|
|
}
|
|
/* cancel stylistic differences in padding in firefox
|
|
for "appearance: none"-style (or equivalent) <select>s */
|
|
@-moz-document url-prefix() {
|
|
#crate-search {
|
|
padding-left: 0px; /* == 4px - 4px */
|
|
padding-right: 19px; /* == 23px - 4px */
|
|
}
|
|
}
|
|
/* pseudo-element for holding the dropdown-arrow image; needs to be a separate thing
|
|
so that we can apply CSS-filters to change the arrow color in themes */
|
|
#crate-search-div::after {
|
|
/* lets clicks through! */
|
|
pointer-events: none;
|
|
/* completely covers the underlying div */
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
content: "";
|
|
background-repeat: no-repeat;
|
|
background-size: 20px;
|
|
background-position: calc(100% - 2px) 56%;
|
|
/* image is black color */
|
|
background-image: url("down-arrow-927217e04c7463ac.svg");
|
|
/* changes the arrow image color */
|
|
filter: var(--crate-search-div-filter);
|
|
}
|
|
#crate-search-div:hover::after, #crate-search-div:focus-within::after {
|
|
filter: var(--crate-search-div-hover-filter);
|
|
}
|
|
#crate-search > option {
|
|
font-size: 1rem;
|
|
}
|
|
.search-input {
|
|
/* Override Normalize.css: it has a rule that sets
|
|
-webkit-appearance: textfield for search inputs. That
|
|
causes rounded corners and no border on iOS Safari. */
|
|
-webkit-appearance: none;
|
|
outline: none;
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 2px;
|
|
padding: 8px;
|
|
font-size: 1rem;
|
|
flex-grow: 1;
|
|
background-color: var(--button-background-color);
|
|
color: var(--search-color);
|
|
}
|
|
.search-input:focus {
|
|
border-color: var(--search-input-focused-border-color);
|
|
}
|
|
|
|
.search-results {
|
|
display: none;
|
|
}
|
|
|
|
.search-results.active {
|
|
display: block;
|
|
}
|
|
|
|
.search-results > a {
|
|
display: flex;
|
|
/* A little margin ensures the browser's outlining of focused links has room to display. */
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
border-bottom: 1px solid var(--search-result-border-color);
|
|
gap: 1em;
|
|
}
|
|
|
|
.search-results > a > div {
|
|
flex: 1;
|
|
}
|
|
|
|
.search-results > a > div.desc {
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
display: block;
|
|
}
|
|
|
|
.search-results a:hover,
|
|
.search-results a:focus {
|
|
background-color: var(--search-result-link-focus-background-color);
|
|
}
|
|
|
|
.popover {
|
|
font-size: 1rem;
|
|
position: absolute;
|
|
right: 0;
|
|
z-index: 2;
|
|
display: block;
|
|
margin-top: 7px;
|
|
border-radius: 3px;
|
|
border: 1px solid var(--border-color);
|
|
font-size: 1rem;
|
|
}
|
|
|
|
/* This rule is to draw the little arrow connecting the settings menu to the gear icon. */
|
|
.popover::before {
|
|
content: '';
|
|
position: absolute;
|
|
right: 11px;
|
|
border: solid var(--border-color);
|
|
border-width: 1px 1px 0 0;
|
|
display: inline-block;
|
|
padding: 4px;
|
|
transform: rotate(-45deg);
|
|
top: -5px;
|
|
}
|
|
|
|
.popover, .popover::before {
|
|
background-color: var(--main-background-color);
|
|
color: var(--main-color);
|
|
}
|
|
|
|
/* use larger max-width for help popover, but not for help.html */
|
|
#help.popover {
|
|
max-width: 600px;
|
|
}
|
|
|
|
#help.popover::before {
|
|
right: 48px;
|
|
}
|
|
|
|
#help dt {
|
|
float: left;
|
|
clear: left;
|
|
display: block;
|
|
margin-right: 0.5rem;
|
|
}
|
|
#help span.top, #help span.bottom {
|
|
text-align: center;
|
|
display: block;
|
|
font-size: 1.125rem;
|
|
}
|
|
#help span.top {
|
|
margin: 10px 0;
|
|
border-bottom: 1px solid var(--border-color);
|
|
padding-bottom: 4px;
|
|
margin-bottom: 6px;
|
|
}
|
|
#help span.bottom {
|
|
clear: both;
|
|
border-top: 1px solid var(--border-color);
|
|
}
|
|
.side-by-side > div {
|
|
width: 50%;
|
|
float: left;
|
|
padding: 0 20px 20px 17px;
|
|
}
|
|
|
|
.item-info .stab {
|
|
width: fit-content;
|
|
/* This min-height is needed to unify the height of the stab elements because some of them
|
|
have emojis.
|
|
*/
|
|
min-height: 36px;
|
|
display: flex;
|
|
align-items: center;
|
|
white-space: pre-wrap;
|
|
}
|
|
.stab {
|
|
padding: 3px;
|
|
margin-bottom: 5px;
|
|
font-size: 0.875rem;
|
|
font-weight: normal;
|
|
color: var(--main-color);
|
|
background-color: var(--stab-background-color);
|
|
}
|
|
|
|
.stab.portability > code {
|
|
background: none;
|
|
color: var(--stab-code-color);
|
|
}
|
|
|
|
.stab .emoji {
|
|
font-size: 1.25rem;
|
|
margin-right: 0.3rem;
|
|
}
|
|
|
|
/* This is to prevent the `.stab` elements to overflow the .docblock elements. */
|
|
.docblock .stab {
|
|
padding: 0 0.125em;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* Black one-pixel outline around emoji shapes */
|
|
.emoji {
|
|
text-shadow:
|
|
1px 0 0 black,
|
|
-1px 0 0 black,
|
|
0 1px 0 black,
|
|
0 -1px 0 black;
|
|
}
|
|
|
|
.module-item .stab,
|
|
.import-item .stab {
|
|
border-radius: 3px;
|
|
display: inline-block;
|
|
font-size: 0.875rem;
|
|
line-height: 1.2;
|
|
margin-bottom: 0;
|
|
margin-left: 0.3125em;
|
|
padding: 2px;
|
|
vertical-align: text-bottom;
|
|
}
|
|
|
|
.module-item.unstable,
|
|
.import-item.unstable {
|
|
opacity: 0.65;
|
|
}
|
|
|
|
.since {
|
|
font-weight: normal;
|
|
font-size: initial;
|
|
}
|
|
|
|
.rightside {
|
|
padding-left: 12px;
|
|
padding-right: 2px;
|
|
float: right;
|
|
}
|
|
|
|
.rightside:not(a),
|
|
.out-of-band {
|
|
color: var(--right-side-color);
|
|
}
|
|
|
|
pre.rust {
|
|
tab-size: 4;
|
|
-moz-tab-size: 4;
|
|
}
|
|
|
|
/* Code highlighting */
|
|
pre.rust .kw {
|
|
color: var(--code-highlight-kw-color);
|
|
}
|
|
pre.rust .kw-2 {
|
|
color: var(--code-highlight-kw-2-color);
|
|
}
|
|
pre.rust .lifetime {
|
|
color: var(--code-highlight-lifetime-color);
|
|
}
|
|
pre.rust .prelude-ty {
|
|
color: var(--code-highlight-prelude-color);
|
|
}
|
|
pre.rust .prelude-val {
|
|
color: var(--code-highlight-prelude-val-color);
|
|
}
|
|
pre.rust .string {
|
|
color: var(--code-highlight-string-color);
|
|
}
|
|
pre.rust .number {
|
|
color: var(--code-highlight-number-color);
|
|
}
|
|
pre.rust .bool-val {
|
|
color: var(--code-highlight-literal-color);
|
|
}
|
|
pre.rust .self {
|
|
color: var(--code-highlight-self-color);
|
|
}
|
|
pre.rust .attr {
|
|
color: var(--code-highlight-attribute-color);
|
|
}
|
|
pre.rust .macro,
|
|
pre.rust .macro-nonterminal {
|
|
color: var(--code-highlight-macro-color);
|
|
}
|
|
pre.rust .question-mark {
|
|
font-weight: bold;
|
|
color: var(--code-highlight-question-mark-color);
|
|
}
|
|
pre.rust .comment {
|
|
color: var(--code-highlight-comment-color);
|
|
}
|
|
pre.rust .doccomment {
|
|
color: var(--code-highlight-doc-comment-color);
|
|
}
|
|
|
|
.example-wrap.compile_fail,
|
|
.example-wrap.should_panic {
|
|
border-left: 2px solid var(--codeblock-error-color);
|
|
}
|
|
|
|
.ignore.example-wrap {
|
|
border-left: 2px solid var(--codeblock-ignore-color);
|
|
}
|
|
|
|
.example-wrap.compile_fail:hover,
|
|
.example-wrap.should_panic:hover {
|
|
border-left: 2px solid var(--codeblock-error-hover-color);
|
|
}
|
|
|
|
.example-wrap.ignore:hover {
|
|
border-left: 2px solid var(--codeblock-ignore-hover-color);
|
|
}
|
|
|
|
.example-wrap.compile_fail .tooltip,
|
|
.example-wrap.should_panic .tooltip {
|
|
color: var(--codeblock-error-color);
|
|
}
|
|
|
|
.example-wrap.ignore .tooltip {
|
|
color: var(--codeblock-ignore-color);
|
|
}
|
|
|
|
.example-wrap.compile_fail:hover .tooltip,
|
|
.example-wrap.should_panic:hover .tooltip {
|
|
color: var(--codeblock-error-hover-color);
|
|
}
|
|
|
|
.example-wrap.ignore:hover .tooltip {
|
|
color: var(--codeblock-ignore-hover-color);
|
|
}
|
|
|
|
.example-wrap .tooltip {
|
|
position: absolute;
|
|
display: block;
|
|
cursor: pointer;
|
|
left: -25px;
|
|
top: 5px;
|
|
}
|
|
|
|
.example-wrap .tooltip::after {
|
|
display: none;
|
|
text-align: center;
|
|
padding: 5px 3px 3px 3px;
|
|
border-radius: 6px;
|
|
margin-left: 5px;
|
|
font-size: 1rem;
|
|
border: 1px solid var(--border-color);
|
|
position: absolute;
|
|
width: max-content;
|
|
top: -2px;
|
|
z-index: 1;
|
|
}
|
|
|
|
.example-wrap .tooltip::before {
|
|
content: " ";
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 16px;
|
|
margin-top: -5px;
|
|
border-width: 5px;
|
|
border-style: solid;
|
|
display: none;
|
|
z-index: 1;
|
|
}
|
|
|
|
.example-wrap.ignore .tooltip::after {
|
|
content: "This example is not tested";
|
|
}
|
|
.example-wrap.compile_fail .tooltip::after {
|
|
content: "This example deliberately fails to compile";
|
|
}
|
|
.example-wrap.should_panic .tooltip::after {
|
|
content: "This example panics";
|
|
}
|
|
.example-wrap.edition .tooltip::after {
|
|
content: "This code runs with edition " attr(data-edition);
|
|
}
|
|
|
|
.example-wrap .tooltip:hover::before, .example-wrap .tooltip:hover::after {
|
|
display: inline;
|
|
}
|
|
|
|
.example-wrap.compile_fail .tooltip,
|
|
.example-wrap.should_panic .tooltip,
|
|
.example-wrap.ignore .tooltip {
|
|
font-weight: bold;
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
a.test-arrow {
|
|
display: inline-block;
|
|
visibility: hidden;
|
|
position: absolute;
|
|
padding: 5px 10px 5px 10px;
|
|
border-radius: 5px;
|
|
font-size: 1.375rem;
|
|
top: 5px;
|
|
right: 5px;
|
|
z-index: 1;
|
|
color: var(--test-arrow-color);
|
|
background-color: var(--test-arrow-background-color);
|
|
}
|
|
a.test-arrow:hover {
|
|
color: var(--test-arrow-hover-color);
|
|
background-color: var(--test-arrow-hover-background-color);
|
|
}
|
|
.example-wrap:hover .test-arrow {
|
|
visibility: visible;
|
|
}
|
|
|
|
.code-attribute {
|
|
font-weight: 300;
|
|
color: var(--code-attribute-color);
|
|
}
|
|
|
|
.item-spacer {
|
|
width: 100%;
|
|
height: 12px;
|
|
}
|
|
|
|
.out-of-band > span.since {
|
|
font-size: 1.25rem;
|
|
}
|
|
|
|
h3.variant {
|
|
font-weight: 600;
|
|
font-size: 1.125rem;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.sub-variant h4 {
|
|
font-size: 1rem;
|
|
font-weight: 400;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.sub-variant {
|
|
margin-left: 24px;
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.sub-variant > .sub-variant-field {
|
|
margin-left: 24px;
|
|
}
|
|
|
|
:target > code, :target > .code-header {
|
|
opacity: 1;
|
|
}
|
|
|
|
:target {
|
|
padding-right: 3px;
|
|
background-color: var(--target-background-color);
|
|
border-right: 3px solid var(--target-border-color);
|
|
}
|
|
|
|
.notable-traits-tooltip {
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.notable-traits .notable-traits-tooltiptext {
|
|
display: inline-block;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.notable-traits-tooltiptext {
|
|
padding: 5px 3px 3px 3px;
|
|
border-radius: 6px;
|
|
margin-left: 5px;
|
|
z-index: 10;
|
|
font-size: 1rem;
|
|
cursor: default;
|
|
position: absolute;
|
|
border: 1px solid;
|
|
}
|
|
|
|
.notable-traits-tooltip::after {
|
|
/* The margin on the tooltip does not capture hover events,
|
|
this extends the area of hover enough so that mouse hover is not
|
|
lost when moving the mouse to the tooltip */
|
|
content: "\00a0\00a0\00a0";
|
|
}
|
|
|
|
.notable-traits-tooltiptext .docblock {
|
|
margin: 0;
|
|
}
|
|
|
|
.notable-traits-tooltiptext .notable {
|
|
font-size: 1.1875rem;
|
|
font-weight: 600;
|
|
display: block;
|
|
}
|
|
|
|
.notable-traits-tooltiptext pre, .notable-traits-tooltiptext code {
|
|
background: transparent;
|
|
}
|
|
|
|
.notable-traits-tooltiptext .docblock pre.content {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 1.25rem;
|
|
white-space: pre-wrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.search-failed {
|
|
text-align: center;
|
|
margin-top: 20px;
|
|
display: none;
|
|
}
|
|
|
|
.search-failed.active {
|
|
display: block;
|
|
}
|
|
|
|
.search-failed > ul {
|
|
text-align: left;
|
|
max-width: 570px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
#titles {
|
|
display: flex;
|
|
flex-direction: row;
|
|
gap: 1px;
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
#titles > button {
|
|
text-align: center;
|
|
font-size: 1.125rem;
|
|
cursor: pointer;
|
|
border: 0;
|
|
border-top: 2px solid;
|
|
flex: 1;
|
|
line-height: 1.5;
|
|
color: inherit;
|
|
}
|
|
|
|
#titles > button > div.count {
|
|
display: inline-block;
|
|
font-size: 1rem;
|
|
}
|
|
|
|
.notable-traits {
|
|
cursor: pointer;
|
|
z-index: 2;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
#sidebar-toggle {
|
|
position: sticky;
|
|
top: 0;
|
|
left: 0;
|
|
font-size: 1.25rem;
|
|
border-bottom: 1px solid;
|
|
display: flex;
|
|
height: 40px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
z-index: 10;
|
|
}
|
|
#source-sidebar {
|
|
width: 100%;
|
|
overflow: auto;
|
|
}
|
|
#source-sidebar > .title {
|
|
font-size: 1.5rem;
|
|
text-align: center;
|
|
border-bottom: 1px solid var(--border-color);
|
|
margin-bottom: 6px;
|
|
}
|
|
#sidebar-toggle > button {
|
|
font-size: inherit;
|
|
font-weight: bold;
|
|
background: none;
|
|
color: inherit;
|
|
cursor: pointer;
|
|
text-align: center;
|
|
border: none;
|
|
outline: none;
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
/* work around button layout strangeness: https://stackoverflow.com/q/7271561 */
|
|
width: 100%;
|
|
/* iOS button gradient: https://stackoverflow.com/q/5438567 */
|
|
-webkit-appearance: none;
|
|
opacity: 1;
|
|
}
|
|
#settings-menu, #help-button {
|
|
margin-left: 4px;
|
|
outline: none;
|
|
}
|
|
|
|
#settings-menu > a, #help-button > a, #copy-path {
|
|
width: 33px;
|
|
cursor: pointer;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
#settings-menu > a, #help-button > a {
|
|
padding: 5px;
|
|
height: 100%;
|
|
display: block;
|
|
background-color: var(--button-background-color);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 2px;
|
|
}
|
|
|
|
#copy-path {
|
|
color: var(--copy-path-button-color);
|
|
background: var(--main-background-color);
|
|
height: 34px;
|
|
margin-left: 10px;
|
|
padding: 0;
|
|
padding-left: 2px;
|
|
border: 0;
|
|
}
|
|
#copy-path > img {
|
|
filter: var(--copy-path-img-filter);
|
|
}
|
|
#copy-path:hover > img {
|
|
filter: var(--copy-path-img-hover-filter);
|
|
}
|
|
|
|
@keyframes rotating {
|
|
from {
|
|
transform: rotate(0deg);
|
|
}
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
#settings-menu.rotate > a img {
|
|
animation: rotating 2s linear infinite;
|
|
}
|
|
|
|
#help-button > a {
|
|
text-align: center;
|
|
/* Rare exception to specifying font sizes in rem. Since this is acting
|
|
as an icon, it's okay to specify their sizes in pixels. */
|
|
font-size: 20px;
|
|
padding-top: 2px;
|
|
}
|
|
|
|
kbd {
|
|
display: inline-block;
|
|
padding: 3px 5px;
|
|
font: 15px monospace;
|
|
line-height: 10px;
|
|
vertical-align: middle;
|
|
border: solid 1px var(--border-color);
|
|
border-radius: 3px;
|
|
cursor: default;
|
|
}
|
|
|
|
ul.all-items > li {
|
|
list-style: none;
|
|
}
|
|
|
|
details.dir-entry {
|
|
padding-left: 4px;
|
|
}
|
|
|
|
details.dir-entry > summary::after {
|
|
content: " ►";
|
|
position: absolute;
|
|
left: -15px;
|
|
top: 0px;
|
|
font-size: 80%;
|
|
padding: 2px 0px;
|
|
/* set width to cover gap between arrow and text */
|
|
width: 25px;
|
|
}
|
|
|
|
details[open].dir-entry > summary::after {
|
|
content: " ▼";
|
|
}
|
|
|
|
details.dir-entry > summary::-webkit-details-marker,
|
|
details.dir-entry > summary::marker {
|
|
display: none;
|
|
}
|
|
|
|
details.dir-entry > summary {
|
|
margin: 0 0 0 13px;
|
|
list-style: none;
|
|
cursor: pointer;
|
|
position: relative;
|
|
}
|
|
|
|
details.dir-entry div.folders, details.dir-entry div.files {
|
|
padding-left: 23px;
|
|
}
|
|
|
|
details.dir-entry a {
|
|
display: block;
|
|
}
|
|
|
|
/* We use CSS containment on the details elements because most sizeable elements
|
|
of the page are contained in one of these. This also makes re-rendering
|
|
faster on document changes (like closing and opening toggles).
|
|
Unfortunately we can't yet specify contain: content or contain: strict
|
|
because the [-]/[+] toggles extend past the boundaries of the <details>
|
|
https://developer.mozilla.org/en-US/docs/Web/CSS/contain */
|
|
details.rustdoc-toggle {
|
|
contain: layout;
|
|
position: relative;
|
|
}
|
|
|
|
/* The hideme class is used on summary tags that contain a span with
|
|
placeholder text shown only when the toggle is closed. For instance,
|
|
"Expand description" or "Show methods". */
|
|
details.rustdoc-toggle > summary.hideme {
|
|
cursor: pointer;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary {
|
|
list-style: none;
|
|
/* focus outline is shown on `::before` instead of this */
|
|
outline: none;
|
|
}
|
|
details.rustdoc-toggle > summary::-webkit-details-marker,
|
|
details.rustdoc-toggle > summary::marker {
|
|
display: none;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary.hideme > span {
|
|
margin-left: 9px;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary::before {
|
|
content: "";
|
|
cursor: pointer;
|
|
width: 16px;
|
|
height: 16px;
|
|
background-repeat: no-repeat;
|
|
background-position: top left;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
opacity: .5;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary.hideme > span,
|
|
.more-examples-toggle summary, .more-examples-toggle .hide-more {
|
|
color: var(--toggles-color);
|
|
}
|
|
|
|
/* Screen readers see the text version at the end the line.
|
|
Visual readers see the icon at the start of the line, but small and transparent. */
|
|
details.rustdoc-toggle > summary::after {
|
|
content: "Expand";
|
|
overflow: hidden;
|
|
width: 0;
|
|
height: 0;
|
|
position: absolute;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary.hideme::after {
|
|
/* "hideme" toggles already have a description when they're contracted */
|
|
content: "";
|
|
}
|
|
|
|
details.rustdoc-toggle > summary:focus::before,
|
|
details.rustdoc-toggle > summary:hover::before {
|
|
opacity: 1;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary:focus-visible::before {
|
|
/* The SVG is black, and gets turned white using a filter in the dark themes.
|
|
Do the same with the outline.
|
|
The dotted 1px style is copied from Firefox's focus ring style.
|
|
*/
|
|
outline: 1px dotted #000;
|
|
outline-offset: 1px;
|
|
}
|
|
|
|
details.rustdoc-toggle.top-doc > summary,
|
|
details.rustdoc-toggle.top-doc > summary::before,
|
|
details.rustdoc-toggle.non-exhaustive > summary,
|
|
details.rustdoc-toggle.non-exhaustive > summary::before {
|
|
font-size: 1rem;
|
|
}
|
|
|
|
details.non-exhaustive {
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary.hideme::before {
|
|
position: relative;
|
|
}
|
|
|
|
details.rustdoc-toggle > summary:not(.hideme)::before {
|
|
position: absolute;
|
|
left: -24px;
|
|
top: 4px;
|
|
}
|
|
|
|
.impl-items > details.rustdoc-toggle > summary:not(.hideme)::before {
|
|
position: absolute;
|
|
left: -24px;
|
|
}
|
|
|
|
/* When a "hideme" summary is open and the "Expand description" or "Show
|
|
methods" text is hidden, we want the [-] toggle that remains to not
|
|
affect the layout of the items to its right. To do that, we use
|
|
absolute positioning. Note that we also set position: relative
|
|
on the parent <details> to make this work properly. */
|
|
details.rustdoc-toggle[open] > summary.hideme {
|
|
position: absolute;
|
|
}
|
|
|
|
details.rustdoc-toggle[open] > summary.hideme > span {
|
|
display: none;
|
|
}
|
|
|
|
details.rustdoc-toggle[open] > summary::before,
|
|
details.rustdoc-toggle[open] > summary.hideme::before {
|
|
background-image: url("toggle-minus-31bbd6e4c77f5c96.svg");
|
|
}
|
|
|
|
details.rustdoc-toggle > summary::before {
|
|
background-image: url("toggle-plus-1092eb4930d581b0.svg");
|
|
}
|
|
|
|
details.rustdoc-toggle[open] > summary::before,
|
|
details.rustdoc-toggle[open] > summary.hideme::before {
|
|
width: 16px;
|
|
height: 16px;
|
|
background-repeat: no-repeat;
|
|
background-position: top left;
|
|
display: inline-block;
|
|
content: "";
|
|
}
|
|
|
|
details.rustdoc-toggle[open] > summary::after,
|
|
details.rustdoc-toggle[open] > summary.hideme::after {
|
|
content: "Collapse";
|
|
}
|
|
|
|
/* This is needed in docblocks to have the "▶" element to be on the same line. */
|
|
.docblock summary > * {
|
|
display: inline-block;
|
|
}
|
|
|
|
/* In case there is no documentation before a code block, we need to add some margin at the top
|
|
to prevent an overlay between the "collapse toggle" and the information tooltip.
|
|
However, it's not needed with smaller screen width because the doc/code block is always put
|
|
"one line" below. */
|
|
.docblock > .example-wrap:first-child .tooltip {
|
|
margin-top: 16px;
|
|
}
|
|
|
|
/* Media Queries */
|
|
|
|
/*
|
|
WARNING: RUSTDOC_MOBILE_BREAKPOINT MEDIA QUERY
|
|
If you update this line, then you also need to update the line with the same warning
|
|
in storage.js
|
|
*/
|
|
@media (max-width: 700px) {
|
|
/* When linking to an item with an `id` (for instance, by clicking a link in the sidebar,
|
|
or visiting a URL with a fragment like `#method.new`, we don't want the item to be obscured
|
|
by the topbar. Anything with an `id` gets scroll-margin-top equal to .mobile-topbar's size.
|
|
*/
|
|
*[id] {
|
|
scroll-margin-top: 45px;
|
|
}
|
|
|
|
.rustdoc {
|
|
/* Sidebar should overlay main content, rather than pushing main content to the right.
|
|
Turn off `display: flex` on the body element. */
|
|
display: block;
|
|
}
|
|
|
|
main {
|
|
padding-left: 15px;
|
|
padding-top: 0px;
|
|
}
|
|
|
|
.main-heading {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.out-of-band {
|
|
text-align: left;
|
|
margin-left: initial;
|
|
padding: initial;
|
|
}
|
|
|
|
.out-of-band .since::before {
|
|
content: "Since ";
|
|
}
|
|
|
|
#copy-path {
|
|
display: none;
|
|
}
|
|
|
|
/* Hide the logo and item name from the sidebar. Those are displayed
|
|
in the mobile-topbar instead. */
|
|
.sidebar .sidebar-logo,
|
|
.sidebar .location {
|
|
display: none;
|
|
}
|
|
|
|
.sidebar {
|
|
position: fixed;
|
|
top: 45px;
|
|
/* Hide the sidebar offscreen while not in use. Doing this instead of display: none means
|
|
the sidebar stays visible for screen readers, which is useful for navigation. */
|
|
left: -1000px;
|
|
margin: 0;
|
|
padding: 0;
|
|
z-index: 11;
|
|
/* Reduce height slightly to account for mobile topbar. */
|
|
height: calc(100vh - 45px);
|
|
}
|
|
|
|
/* The source view uses a different design for the sidebar toggle, and doesn't have a topbar,
|
|
so don't bump down the main content or the sidebar. */
|
|
.source main,
|
|
.rustdoc.source .sidebar {
|
|
top: 0;
|
|
padding: 0;
|
|
height: 100vh;
|
|
border: 0;
|
|
}
|
|
|
|
.sidebar.shown,
|
|
.source-sidebar-expanded .source .sidebar,
|
|
.sidebar:focus-within {
|
|
left: 0;
|
|
}
|
|
|
|
.rustdoc.source > .sidebar {
|
|
width: 0;
|
|
}
|
|
|
|
.mobile-topbar h2 {
|
|
padding-bottom: 0;
|
|
margin: auto 0.5em auto auto;
|
|
overflow: hidden;
|
|
/* Rare exception to specifying font sizes in rem. Since the topbar
|
|
height is specified in pixels, this also has to be specified in
|
|
pixels to avoid overflowing the topbar when the user sets a bigger
|
|
font size. */
|
|
font-size: 24px;
|
|
}
|
|
|
|
.mobile-topbar h2 a {
|
|
display: block;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.mobile-topbar .logo-container > img {
|
|
max-width: 35px;
|
|
max-height: 35px;
|
|
margin: 5px 0 5px 20px;
|
|
}
|
|
|
|
.mobile-topbar {
|
|
display: flex;
|
|
flex-direction: row;
|
|
position: sticky;
|
|
z-index: 10;
|
|
font-size: 2rem;
|
|
height: 45px;
|
|
width: 100%;
|
|
left: 0;
|
|
top: 0;
|
|
}
|
|
|
|
.sidebar-menu-toggle {
|
|
width: 45px;
|
|
/* Rare exception to specifying font sizes in rem. Since this is acting
|
|
as an icon, it's okay to specify its sizes in pixels. */
|
|
font-size: 32px;
|
|
border: none;
|
|
color: var(--main-color);
|
|
}
|
|
|
|
.sidebar-elems {
|
|
margin-top: 1em;
|
|
}
|
|
|
|
.content {
|
|
margin-left: 0px;
|
|
}
|
|
|
|
.anchor {
|
|
display: none !important;
|
|
}
|
|
|
|
#titles > button > div.count {
|
|
display: block;
|
|
}
|
|
|
|
#main-content > details.rustdoc-toggle > summary::before,
|
|
#main-content > div > details.rustdoc-toggle > summary::before {
|
|
left: -11px;
|
|
}
|
|
|
|
#sidebar-toggle {
|
|
position: fixed;
|
|
left: 1px;
|
|
top: 100px;
|
|
width: 30px;
|
|
font-size: 1.5rem;
|
|
text-align: center;
|
|
padding: 0;
|
|
z-index: 10;
|
|
border-top-right-radius: 3px;
|
|
border-bottom-right-radius: 3px;
|
|
cursor: pointer;
|
|
border: 1px solid;
|
|
border-left: 0;
|
|
}
|
|
|
|
.source-sidebar-expanded #sidebar-toggle {
|
|
left: unset;
|
|
top: unset;
|
|
width: unset;
|
|
border-top-right-radius: unset;
|
|
border-bottom-right-radius: unset;
|
|
position: sticky;
|
|
border: 0;
|
|
border-bottom: 1px solid;
|
|
}
|
|
|
|
.notable-traits .notable-traits-tooltiptext {
|
|
left: 0;
|
|
top: 100%;
|
|
}
|
|
|
|
/* We don't display the help button on mobile devices. */
|
|
#help-button {
|
|
display: none;
|
|
}
|
|
|
|
/* Display an alternating layout on tablets and phones */
|
|
.item-table, .item-row, .item-left, .item-right,
|
|
.search-results > a, .search-results > a > div {
|
|
display: block;
|
|
}
|
|
|
|
/* Display an alternating layout on tablets and phones */
|
|
.search-results > a {
|
|
padding: 5px 0px;
|
|
}
|
|
.search-results > a > div.desc, .item-right {
|
|
padding-left: 2em;
|
|
}
|
|
|
|
.source-sidebar-expanded .source .sidebar {
|
|
max-width: 100vw;
|
|
width: 100vw;
|
|
}
|
|
|
|
/* Position of the "[-]" element. */
|
|
details.rustdoc-toggle:not(.top-doc) > summary {
|
|
margin-left: 10px;
|
|
}
|
|
.impl-items > details.rustdoc-toggle > summary:not(.hideme)::before,
|
|
#main-content > details.rustdoc-toggle:not(.top-doc) > summary::before,
|
|
#main-content > div > details.rustdoc-toggle > summary::before {
|
|
left: -11px;
|
|
}
|
|
|
|
/* Align summary-nested and unnested item-info gizmos. */
|
|
.impl-items > .item-info {
|
|
margin-left: 34px;
|
|
}
|
|
|
|
.source nav.sub {
|
|
margin: 0;
|
|
padding: 8px;
|
|
}
|
|
}
|
|
|
|
@media print {
|
|
nav.sidebar, nav.sub, .out-of-band, a.srclink, #copy-path,
|
|
details.rustdoc-toggle[open] > summary::before, details.rustdoc-toggle > summary::before,
|
|
details.rustdoc-toggle.top-doc > summary {
|
|
display: none;
|
|
}
|
|
|
|
.docblock {
|
|
margin-left: 0;
|
|
}
|
|
|
|
main {
|
|
padding: 10px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 464px) {
|
|
.docblock {
|
|
margin-left: 12px;
|
|
}
|
|
|
|
.docblock code {
|
|
overflow-wrap: break-word;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
nav.sub {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.search-form {
|
|
align-self: stretch;
|
|
}
|
|
|
|
.sub-logo-container > img {
|
|
height: 35px;
|
|
width: 35px;
|
|
}
|
|
|
|
#sidebar-toggle {
|
|
top: 10px;
|
|
}
|
|
.source-sidebar-expanded #sidebar-toggle {
|
|
top: unset;
|
|
}
|
|
}
|
|
|
|
.implementors-toggle > summary,
|
|
.impl,
|
|
#implementors-list > .docblock,
|
|
.impl-items > section,
|
|
.impl-items > .rustdoc-toggle > summary,
|
|
.methods > section,
|
|
.methods > .rustdoc-toggle > summary
|
|
{
|
|
margin-bottom: 0.75em;
|
|
}
|
|
|
|
.impl-items > .rustdoc-toggle[open]:not(:last-child),
|
|
.methods > .rustdoc-toggle[open]:not(:last-child),
|
|
.implementors-toggle[open]:not(:last-child) {
|
|
margin-bottom: 2em;
|
|
}
|
|
|
|
#trait-implementations-list .impl-items > .rustdoc-toggle:not(:last-child),
|
|
#synthetic-implementations-list .impl-items > .rustdoc-toggle:not(:last-child),
|
|
#blanket-implementations-list .impl-items > .rustdoc-toggle:not(:last-child) {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
/* Begin: styles for --scrape-examples feature */
|
|
|
|
.scraped-example-list .scrape-help {
|
|
margin-left: 10px;
|
|
padding: 0 4px;
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
position: relative;
|
|
bottom: 1px;
|
|
background: transparent;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
border-radius: 50px;
|
|
}
|
|
|
|
.scraped-example .code-wrapper {
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
width: 100%;
|
|
}
|
|
|
|
.scraped-example:not(.expanded) .code-wrapper {
|
|
max-height: 240px;
|
|
}
|
|
|
|
.scraped-example:not(.expanded) .code-wrapper pre {
|
|
overflow-y: hidden;
|
|
max-height: 240px;
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.scraped-example .code-wrapper .next,
|
|
.scraped-example .code-wrapper .prev,
|
|
.scraped-example .code-wrapper .expand {
|
|
position: absolute;
|
|
top: 0.25em;
|
|
z-index: 1;
|
|
cursor: pointer;
|
|
}
|
|
.scraped-example .code-wrapper .prev {
|
|
right: 2.25em;
|
|
}
|
|
.scraped-example .code-wrapper .next {
|
|
right: 1.25em;
|
|
}
|
|
.scraped-example .code-wrapper .expand {
|
|
right: 0.25em;
|
|
}
|
|
|
|
.scraped-example:not(.expanded) .code-wrapper:before,
|
|
.scraped-example:not(.expanded) .code-wrapper:after {
|
|
content: " ";
|
|
width: 100%;
|
|
height: 5px;
|
|
position: absolute;
|
|
z-index: 1;
|
|
}
|
|
.scraped-example:not(.expanded) .code-wrapper:before {
|
|
top: 0;
|
|
}
|
|
.scraped-example:not(.expanded) .code-wrapper:after {
|
|
bottom: 0;
|
|
}
|
|
|
|
.scraped-example .code-wrapper .src-line-numbers {
|
|
margin: 0;
|
|
padding: 14px 0;
|
|
}
|
|
|
|
.scraped-example .code-wrapper .src-line-numbers span {
|
|
padding: 0 14px;
|
|
}
|
|
|
|
.scraped-example .code-wrapper .example-wrap {
|
|
flex: 1;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.scraped-example:not(.expanded) .code-wrapper .example-wrap {
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.scraped-example .code-wrapper .example-wrap pre.rust {
|
|
overflow-x: inherit;
|
|
width: inherit;
|
|
overflow-y: hidden;
|
|
}
|
|
|
|
|
|
.more-examples-toggle {
|
|
max-width: calc(100% + 25px);
|
|
margin-top: 10px;
|
|
margin-left: -25px;
|
|
}
|
|
|
|
.more-examples-toggle .hide-more {
|
|
margin-left: 25px;
|
|
margin-bottom: 5px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.more-scraped-examples {
|
|
margin-left: 5px;
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.more-scraped-examples-inner {
|
|
/* 20px is width of toggle-line + toggle-line-inner */
|
|
width: calc(100% - 20px);
|
|
}
|
|
|
|
.toggle-line {
|
|
align-self: stretch;
|
|
margin-right: 10px;
|
|
margin-top: 5px;
|
|
padding: 0 4px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.toggle-line-inner {
|
|
min-width: 2px;
|
|
height: 100%;
|
|
}
|
|
|
|
.more-scraped-examples .scraped-example {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.more-scraped-examples .scraped-example:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.example-links a {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.example-links ul {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* End: styles for --scrape-examples feature */
|