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

Rearrange HTML & remove extra JS

Browse Source
This commit is contained in:
Rob Garrison 2018-10-13 17:47:27 -05:00
parent 3c1ee1cd9e
commit 5df1380426
3 changed files with 37 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
popup.html
View File

@ -217,26 +217,26 @@
</div>
<div id="popup-manage-wrapper" class="action-wrapper truegray-alpha-1">
<button id="popup-manage-button" class="classicUI-el" i18n-text="openManage" data-href="manage.html" i18n-title="popupManageTooltip"></button>
<a id="popup-manage-icon" href="#" class="iconUI-el" data-href="manage.html" i18n-title="popupManageTooltip" tabindex="0">
<svg class="svg-icon manager" viewBox="0 0 24 24" stroke="#666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<button id="popup-manage-button" data-href="manage.html" i18n-title="popupManageTooltip">
<span class="classicUI-el" i18n-text="openManage"></span>
<svg class="iconUI-el svg-icon manager" viewBox="0 0 24 24" stroke="#666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="4" y1="21" x2="4" y2="14"/><line x1="4" y1="10" x2="4" y2="3"/><line x1="12" y1="21" x2="12" y2="12"/><line x1="12" y1="8" x2="12" y2="3"/><line x1="20" y1="21" x2="20" y2="16"/><line x1="20" y1="12" x2="20" y2="3"/><line x1="1" y1="14" x2="7" y2="14"/><line x1="9" y1="8" x2="15" y2="8"/><line x1="17" y1="16" x2="23" y2="16"/>
</svg>
</a>
</button>
</div>
<div id="popup-options-wrapper" class="action-wrapper truegray-alpha-1">
<button id="popup-options-button" class="classicUI-el" i18n-text="openOptionsPopup"></button>
<a id="popup-options-icon" href="#" class="iconUI-el" i18n-title="openOptionsPopup" tabindex="0">
<svg class="svg-icon options" viewBox="0 0 16 16">
<button id="popup-options-button" i18n-title="openOptionsPopup">
<span class="classicUI-el" i18n-text="openOptionsPopup"></span>
<svg class="iconUI-el svg-icon options" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M8,0C7.6,0,7.3,0,6.9,0.1v2.2C6.1,2.5,5.4,2.8,4.8,3.2L3.2,1.6c-0.6,0.4-1.1,1-1.6,1.6l1.6,1.6C2.8,5.4,2.5,6.1,2.3,6.9H0.1C0,7.3,0,7.6,0,8c0,0.4,0,0.7,0.1,1.1h2.2c0.1,0.8,0.4,1.5,0.9,2.1l-1.6,1.6c0.4,0.6,1,1.1,1.6,1.6l1.6-1.6c0.6,0.4,1.4,0.7,2.1,0.9v2.2C7.3,16,7.6,16,8,16c0.4,0,0.7,0,1.1-0.1v-2.2c0.8-0.1,1.5-0.4,2.1-0.9l1.6,1.6c0.6-0.4,1.1-1,1.6-1.6l-1.6-1.6c0.4-0.6,0.7-1.4,0.9-2.1h2.2C16,8.7,16,8.4,16,8c0-0.4,0-0.7-0.1-1.1h-2.2c-0.1-0.8-0.4-1.5-0.9-2.1l1.6-1.6c-0.4-0.6-1-1.1-1.6-1.6l-1.6,1.6c-0.6-0.4-1.4-0.7-2.1-0.9V0.1C8.7,0,8.4,0,8,0z M8,4.3c2.1,0,3.7,1.7,3.7,3.7c0,0,0,0,0,0c0,2.1-1.7,3.7-3.7,3.7c0,0,0,0,0,0c-2.1,0-3.7-1.7-3.7-3.7c0,0,0,0,0,0C4.3,5.9,5.9,4.3,8,4.3C8,4.3,8,4.3,8,4.3z"/>
</svg>
</a>
</button>
</div>
<div id="find-styles-wrapper" class="action-wrapper truegray-alpha-1">
<div id="find-styles">
<a id="find-styles-link" class="classicUI-el" i18n-text="findStyles" i18n-title="findStylesForSite" tabindex="0"></a>
<a id="find-styles-icon" href="#" class="iconUI-el" i18n-title="findStylesForSite" tabindex="0">
<svg class="svg-icon search" viewBox="0 0 24 24">
<a id="find-styles-link" i18n-title="findStylesForSite" tabindex="0">
<span class="classicUI-el" i18n-text="findStyles"></span>
<svg class="iconUI-el svg-icon search" viewBox="0 0 24 24">
<path d="M18,13v7H4V6h5.02C9.07,5.29,9.24,4.62,9.5,4H2v18h18v-7L18,13z M16.5,18h-11l2.75-3.53l1.96,2.36l2.75-3.54L16.5,18z M19.3,8.89C19.74,8.19,20,7.38,20,6.5C20,4.01,17.99,2,15.5,2S11,4.01,11,6.5s2.01,4.5,4.49,4.5c0.88,0,1.7-0.26,2.39-0.7 L21,13.42L22.42,12L19.3,8.89z M15.5,9C14.12,9,13,7.88,13,6.5S14.12,4,15.5,4S18,5.12,18,6.5S16.88,9,15.5,9z"/>
</svg>
</a>
@ -265,15 +265,15 @@
</div>
</div>
<div id="popup-wiki-wrapper" class="action-wrapper truegray-alpha-1">
<button id="popup-wiki-button" class="classicUI-el" i18n-text="linkStylusWiki" i18n-title="linkGetHelp" data-href="https://github.com/openstyles/stylus/wiki"></button>
<a id="popup-wiki-icon" class="iconUI-el" href="#" i18n-title="linkGetHelp" data-href="https://github.com/openstyles/stylus/wiki" tabindex="0">
<svg class="svg-icon wiki" viewBox="0 0 24 24">
<button id="popup-wiki-button" i18n-title="linkGetHelp" data-href="https://github.com/openstyles/stylus/wiki">
<span class="classicUI-el" i18n-text="linkStylusWiki"></span>
<svg class="iconUI-el svg-icon wiki" viewBox="0 0 24 24">
<g fill-rule="evenodd" clip-rule="evenodd">
<path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16z"/>
<path d="M11.8 6.7a3.4 3.4 0 0 0-3.3 2.2l1.5.8s.3-.8.9-1.2c.5-.4 1.6-.6 2.2.1.7 1-.2 1.6-1.1 2.7-1 1.2-1 3.7-1 3.7h2s.1-2.3 1-3.4c.6-.7 1.5-1.3 1.5-2.5s-1.2-2.4-3.7-2.4zM11 16h2v2h-2z"/>
</g>
</svg>
</a>
</button>
</div>
<div id="disable-all-wrapper" class="action-wrapper truegray-alpha-1">
<div class="main-controls">

41
popup/popup.css
View File

@ -196,26 +196,20 @@ body:not(.disabled) .toggle-all-on {
opacity: 1 !important;
}
#popup-manage-icon,
#popup-options-icon,
#popup-wiki-icon,
#disable-all-icon,
#popup-confirm-icon {
.iconUI button {
cursor: pointer;
}
.iconUI button .svg-icon {
display: inline-flex;
height: 30px;
width: 30px;
height: 20px;
width: 20px;
align-items: center;
justify-content: center;
}
#popup-wiki-icon .svg-icon,
#find-styles-icon .svg-icon {
height: 20px;
width: 20px;
}
#find-inline-icon {
display: inline-flex;
.iconUI button:hover .svg-icon {
fill: var(--black);
}
#popup-confirm-icon {
@ -223,12 +217,6 @@ body:not(.disabled) .toggle-all-on {
margin: -5px 0;
}
#popup-options-icon .svg-icon,
#popup-confirm-icon .svg-icon {
height: 18px;
width: 18px;
}
#disable-all-icon .svg-icon {
height: 20px;
width: 20px;
@ -270,6 +258,8 @@ a[target="_blank"] .svg-icon.config {
#find-styles-link,
#write-style-for {
font-size: 0;
display: inline-flex;
align-items: center;
}
#write-style-wrapper {
@ -416,6 +406,15 @@ a:hover .svg-icon.toggled-off path:nth-child(3) {
padding: 0;
}
.iconUI button {
border: 0;
background: none;
}
.iconUI button:hover {
background: none;
}
body.disabled .style-name {
text-decoration: line-through;
}

22
popup/popup.js
View File

@ -93,14 +93,6 @@ function initPopup() {
document.body.classList.toggle('disabled', this.checked);
};
$('#disable-all-icon').onclick = () => {
$('#disableAll').click();
};
$('#find-styles-icon').onclick = () => {
$('#find-styles-link').click();
};
setupLivePrefs();
Object.assign($('#popup-manage-button'), {
@ -109,12 +101,6 @@ function initPopup() {
oncontextmenu: handleEvent.openManager,
});
Object.assign($('#popup-manage-icon'), {
onclick: handleEvent.openManager,
onmouseup: handleEvent.openManager,
oncontextmenu: handleEvent.openManager,
});
$('#find-external-icon').onclick = event => {
event.preventDefault();
$('input.toggle-inline').click()
@ -130,16 +116,8 @@ function initPopup() {
window.close();
};
$('#popup-options-icon').onclick = event => {
event.preventDefault();
chrome.runtime.openOptionsPage();
window.close();
};
$('#popup-wiki-button').onclick = handleEvent.openURLandHide;
$('#popup-wiki-icon').onclick = handleEvent.openURLandHide;
if (!tabURL) {
document.body.classList.add('blocked');
document.body.insertBefore(template.unavailableInfo, document.body.firstChild);