rustdoc: simplify CSS and DOM for more-scraped-examples

This gets rid of the more-scraped-examples-inner wrapper, instead nesting the
children directly and using absolute positioning for the toggle line.
This commit is contained in:
Michael Howell 2022-12-21 18:03:31 -07:00
parent b569c9dc57
commit 2b661c33de
3 changed files with 14 additions and 20 deletions

View file

@ -3005,8 +3005,7 @@ fn render_call_locations(w: &mut Buffer, cx: &mut Context<'_>, item: &clean::Ite
</summary>\
<div class=\"hide-more\">Hide additional examples</div>\
<div class=\"more-scraped-examples\">\
<div class=\"toggle-line\"><div class=\"toggle-line-inner\"></div></div>\
<div class=\"more-scraped-examples-inner\">"
<div class=\"toggle-line\"><div class=\"toggle-line-inner\"></div></div>"
);
// Only generate inline code for MAX_FULL_EXAMPLES number of examples. Otherwise we could
@ -3030,7 +3029,7 @@ fn render_call_locations(w: &mut Buffer, cx: &mut Context<'_>, item: &clean::Ite
write!(w, "</ul></div>");
}
write!(w, "</div></div></details>");
write!(w, "</div></details>");
}
write!(w, "</div>");

View file

@ -1991,20 +1991,15 @@ in storage.js
}
.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);
margin-left: 25px;
position: relative;
}
.toggle-line {
align-self: stretch;
margin-right: 10px;
margin-top: 5px;
position: absolute;
top: 5px;
bottom: 0;
right: calc(100% + 10px);
padding: 0 4px;
cursor: pointer;
}

View file

@ -10,13 +10,8 @@ assert-property-false: (
// Check that examples with very long lines have the same width as ones that don't.
store-property: (
clientWidth,
".more-scraped-examples .scraped-example:nth-child(1) .code-wrapper .src-line-numbers",
"clientWidth"
)
assert-property: (
".more-scraped-examples .scraped-example:nth-child(2) .code-wrapper .src-line-numbers",
{"clientWidth": |clientWidth|}
"clientWidth"
)
assert-property: (
@ -33,3 +28,8 @@ assert-property: (
".more-scraped-examples .scraped-example:nth-child(5) .code-wrapper .src-line-numbers",
{"clientWidth": |clientWidth|}
)
assert-property: (
".more-scraped-examples .scraped-example:nth-child(6) .code-wrapper .src-line-numbers",
{"clientWidth": |clientWidth|}
)