Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rustdoc accessibility: use an icon for the [-]/[+] controls #87663

Merged
merged 4 commits into from
Aug 4, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 39 additions & 1 deletion src/librustdoc/html/render/write_shared.rs
Original file line number Diff line number Diff line change
Expand Up @@ -175,9 +175,45 @@ pub(super) fn write_shared(
cx.write_shared(SharedResource::InvocationSpecific { basename: p }, content, &options.emit)
};

fn add_background_image_to_css(
cx: &Context<'_>,
css: &mut String,
rule: &str,
file: &'static str,
) {
css.push_str(&format!(
"{} {{ background-image: url({}); }}",
rule,
SharedResource::ToolchainSpecific { basename: file }
.path(cx)
.file_name()
.unwrap()
.to_str()
.unwrap()
))
}

// Add all the static files. These may already exist, but we just
// overwrite them anyway to make sure that they're fresh and up-to-date.
let mut rustdoc_css = static_files::RUSTDOC_CSS.to_owned();
add_background_image_to_css(
cx,
&mut rustdoc_css,
"details.undocumented[open] > summary::before, \
details.rustdoc-toggle[open] > summary::before, \
details.rustdoc-toggle[open] > summary.hideme::before",
"toggle-minus.svg",
);
add_background_image_to_css(
cx,
&mut rustdoc_css,
"details.undocumented > summary::before, details.rustdoc-toggle > summary::before",
"toggle-plus.svg",
);
write_minify("rustdoc.css", &rustdoc_css)?;

// Add all the static files. These may already exist, but we just
// overwrite them anyway to make sure that they're fresh and up-to-date.
write_minify("rustdoc.css", static_files::RUSTDOC_CSS)?;
write_minify("settings.css", static_files::SETTINGS_CSS)?;
write_minify("noscript.css", static_files::NOSCRIPT_CSS)?;

Expand Down Expand Up @@ -217,6 +253,8 @@ pub(super) fn write_shared(
write_toolchain("wheel.svg", static_files::WHEEL_SVG)?;
write_toolchain("clipboard.svg", static_files::CLIPBOARD_SVG)?;
write_toolchain("down-arrow.svg", static_files::DOWN_ARROW_SVG)?;
write_toolchain("toggle-minus.svg", static_files::TOGGLE_MINUS_PNG)?;
write_toolchain("toggle-plus.svg", static_files::TOGGLE_PLUS_PNG)?;

let mut themes: Vec<&String> = themes.iter().collect();
themes.sort();
Expand Down
66 changes: 57 additions & 9 deletions src/librustdoc/html/static/css/rustdoc.css
Original file line number Diff line number Diff line change
Expand Up @@ -1508,11 +1508,35 @@ details.rustdoc-toggle > summary.hideme > span {
}

details.rustdoc-toggle > summary::before {
content: "[+]";
font-weight: 300;
font-size: 0.8em;
letter-spacing: 1px;
content: "";
cursor: pointer;
width: 17px;
height: max(17px, 1.1em);
background-repeat: no-repeat;
background-position: top left;
display: inline-block;
vertical-align: middle;
opacity: .5;
}

/* 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.top-doc > summary,
Expand Down Expand Up @@ -1560,20 +1584,44 @@ details.rustdoc-toggle[open] > summary.hideme > span {
display: none;
}

details.rustdoc-toggle[open] > summary::before {
content: "[−]";
display: inline;
details.rustdoc-toggle[open] > summary::before,
details.rustdoc-toggle[open] > summary.hideme::before {
width: 17px;
height: max(17px, 1.1em);
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";
}

details.undocumented > summary::before {
content: "[+] Show hidden undocumented items";
padding-left: 17px;
height: max(17px, 1.1em);
background-repeat: no-repeat;
background-position: top left;
content: "Show hidden undocumented items";
cursor: pointer;
font-size: 16px;
font-weight: 300;
opacity: .5;
}

details.undocumented > summary:focus::before,
details.undocumented > summary:hover::before {
opacity: 1;
}

details.undocumented[open] > summary::before {
content: "[−] Hide undocumented items";
padding-left: 17px;
height: max(17px, 1.1em);
background-repeat: no-repeat
background-position: top left;
content: "Hide undocumented items";
}

/* Media Queries */
Expand Down
5 changes: 5 additions & 0 deletions src/librustdoc/html/static/css/themes/ayu.css
Original file line number Diff line number Diff line change
Expand Up @@ -229,6 +229,11 @@ details.undocumented > summary::before {
color: #999;
}

details.rustdoc-toggle > summary::before,
details.undocumented > summary::before {
filter: invert(100%);
}

#crate-search {
color: #c5c5c5;
background-color: #141920;
Expand Down
5 changes: 5 additions & 0 deletions src/librustdoc/html/static/css/themes/dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -194,6 +194,11 @@ details.undocumented > summary::before {
color: #999;
}

details.rustdoc-toggle > summary::before,
details.undocumented > summary::before {
filter: invert(100%);
}

#crate-search {
color: #111;
background-color: #f0f0f0;
Expand Down
1 change: 1 addition & 0 deletions src/librustdoc/html/static/images/toggle-minus.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/librustdoc/html/static/images/toggle-plus.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 6 additions & 0 deletions src/librustdoc/html/static_files.rs
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,12 @@ crate static CLIPBOARD_SVG: &[u8] = include_bytes!("static/images/clipboard.svg"
/// The file contents of `down-arrow.svg`, the icon used for the crate choice combobox.
crate static DOWN_ARROW_SVG: &[u8] = include_bytes!("static/images/down-arrow.svg");

/// The file contents of `toggle-minus.svg`, the icon used for opened toggles.
crate static TOGGLE_MINUS_PNG: &[u8] = include_bytes!("static/images/toggle-minus.svg");

/// The file contents of `toggle-plus.svg`, the icon used for closed toggles.
crate static TOGGLE_PLUS_PNG: &[u8] = include_bytes!("static/images/toggle-plus.svg");

/// The contents of `COPYRIGHT.txt`, the license listing for files distributed with documentation
/// output.
crate static COPYRIGHT: &[u8] = include_bytes!("static/COPYRIGHT.txt");
Expand Down