Use an SVG image for clipboard instead of unicode character

This commit is contained in:
Guillaume Gomez 2021-05-09 20:41:24 +02:00
parent 00f2bf40d6
commit 7450f70ae2
9 changed files with 49 additions and 11 deletions

View File

@ -34,6 +34,12 @@ crate struct Page<'a> {
crate static_extra_scripts: &'a [&'a str],
}
impl<'a> Page<'a> {
crate fn get_static_root_path(&self) -> &str {
self.static_root_path.unwrap_or(self.root_path)
}
}
crate fn render<T: Print, S: Print>(
layout: &Layout,
page: &Page<'_>,
@ -41,7 +47,7 @@ crate fn render<T: Print, S: Print>(
t: T,
style_files: &[StylePath],
) -> String {
let static_root_path = page.static_root_path.unwrap_or(page.root_path);
let static_root_path = page.get_static_root_path();
format!(
"<!DOCTYPE html>\
<html lang=\"en\">\

View File

@ -215,7 +215,7 @@ impl<'tcx> Context<'tcx> {
&self.shared.layout,
&page,
|buf: &mut _| print_sidebar(self, it, buf),
|buf: &mut _| print_item(self, it, buf),
|buf: &mut _| print_item(self, it, buf, &page),
&self.shared.style_files,
)
} else {

View File

@ -22,9 +22,10 @@ use crate::formats::{AssocItemRender, Impl, RenderMode};
use crate::html::escape::Escape;
use crate::html::format::{print_abi_with_space, print_where_clause, Buffer, PrintWithSpace};
use crate::html::highlight;
use crate::html::layout::Page;
use crate::html::markdown::MarkdownSummaryLine;
pub(super) fn print_item(cx: &Context<'_>, item: &clean::Item, buf: &mut Buffer) {
pub(super) fn print_item(cx: &Context<'_>, item: &clean::Item, buf: &mut Buffer, page: &Page<'_>) {
debug_assert!(!item.is_stripped());
// Write the breadcrumb trail header for the top
buf.write_str("<h1 class=\"fqn\"><span class=\"in-band\">");
@ -74,7 +75,16 @@ pub(super) fn print_item(cx: &Context<'_>, item: &clean::Item, buf: &mut Buffer)
}
}
write!(buf, "<a class=\"{}\" href=\"\">{}</a>", item.type_(), item.name.as_ref().unwrap());
write!(buf, "<button id=\"copy-path\" onclick=\"copy_path(this)\">⎘</button>");
write!(
buf,
"<button id=\"copy-path\" onclick=\"copy_path(this)\">\
<img src=\"{static_root_path}clipboard{suffix}.svg\" \
width=\"19\" height=\"18\" \
alt=\"Copy item import\">\
</button>",
static_root_path = page.get_static_root_path(),
suffix = page.resource_suffix,
);
buf.write_str("</span>"); // in-band
buf.write_str("<span class=\"out-of-band\">");

View File

@ -207,6 +207,7 @@ pub(super) fn write_shared(
}
write_toolchain("brush.svg", static_files::BRUSH_SVG)?;
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)?;
let mut themes: Vec<&String> = themes.iter().collect();

View File

@ -0,0 +1 @@
<svg width="24" height="25" viewBox="0 0 24 25" xmlns="http://www.w3.org/2000/svg" aria-label="Copy to clipboard"><path d="M18 20h2v3c0 1-1 2-2 2H2c-.998 0-2-1-2-2V5c0-.911.755-1.667 1.667-1.667h5A3.323 3.323 0 0110 0a3.323 3.323 0 013.333 3.333h5C19.245 3.333 20 4.09 20 5v8.333h-2V9H2v14h16v-3zM3 7h14c0-.911-.793-1.667-1.75-1.667H13.5c-.957 0-1.75-.755-1.75-1.666C11.75 2.755 10.957 2 10 2s-1.75.755-1.75 1.667c0 .911-.793 1.666-1.75 1.666H4.75C3.793 5.333 3 6.09 3 7z"/><path d="M4 19h6v2H4zM12 11H4v2h8zM4 17h4v-2H4zM15 15v-3l-4.5 4.5L15 21v-3l8.027-.032L23 15z"/></svg>

After

Width:  |  Height:  |  Size: 576 B

View File

@ -1252,15 +1252,31 @@ function hideThemeButtonState() {
document.execCommand('copy');
document.body.removeChild(el);
but.textContent = '✓';
// There is always one children, but multiple childNodes.
but.children[0].style.display = 'none';
var tmp;
if (but.childNodes.length < 2) {
tmp = document.createTextNode('✓');
but.appendChild(tmp);
} else {
onEachLazy(but.childNodes, function(e) {
if (e.nodeType === Node.TEXT_NODE) {
tmp = e;
return true;
}
});
tmp.textContent = '✓';
}
if (reset_button_timeout !== null) {
window.clearTimeout(reset_button_timeout);
}
function reset_button() {
but.textContent = '⎘';
tmp.textContent = '';
reset_button_timeout = null;
but.children[0].style.display = "";
}
reset_button_timeout = window.setTimeout(reset_button, 1000);

View File

@ -1321,11 +1321,12 @@ h4 > .notable-traits {
}
#copy-path {
height: 30px;
font-size: 18px;
margin-left: 10px;
padding: 0 6px;
width: 28px;
padding: 0;
padding-left: 2px;
}
#copy-path> img {
margin-bottom: 2px;
}
#theme-choices {

View File

@ -509,7 +509,7 @@ kbd {
color: #fff;
}
#theme-picker > img, #settings-menu > img {
#theme-picker > img, #settings-menu > img, #copy-path > img {
filter: invert(100);
}

View File

@ -41,6 +41,9 @@ crate static BRUSH_SVG: &[u8] = include_bytes!("static/brush.svg");
/// The file contents of `wheel.svg`, the icon used for the settings button.
crate static WHEEL_SVG: &[u8] = include_bytes!("static/wheel.svg");
/// The file contents of `clipboard.svg`, the icon used for the "copy path" button.
crate static CLIPBOARD_SVG: &[u8] = include_bytes!("static/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/down-arrow.svg");