Mirrors/rust-search-extension
2
0
Fork 0
mirror of https://github.com/huhu/rust-search-extension synced 2024-11-14 23:57:07 +00:00
Code Issues Projects Releases Packages Wiki Activity

Optimize add to extension UI

Browse source
This commit is contained in:
Folyd 2020-03-07 16:12:56 +08:00
parent 699fcdbf39
commit 9a8bd643bd
3 changed files with 19 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
extension/script/docs-rs.css
View file

@ -1,4 +1,3 @@
.feature-flags-content {
color: #333;
max-height: 600px;
@ -26,4 +25,14 @@
.add-to-extension:hover {
color: #121212;
background-color: #F9BB2D;
}
.add-to-extension-content {
max-width: 20rem;
padding: 1rem;
position: relative;
display: block;
white-space: normal;
font-size: 13px;
color: #555;
}

11
extension/script/docs-rs.js
View file

@ -69,7 +69,7 @@ function insertAddToExtensionElement(added) {
let platformElement = document.querySelector(`.landing-search-form-nav>ul>li:last-child`);
let li = document.createElement("li");
li.classList.add("pure-menu-item");
li.classList.add("pure-menu-item", "pure-menu-has-children", "pure-menu-allow-hover");
li.onclick = () => {
// Toggle search index added state
if (added) {
@ -81,14 +81,21 @@ function insertAddToExtensionElement(added) {
insertAddToExtensionElement(true);
}
};
let content = `<p>Add this crate to Rust Search Extension then you can search it in the address bar.</p>`;
let iconAttributes = `class="fa fa-fw fa-plus-circle" style="color:#121212"`;
if (added) {
content = `<p>You already added this crate. Click again to remove it.</p>`;
iconAttributes = `class="fa fa-fw fa-check-circle" style="color:green"`;
}
li.innerHTML = `<div class="add-to-extension"
title="Add this crate's doc to Rust Search Extension, then you can search in the address bar"
title="Add this crate to Rust Search Extension then you can search it in the address bar."
aria-label="Add to Rust Search Extension">
<i ${iconAttributes}></i><span class="title"> to Rust Search Extension</span>
</div>
<div class="pure-menu-children" role="menu">
<div class="add-to-extension-content" onclick="event.stopPropagation()">
${content}
</div>
</div>`;
platformElement.insertAdjacentElement("afterend", li);
}

1
tests/bootstrap.html
View file

@ -6,7 +6,6 @@
<title>Rust Search Extension Testing</title>
<script src="../extension/compat.js"></script>
<script src="../extension/deminifier.js"></script>
<script src="../extension/crate-search.js"></script>
<script src="../extension/omnibox.js"></script>
<script src="../extension/index/crates.js"></script>