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

remove the unused collapsible from options

Browse Source
This commit is contained in:
tophf 2022-01-27 15:27:10 +03:00
parent 60834f7bd6
commit 5253c863b9
3 changed files with 2 additions and 117 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
options.html
View File

@ -230,20 +230,7 @@
</div>
<div class="block" id="advanced">
<div class="collapsible-resizer">
<h1 i18n-text="optionsAdvanced">
<a class="svg-inline-wrapper is-collapsed" tabindex="0">
<svg class="svg-icon" viewBox="0 0 1792 1792">
<path fill-rule="evenodd" d="M1408 704q0 26-19 45l-448 448q-19 19-45 19t-45-19l-448-448q-19-19-19-45t19-45 45-19h896q26 0 45 19t19 45z"/>
</svg>
</a>
<a class="svg-inline-wrapper is-expanded" tabindex="0">
<svg class="svg-icon" viewBox="0 0 1792 1792">
<path fill-rule="evenodd" d="M1408 1216q0 26-19 45t-45 19h-896q-26 0-45-19t-19-45 19-45l448-448q19-19 45-19t45 19l448 448q19 19 19 45z"/>
</svg>
</a>
</h1>
</div>
<h1 i18n-text="optionsAdvanced"></h1>
<div class="items">
<label class="chromium-only">
<span i18n-text="optionsAdvancedStyleViaXhr">

84
options/options.css
View File

@ -120,14 +120,6 @@ a:hover .svg-icon,
border-bottom: none;
}
.collapsed, .collapsible h1 {
cursor: pointer;
}
.collapsed .items {
display: none;
}
h1 {
min-width: 30%;
width: 30%;
@ -273,86 +265,10 @@ input[type="color"] {
display: none;
}
#advanced.collapsible.collapsed {
height: 30px;
padding: 0;
margin: 0;
justify-content: center;
}
html:not(.firefox):not(.opera) #updates {
margin-bottom: 0;
}
#advanced.collapsible:not(.collapsed) {
margin-bottom: 0;
}
#advanced.collapsible:not(.collapsed) .collapsible-resizer,
#advanced:not(.collapsible) .collapsible-resizer {
padding-right: 8px;
box-sizing: border-box;
min-width: 30%;
width: 30%;
}
#advanced.collapsible h1 {
width: unset;
padding: 0;
color: #333;
transition: color .5s;
display: inline-flex;
align-items: center;
}
#advanced:not(.collapsible) .collapsible-resizer h1 {
width: unset;
padding: 0;
display: inline-flex;
}
#advanced.collapsible:not(.collapsed) h1:hover {
color: #666;
}
#advanced.collapsible.collapsed h1 {
padding: 0;
color: #666;
}
#advanced.collapsible.collapsed:hover h1 {
color: #333;
}
.collapsible-resizer .svg-icon {
fill: #333;
transition: fill .5s;
height: 16px;
width: 16px;
}
#advanced.collapsible.collapsed .collapsible-resizer .svg-icon,
#advanced.collapsible:not(.collapsed) .collapsible-resizer h1:hover .svg-icon {
fill: #666;
}
#advanced.collapsible.collapsed:hover .collapsible-resizer .svg-icon {
fill: #333;
}
#advanced.collapsible h1 .svg-icon {
margin-left: 2px;
}
#advanced.collapsible.collapsed .is-expanded,
#advanced:not(.collapsible) .collapsible-resizer .svg-icon {
display: none;
}
#advanced.collapsible:not(.collapsed) .is-collapsed {
display: none;
}
.svg-inline-wrapper .svg-icon {
width: 16px;
height: 16px;

20
options/options.js
View File

@ -11,10 +11,8 @@
setupLivePrefs
*/// dom.js
/* global
CHROME
CHROME_POPUP_BORDER_BUG
FIREFOX
UA
URLS
capitalize
clamp
@ -27,23 +25,7 @@ setupLivePrefs();
$$('input[min], input[max]').forEach(enforceInputRange);
if (CHROME_POPUP_BORDER_BUG) {
const borderOption = $('.chrome-no-popup-border');
if (borderOption) {
borderOption.classList.remove('chrome-no-popup-border');
}
}
// collapse #advanced block in Chrome pre-66 (classic chrome://extensions UI)
if (!FIREFOX && !UA.opera && CHROME < 66) {
const block = $('#advanced');
$('h1', block).onclick = event => {
event.preventDefault();
block.classList.toggle('collapsed');
const isCollapsed = block.classList.contains('collapsed');
const visibleToggle = $(isCollapsed ? '.is-collapsed' : '.is-expanded', block);
visibleToggle.focus();
};
block.classList.add('collapsible', 'collapsed');
$('.chrome-no-popup-border').classList.remove('chrome-no-popup-border');
}
if (FIREFOX && 'update' in (chrome.commands || {})) {