1
Fork 0

Add styles for non-white themes

Tweak colors

Tabs

New link heading style
This commit is contained in:
Will Crichton 2021-09-14 09:50:47 -07:00
parent 18edcf86d2
commit a1cb19444f
4 changed files with 61 additions and 15 deletions

View file

@ -2482,16 +2482,6 @@ fn render_call_locations(
id
);
// Link to the source file containing a given example
let example_url = |call_data: &CallData| -> String {
format!(
r#"<a href="{root}{url}" target="_blank">{name}</a>"#,
root = cx.root_path(),
url = call_data.url,
name = call_data.display_name
)
};
// Generate the HTML for a single example, being the title and code block
let tcx = cx.tcx();
let write_example = |w: &mut Buffer, (path, call_data): (&PathBuf, &CallData)| -> bool {
@ -2534,9 +2524,13 @@ fn render_call_locations(
write!(
w,
r#"<div class="scraped-example" data-locs="{locations}">
<div class="scraped-example-title">{title}</div>
<div class="code-wrapper">"#,
title = example_url(call_data),
<div class="scraped-example-title">
{name} <a href="{root}{url}" target="_blank">[src]</a>
</div>
<div class="code-wrapper">"#,
root = cx.root_path(),
url = call_data.url,
name = call_data.display_name,
// The locations are encoded as a data attribute, so they can be read
// later by the JS for interactions.
locations = serde_json::to_string(&line_ranges).unwrap(),
@ -2639,7 +2633,13 @@ fn render_call_locations(
r#"<div class="example-links">Additional examples can be found in:<br /><ul>"#
);
it.for_each(|(_, call_data)| {
write!(w, "<li>{}</li>", example_url(call_data));
write!(
w,
r#"<li><a href="{}{}" target="_blank">{}</a></li>"#,
root = cx.root_path(),
url = call_data.url,
name = call_data.display_name
);
});
write!(w, "</ul></div>");
}

View file

@ -1976,7 +1976,10 @@ details.undocumented[open] > summary::before {
.scraped-example-title {
font-family: 'Fira Sans';
font-weight: 500;
}
.scraped-example-title a {
margin-left: 5px;
}
.scraped-example:not(.expanded) .code-wrapper pre.line-numbers,
@ -2115,7 +2118,12 @@ h1 + .scraped-example {
margin-bottom: 20px;
}
.more-scraped-examples .scraped-example:last-child {
margin-bottom: 0;
}
.example-links a {
margin-top: 20px;
font-family: 'Fira Sans';
}

View file

@ -613,3 +613,22 @@ div.files > .selected {
input:checked + .slider {
background-color: #ffb454 !important;
}
.scraped-example .example-wrap .rust span.highlight {
background: rgb(91, 59, 1);
}
.scraped-example .example-wrap .rust span.highlight.focus {
background: rgb(124, 75, 15);
}
.scraped-example:not(.expanded) .code-wrapper:before {
background: linear-gradient(to bottom, rgba(15, 20, 25, 1), rgba(15, 20, 25, 0));
}
.scraped-example:not(.expanded) .code-wrapper:after {
background: linear-gradient(to top, rgba(15, 20, 25, 1), rgba(15, 20, 25, 0));
}
.toggle-line-inner {
background: #616161;
}
.toggle-line:hover .toggle-line-inner {
background: ##898989;
}

View file

@ -485,3 +485,22 @@ div.files > .selected {
.setting-line > .title {
border-bottom-color: #ddd;
}
.scraped-example .example-wrap .rust span.highlight {
background: rgb(91, 59, 1);
}
.scraped-example .example-wrap .rust span.highlight.focus {
background: rgb(124, 75, 15);
}
.scraped-example:not(.expanded) .code-wrapper:before {
background: linear-gradient(to bottom, rgba(53, 53, 53, 1), rgba(53, 53, 53, 0));
}
.scraped-example:not(.expanded) .code-wrapper:after {
background: linear-gradient(to top, rgba(53, 53, 53, 1), rgba(53, 53, 53, 0));
}
.toggle-line-inner {
background: #616161;
}
.toggle-line:hover .toggle-line-inner {
background: ##898989;
}