open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

manage: make #find-editor-styles a link; remove global options

Browse Source 
* "Find styles" is a link so we make it one, just like in the popup.
* We have a dedicated global options UI so it makes no sense to subset only two of them on the manage page, moreover both options are unrelated to managing styles.
This commit is contained in:
tophf 2017-04-01 01:49:51 +03:00
parent c32e968f63
commit 3c5cc141c4
3 changed files with 20 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
manage.css
View File

@ -142,26 +142,22 @@ summary {
} }
/* Default, no update buttons */ /* Default, no update buttons */
.update, .update,
.check-update { .check-update {
display: none; display: none;
} }
/* Check update button for things that can*/ /* Check update button for things that can*/
*[style-update-url] .check-update { *[style-update-url] .check-update {
display: inline; display: inline;
} }
/* Update check in progress */ /* Update check in progress */
.checking-update .check-update { .checking-update .check-update {
display: none; display: none;
} }
/* Updates available */ /* Updates available */
.can-update .update { .can-update .update {
display: inline; display: inline;
} }
@ -171,13 +167,11 @@ summary {
} }
/* Updates not available */ /* Updates not available */
.no-update .check-update { .no-update .check-update {
display: none; display: none;
} }
/* Updates done */ /* Updates done */
.update-done .check-update { .update-done .check-update {
display: none; display: none;
} }
@ -187,6 +181,11 @@ summary {
animation: highlight 10s cubic-bezier(0,.82,.47,.98); animation: highlight 10s cubic-bezier(0,.82,.47,.98);
} }
#find-editor-styles {
display: block;
margin-top: .5em;
}
@keyframes highlight { @keyframes highlight {
from { from {
background-color: rgba(128, 128, 128, .5); background-color: rgba(128, 128, 128, .5);
@ -318,6 +317,10 @@ fieldset {
display: inline-block; display: inline-block;
} }
#find-editor-styles {
display: inline-block;
}
#backup { #backup {
margin-right: 1em; margin-right: 1em;
} }

20
manage.html
View File

@ -87,22 +87,10 @@
</p> </p>
<div id="options"> <div id="options">
<h2 id="options-heading" i18n-text="optionsHeading"></h2> <h2 id="options-heading" i18n-text="optionsHeading"></h2>
<div> <button id="manage-options-button" i18n-text="openOptionsManage"></button>
<input id="show-badge" type="checkbox"> <button id="manage-shortcuts-button" i18n-text="openOptionsShortcuts"></button>
<label id="show-badge-label" for="show-badge" i18n-text="prefShowBadge"></label> <a id="find-editor-styles" i18n-text="editorStylesButton"
</div> href="https://userstyles.org/styles/browse/chrome-extension" target="_blank"></a>
<div>
<input id="popup.stylesFirst" type="checkbox">
<label id="stylesFirst-label" for="popup.stylesFirst" i18n-text="popupStylesFirst"></label>
</div>
<div id="more-options">
<h3 id="options-subheading" i18n-text="optionsSubheading"></h3>
<button id="manage-options-button" i18n-text="openOptionsManage"></button>
<button id="manage-shortcuts-button" i18n-text="openOptionsShortcuts"></button>
<p>
<button id="editor-styles-button" i18n-text="editorStylesButton"></button>
</p>
</div>
</div> </div>
<div id="backup"> <div id="backup">
<h2 id="backup-title" i18n-text="backupButtons"></h2> <h2 id="backup-title" i18n-text="backupButtons"></h2>

12
manage.js
View File

@ -31,9 +31,7 @@ function initGlobalEvents() {
$('#search').oninput = searchStyles; $('#search').oninput = searchStyles;
$('#manage-options-button').onclick = () => chrome.runtime.openOptionsPage(); $('#manage-options-button').onclick = () => chrome.runtime.openOptionsPage();
$('#manage-shortcuts-button').onclick = configureCommands.open; $('#manage-shortcuts-button').onclick = configureCommands.open;
$('#editor-styles-button').onclick = () => openURL({ $('#find-editor-styles').onclick = EntryOnClick.external;
url: 'https://userstyles.org/styles/browse/chrome-extension',
});
// focus search field on / key // focus search field on / key
document.onkeypress = event => { document.onkeypress = event => {
@ -55,8 +53,6 @@ function initGlobalEvents() {
setupLivePrefs([ setupLivePrefs([
'manage.onlyEnabled', 'manage.onlyEnabled',
'manage.onlyEdited', 'manage.onlyEdited',
'show-badge',
'popup.stylesFirst'
]); ]);
[ [
@ -127,6 +123,7 @@ function createStyleElement({style, name}) {
if (style.url) { if (style.url) {
const homepage = template.styleHomepage.cloneNode(true); const homepage = template.styleHomepage.cloneNode(true);
homepage.href = style.url; homepage.href = style.url;
homepage.onclick = EntryOnClick.external;
styleName.appendChild(document.createTextNode(' ')); styleName.appendChild(document.createTextNode(' '));
styleName.appendChild(homepage); styleName.appendChild(homepage);
} }
@ -249,6 +246,11 @@ class EntryOnClick {
} }
}); });
} }
static external(event) {
openURL({url: event.target.closest('a').href});
event.preventDefault();
}
} }