remove the unused collapsible from options
This commit is contained in:
parent
60834f7bd6
commit
5253c863b9
15
options.html
15
options.html
|
@ -230,20 +230,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="block" id="advanced">
|
<div class="block" id="advanced">
|
||||||
<div class="collapsible-resizer">
|
<h1 i18n-text="optionsAdvanced"></h1>
|
||||||
<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>
|
|
||||||
<div class="items">
|
<div class="items">
|
||||||
<label class="chromium-only">
|
<label class="chromium-only">
|
||||||
<span i18n-text="optionsAdvancedStyleViaXhr">
|
<span i18n-text="optionsAdvancedStyleViaXhr">
|
||||||
|
|
|
@ -120,14 +120,6 @@ a:hover .svg-icon,
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsed, .collapsible h1 {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collapsed .items {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
min-width: 30%;
|
min-width: 30%;
|
||||||
width: 30%;
|
width: 30%;
|
||||||
|
@ -273,86 +265,10 @@ input[type="color"] {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#advanced.collapsible.collapsed {
|
|
||||||
height: 30px;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
html:not(.firefox):not(.opera) #updates {
|
html:not(.firefox):not(.opera) #updates {
|
||||||
margin-bottom: 0;
|
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 {
|
.svg-inline-wrapper .svg-icon {
|
||||||
width: 16px;
|
width: 16px;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
|
|
|
@ -11,10 +11,8 @@
|
||||||
setupLivePrefs
|
setupLivePrefs
|
||||||
*/// dom.js
|
*/// dom.js
|
||||||
/* global
|
/* global
|
||||||
CHROME
|
|
||||||
CHROME_POPUP_BORDER_BUG
|
CHROME_POPUP_BORDER_BUG
|
||||||
FIREFOX
|
FIREFOX
|
||||||
UA
|
|
||||||
URLS
|
URLS
|
||||||
capitalize
|
capitalize
|
||||||
clamp
|
clamp
|
||||||
|
@ -27,23 +25,7 @@ setupLivePrefs();
|
||||||
$$('input[min], input[max]').forEach(enforceInputRange);
|
$$('input[min], input[max]').forEach(enforceInputRange);
|
||||||
|
|
||||||
if (CHROME_POPUP_BORDER_BUG) {
|
if (CHROME_POPUP_BORDER_BUG) {
|
||||||
const borderOption = $('.chrome-no-popup-border');
|
$('.chrome-no-popup-border').classList.remove('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');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (FIREFOX && 'update' in (chrome.commands || {})) {
|
if (FIREFOX && 'update' in (chrome.commands || {})) {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user