Rollup merge of #97249 - GuillaumeGomez:details-summary-fixes, r=notriddle
`<details>`/`<summary>` UI fixes With images it's easier to understand: ![Screenshot from 2022-05-21 14-10-42](https://user-images.githubusercontent.com/3050060/169653038-9c58de67-589a-4986-a8ff-dbdddaf136a4.png) ![Screenshot from 2022-05-21 14-08-49](https://user-images.githubusercontent.com/3050060/169653042-56e87258-13fe-4f80-9858-4e15c318c3fb.png) The headings in `<summary>` should not have bottom border so I removed it as well alongside the other fixes. r? `@jsha`
This commit is contained in:
commit
194764fdc0
@ -158,8 +158,8 @@ h1.fqn {
|
||||
Underlines elsewhere in the documentation break up visual flow and tend to invert
|
||||
section hierarchies. */
|
||||
h2,
|
||||
.top-doc h3,
|
||||
.top-doc h4 {
|
||||
.top-doc .docblock > h3,
|
||||
.top-doc .docblock > h4 {
|
||||
border-bottom: 1px solid;
|
||||
}
|
||||
h3.code-header {
|
||||
@ -1681,6 +1681,11 @@ 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;
|
||||
}
|
||||
|
||||
/* Media Queries */
|
||||
|
||||
@media (min-width: 701px) {
|
||||
|
23
src/test/rustdoc-gui/docblock-details.goml
Normal file
23
src/test/rustdoc-gui/docblock-details.goml
Normal file
@ -0,0 +1,23 @@
|
||||
// This ensures that the `<details>`/`<summary>` elements are displayed as expected.
|
||||
goto: file://|DOC_PATH|/test_docs/details/struct.Details.html
|
||||
show-text: true
|
||||
local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"}
|
||||
reload:
|
||||
|
||||
// We first check that the headers in the `.top-doc` doc block still have their
|
||||
// bottom border.
|
||||
assert-text: (".top-doc .docblock > h3", "Hello")
|
||||
assert-css: (
|
||||
".top-doc .docblock > h3",
|
||||
{"border-bottom": "1px solid rgb(221, 221, 221)"},
|
||||
)
|
||||
// We now check that the `<summary>` doesn't have a bottom border and has the correct display.
|
||||
assert-css: (
|
||||
".top-doc .docblock summary h4",
|
||||
{"border-bottom": "0px none rgb(221, 221, 221)"},
|
||||
)
|
||||
// This allows to ensure that summary is on one line only!
|
||||
assert-property: (".top-doc .docblock summary h4", {"offsetHeight": "33"})
|
||||
assert-css: (".top-doc .docblock summary h4", {"margin-top": "15px", "margin-bottom": "5px"})
|
||||
// So `33 + 15 + 5` == `53`
|
||||
assert-property: (".top-doc .docblock summary", {"offsetHeight": "53"})
|
@ -277,3 +277,15 @@ pub use macros::*;
|
||||
|
||||
#[doc(alias = "AliasForTheStdReexport")]
|
||||
pub use ::std as TheStdReexport;
|
||||
|
||||
pub mod details {
|
||||
/// We check the appearance of the `<details>`/`<summary>` in here.
|
||||
///
|
||||
/// ## Hello
|
||||
///
|
||||
/// <details>
|
||||
/// <summary><h4>I'm a summary</h4></summary>
|
||||
/// <div>I'm the content of the details!</div>
|
||||
/// </details>
|
||||
pub struct Details;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user