Add help button

This commit is contained in:
Guillaume Gomez 2020-08-10 16:42:11 +02:00
parent 8e738539be
commit a34bc7961a
6 changed files with 27 additions and 11 deletions

View File

@ -95,6 +95,7 @@ pub fn render<T: Print, S: Print>(
placeholder=\"Click or press S to search, ? for more options…\" \
type=\"search\">\
</div>\
<span class=\"help-button\">?</span>
<a id=\"settings-menu\" href=\"{root_path}settings.html\">\
<img src=\"{static_root_path}wheel{suffix}.svg\" \
width=\"18\" \

View File

@ -473,7 +473,9 @@ function defocusSearchBar() {
}());
document.addEventListener("click", function(ev) {
if (hasClass(ev.target, "collapse-toggle")) {
if (hasClass(ev.target, "help-button")) {
displayHelp(true, ev);
} else if (hasClass(ev.target, "collapse-toggle")) {
collapseDocs(ev.target, "toggle");
} else if (hasClass(ev.target.parentNode, "collapse-toggle")) {
collapseDocs(ev.target.parentNode, "toggle");

View File

@ -674,7 +674,7 @@ a {
}
.search-container > div {
display: inline-flex;
width: calc(100% - 34px);
width: calc(100% - 63px);
}
#crate-search {
margin-top: 5px;
@ -1250,14 +1250,24 @@ h4 > .important-traits {
outline: none;
}
#settings-menu {
#settings-menu, .help-button {
position: absolute;
right: 0;
top: 10px;
}
#settings-menu {
right: 0;
outline: none;
}
#theme-picker, #settings-menu {
.help-button {
right: 30px;
font-family: "Fira Sans",sans-serif;
text-align: center;
font-size: 17px;
}
#theme-picker, #settings-menu, .help-button {
padding: 4px;
width: 27px;
height: 29px;

View File

@ -489,7 +489,7 @@ kbd {
box-shadow-color: #c6cbd1;
}
#theme-picker, #settings-menu {
#theme-picker, #settings-menu, .help-button {
border-color: #5c6773;
background-color: #0f1419;
}
@ -499,7 +499,8 @@ kbd {
}
#theme-picker:hover, #theme-picker:focus,
#settings-menu:hover, #settings-menu:focus {
#settings-menu:hover, #settings-menu:focus,
.help-button:hover, .help-button:focus {
border-color: #e0e0e0;
}

View File

@ -383,13 +383,14 @@ kbd {
box-shadow-color: #c6cbd1;
}
#theme-picker, #settings-menu {
#theme-picker, #settings-menu, .help-button {
border-color: #e0e0e0;
background: #f0f0f0;
}
#theme-picker:hover, #theme-picker:focus,
#settings-menu:hover, #settings-menu:focus {
#settings-menu:hover, #settings-menu:focus,
.help-button:hover, .help-button:focus {
border-color: #ffb900;
}

View File

@ -377,13 +377,14 @@ kbd {
box-shadow-color: #c6cbd1;
}
#theme-picker, #settings-menu {
#theme-picker, #settings-menu, .help-button {
border-color: #e0e0e0;
background-color: #fff;
}
#theme-picker:hover, #theme-picker:focus,
#settings-menu:hover, #settings-menu:focus {
#settings-menu:hover, #settings-menu:focus,
.help-button:hover, .help-button:focus {
border-color: #717171;
}