mirror of https://github.com/gorhill/uBlock.git
Use placeholders to minimize vertical shifting at page load time
Related issue: - https://github.com/uBlockOrigin/uBlock-issues/issues/2361
This commit is contained in:
parent
e68537513f
commit
2cc6835de0
|
@ -17,24 +17,24 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<p data-i18n="docblockedPrompt1"></p>
|
<p data-i18n="docblockedPrompt1">_</p>
|
||||||
<div id="theURL" class="collapsed">
|
<div id="theURL" class="collapsed">
|
||||||
<p class="code"><span></span><span id="toggleParse" class="hidden"><span class="fa-icon">zoom-in</span><span class="fa-icon">zoom-out</span></span></p>
|
<p class="code"><span> </span><span id="toggleParse" class="hidden"><span class="fa-icon">zoom-in</span><span class="fa-icon">zoom-out</span></span></p>
|
||||||
<ul id="parsed"></ul>
|
<ul id="parsed"></ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<p data-i18n="docblockedPrompt2"></p>
|
<p data-i18n="docblockedPrompt2">_</p>
|
||||||
<p id="why" class="code"></p>
|
<p id="why" class="code"> </p>
|
||||||
<div id="whyex" style="display: none;">
|
<div id="whyex" style="visibility: hidden;">
|
||||||
<span data-i18n="docblockedFoundIn"></span>
|
<span data-i18n="docblockedFoundIn">_</span>
|
||||||
<ul></ul>
|
<ul><li class="filterList"> </ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="li">
|
<div class="li">
|
||||||
<label><span class="input checkbox"><input type="checkbox" id="disableWarning"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span><span data-i18n="docblockedDontWarn"></span></label>
|
<label><span class="input checkbox"><input type="checkbox" id="disableWarning"><svg viewBox="0 0 24 24"><path d="M1.73,12.91 8.1,19.28 22.79,4.59"/></svg></span><span data-i18n="docblockedDontWarn">_</span></label>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="actionContainer">
|
<div id="actionContainer">
|
||||||
|
|
|
@ -53,9 +53,13 @@ let details = {};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( Array.isArray(lists) === false || lists.length === 0 ) { return; }
|
if ( Array.isArray(lists) === false || lists.length === 0 ) {
|
||||||
|
qs$('#whyex').style.setProperty('visibility', 'collapse');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const parent = qs$('#whyex > ul');
|
const parent = qs$('#whyex > ul');
|
||||||
|
parent.firstElementChild.remove(); // remove placeholder element
|
||||||
for ( const list of lists ) {
|
for ( const list of lists ) {
|
||||||
const listElem = dom.clone('#templates .filterList');
|
const listElem = dom.clone('#templates .filterList');
|
||||||
const sourceElem = qs$(listElem, '.filterListSource');
|
const sourceElem = qs$(listElem, '.filterListSource');
|
||||||
|
@ -68,7 +72,7 @@ let details = {};
|
||||||
}
|
}
|
||||||
parent.appendChild(listElem);
|
parent.appendChild(listElem);
|
||||||
}
|
}
|
||||||
qs$('#whyex').style.removeProperty('display');
|
qs$('#whyex').style.removeProperty('visibility');
|
||||||
})();
|
})();
|
||||||
|
|
||||||
/******************************************************************************/
|
/******************************************************************************/
|
||||||
|
|
Loading…
Reference in New Issue