Add visual hint when not all sublists are enabled

Related issue:
- https://github.com/uBlockOrigin/uBlock-issues/issues/2687
This commit is contained in:
Raymond Hill 2023-07-03 06:49:09 -04:00
parent f0a364c803
commit 622cda2cdf
No known key found for this signature in database
GPG Key ID: 25E1490B761470C2
2 changed files with 18 additions and 5 deletions

View File

@ -218,6 +218,11 @@ label:hover .checkbox:not([disabled]) {
.checkbox[disabled] ~ span { .checkbox[disabled] ~ span {
filter: var(--checkbox-disabled-filter); filter: var(--checkbox-disabled-filter);
} }
.checkbox.partial > input[type="checkbox"]:checked + svg {
background-color: var(--surface-1);
border-color: var(--checkbox-checked-ink);
stroke: var(--checkbox-checked-ink);
}
.radio { .radio {
--margin-end: calc(var(--font-size) * 0.75); --margin-end: calc(var(--font-size) * 0.75);

View File

@ -400,9 +400,10 @@ const toggleFilterList = (elem, on, ui = false) => {
const updateListNode = listNode => { const updateListNode = listNode => {
if ( listNode === null ) { return; } if ( listNode === null ) { return; }
if ( listNode.dataset.role !== 'node' ) { return; } if ( listNode.dataset.role !== 'node' ) { return; }
const listLeaves = qsa$(listNode, '.listEntry[data-role="leaf"].checked'); const checkedListLeaves = qsa$(listNode, '.listEntry[data-role="leaf"].checked');
const allListLeaves = qsa$(listNode, '.listEntry[data-role="leaf"]');
dom.text(qs$(listNode, '.nodestats'), dom.text(qs$(listNode, '.nodestats'),
renderNodeStats(listLeaves.length, qsa$(listNode, '.listEntry[data-role="leaf"]').length) renderNodeStats(checkedListLeaves.length, allListLeaves.length)
); );
dom.cl.toggle(listNode, 'searchMatch', dom.cl.toggle(listNode, 'searchMatch',
qs$(listNode, ':scope > .listEntries > .listEntry.searchMatch') !== null qs$(listNode, ':scope > .listEntries > .listEntry.searchMatch') !== null
@ -413,7 +414,7 @@ const updateListNode = listNode => {
let isCached = false; let isCached = false;
let isObsolete = false; let isObsolete = false;
let writeTime = 0; let writeTime = 0;
for ( const listLeaf of listLeaves ) { for ( const listLeaf of checkedListLeaves ) {
const listkey = listLeaf.dataset.key; const listkey = listLeaf.dataset.key;
const listDetails = listsetDetails.available[listkey]; const listDetails = listsetDetails.available[listkey];
usedFilterCount += listDetails.off ? 0 : listDetails.entryUsedCount || 0; usedFilterCount += listDetails.off ? 0 : listDetails.entryUsedCount || 0;
@ -423,8 +424,15 @@ const updateListNode = listNode => {
isObsolete = isObsolete || dom.cl.has(listLeaf, 'obsolete'); isObsolete = isObsolete || dom.cl.has(listLeaf, 'obsolete');
writeTime = Math.max(writeTime, assetCache.writeTime || 0); writeTime = Math.max(writeTime, assetCache.writeTime || 0);
} }
dom.cl.toggle(listNode, 'checked', listLeaves.length !== 0); dom.cl.toggle(listNode, 'checked', checkedListLeaves.length !== 0);
dom.prop(qs$(listNode, ':scope > .detailbar input'), 'checked', listLeaves.length !== 0); dom.cl.toggle(qs$(listNode, ':scope > .detailbar .checkbox'),
'partial',
checkedListLeaves.length !== allListLeaves.length
);
dom.prop(qs$(listNode, ':scope > .detailbar input'),
'checked',
checkedListLeaves.length !== 0
);
dom.text(qs$(listNode, '.leafstats'), dom.text(qs$(listNode, '.leafstats'),
renderLeafStats(usedFilterCount, totalFilterCount) renderLeafStats(usedFilterCount, totalFilterCount)
); );