Added (currently inoperative) help button to popup
This commit is contained in:
parent
d68675294c
commit
52d68df2d7
55
popup.css
55
popup.css
@ -103,35 +103,58 @@ button.main-button.whitelist.active::after {
|
|||||||
|
|
||||||
.aux-button-container {
|
.aux-button-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: column;
|
|
||||||
border-top: 1px solid #ddd;
|
border-top: 1px solid #ddd;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
|
padding: 0 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aux-button-container button {
|
||||||
|
font-size: 1.25rem;
|
||||||
|
padding: 0;
|
||||||
|
flex: 1 1 auto;
|
||||||
|
font-family: Font Awesome, Inconsolata, sans-serif;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
.aux-button-container button::before {
|
||||||
|
padding: 4px 0 0 0;
|
||||||
|
}
|
||||||
|
.aux-button-container button:hover::before {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.aux-button-container button::after {
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: #777;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
padding: 4px 0 0 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*==================*/
|
/*==================*/
|
||||||
/*= OPTIONS BUTTON =*/
|
/*= OPTIONS BUTTON =*/
|
||||||
/*==================*/
|
/*==================*/
|
||||||
|
|
||||||
button.options-button {
|
|
||||||
font-size: 1.125rem;
|
|
||||||
padding: 10px;
|
|
||||||
color: #777;
|
|
||||||
width: 100%;
|
|
||||||
flex: 1 1 auto;
|
|
||||||
font-family: Font Awesome, Inconsolata, sans-serif;
|
|
||||||
}
|
|
||||||
button.options-button:hover {
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
button.options-button::before {
|
button.options-button::before {
|
||||||
content: "\F1DE";
|
content: "\F1DE";
|
||||||
font-family: Font Awesome;
|
color: #777;
|
||||||
font-size: 0.875em;
|
|
||||||
margin: 0 6px 0 0;
|
|
||||||
}
|
}
|
||||||
button.options-button::after {
|
button.options-button::after {
|
||||||
content: "Options";
|
content: "Options";
|
||||||
margin: 0 3px 0 0;
|
}
|
||||||
|
|
||||||
|
/*===============*/
|
||||||
|
/*= HELP BUTTON =*/
|
||||||
|
/*===============*/
|
||||||
|
|
||||||
|
button.help-button::before {
|
||||||
|
content: "\F128";
|
||||||
|
font-weight: 900;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
button.help-button::after {
|
||||||
|
content: "Help";
|
||||||
}
|
}
|
||||||
|
|
||||||
/********/
|
/********/
|
||||||
|
|||||||
@ -17,6 +17,7 @@
|
|||||||
<button type='button' class='reload-button'></button>
|
<button type='button' class='reload-button'></button>
|
||||||
</div>
|
</div>
|
||||||
<div class='aux-button-container'>
|
<div class='aux-button-container'>
|
||||||
|
<button type='button' class='help-button'></button>
|
||||||
<button type='button' class='options-button'></button>
|
<button type='button' class='options-button'></button>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
5
popup.js
5
popup.js
@ -199,6 +199,11 @@ function initialize() {
|
|||||||
chrome.runtime.openOptionsPage(null);
|
chrome.runtime.openOptionsPage(null);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Listener for the Help button.
|
||||||
|
document.querySelector("button.help-button").addActivateEvent(() => {
|
||||||
|
// TODO: code!
|
||||||
|
});
|
||||||
|
|
||||||
// Listener for reload button (appears when sticky-killing is toggled OFF).
|
// Listener for reload button (appears when sticky-killing is toggled OFF).
|
||||||
document.querySelector("button.reload-button").addActivateEvent(() => {
|
document.querySelector("button.reload-button").addActivateEvent(() => {
|
||||||
chrome.tabs.update(null, { url: ASK.activeTabLocation });
|
chrome.tabs.update(null, { url: ASK.activeTabLocation });
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user