1
Fork 0

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>\ </summary>\
<div class=\"hide-more\">Hide additional examples</div>\ <div class=\"hide-more\">Hide additional examples</div>\
<div class=\"more-scraped-examples\">\ <div class=\"more-scraped-examples\">\
<div class=\"toggle-line\"><div class=\"toggle-line-inner\"></div></div>\ <div class=\"toggle-line\"><div class=\"toggle-line-inner\"></div></div>"
<div class=\"more-scraped-examples-inner\">"
); );
// Only generate inline code for MAX_FULL_EXAMPLES number of examples. Otherwise we could // 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, "</ul></div>");
} }
write!(w, "</div></div></details>"); write!(w, "</div></details>");
} }
write!(w, "</div>"); write!(w, "</div>");

View file

@ -1991,20 +1991,15 @@ in storage.js
} }
.more-scraped-examples { .more-scraped-examples {
margin-left: 5px; margin-left: 25px;
display: flex; position: relative;
flex-direction: row;
}
.more-scraped-examples-inner {
/* 20px is width of toggle-line + toggle-line-inner */
width: calc(100% - 20px);
} }
.toggle-line { .toggle-line {
align-self: stretch; position: absolute;
margin-right: 10px; top: 5px;
margin-top: 5px; bottom: 0;
right: calc(100% + 10px);
padding: 0 4px; padding: 0 4px;
cursor: pointer; 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. // Check that examples with very long lines have the same width as ones that don't.
store-property: ( store-property: (
clientWidth, 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", ".more-scraped-examples .scraped-example:nth-child(2) .code-wrapper .src-line-numbers",
{"clientWidth": |clientWidth|} "clientWidth"
) )
assert-property: ( assert-property: (
@ -33,3 +28,8 @@ assert-property: (
".more-scraped-examples .scraped-example:nth-child(5) .code-wrapper .src-line-numbers", ".more-scraped-examples .scraped-example:nth-child(5) .code-wrapper .src-line-numbers",
{"clientWidth": |clientWidth|} {"clientWidth": |clientWidth|}
) )
assert-property: (
".more-scraped-examples .scraped-example:nth-child(6) .code-wrapper .src-line-numbers",
{"clientWidth": |clientWidth|}
)