diff --git a/src/css/logger-ui.css b/src/css/logger-ui.css index b87c8dd87..e9e86f790 100644 --- a/src/css/logger-ui.css +++ b/src/css/logger-ui.css @@ -72,7 +72,7 @@ body[dir="ltr"] #info { body[dir="rtl"] #info { left: 0; } -@media (max-width: 600px) { +@media (max-width: 540px) { #info { display: none; } @@ -256,22 +256,26 @@ body[dir="rtl"] #netInspector #settings { height: 100%; white-space: nowrap; } -#vwRenderer .logEntry > div.blocked { +#vwRenderer .logEntry > div[data-status="1"], +#netFilteringDialog > .panes > .details > div[data-status="1"] { background-color: rgba(192, 0, 0, 0.1); } -body.colorBlind #vwRenderer .logEntry > div.blocked { +body.colorBlind #vwRenderer .logEntry > div[data-status="1"], +body.colorBlind #netFilteringDialog > .panes > .details > div[data-status="1"] { background-color: rgba(0, 19, 110, 0.1); } -#vwRenderer .logEntry > div.nooped { +#vwRenderer .logEntry > div[data-status="3"] { background-color: rgba(108, 108, 108, 0.1); } -body.colorBlind #vwRenderer .logEntry > div.nooped { +body.colorBlind #vwRenderer .logEntry > div[data-status="3"] { background-color: rgba(96, 96, 96, 0.1); } -#vwRenderer .logEntry > div.allowed { +#vwRenderer .logEntry > div[data-status="2"], +#netFilteringDialog > .panes > .details > div[data-status="2"] { background-color: rgba(0, 160, 0, 0.1); } -body.colorBlind #vwRenderer .logEntry > div.allowed { +body.colorBlind #vwRenderer .logEntry > div[data-status="2"], +body.colorBlind #netFilteringDialog > .panes > .details > div[data-status="2"] { background-color: rgba(255, 194, 57, 0.1) } #vwRenderer .logEntry > div.cosmetic, @@ -397,22 +401,26 @@ body[dir="rtl"] #vwRenderer .logEntry > div > span:first-child { #vwRenderer .logEntry > div > span:nth-of-type(7) b { font-weight: normal; } -#vwRenderer .logEntry > div.blocked > span:nth-of-type(7) b { +#vwRenderer .logEntry > div[data-status="1"] > span:nth-of-type(7) b, +#netFilteringDialog > .panes > .details > div[data-status="1"] b { background-color: rgba(192, 0, 0, 0.2); } -body.colorBlind #vwRenderer .logEntry > div.blocked > span:nth-of-type(7) b { +body.colorBlind #vwRenderer .logEntry > div[data-status="1"] > span:nth-of-type(7) b, +body.colorBlind #netFilteringDialog > .panes > .details > div[data-status="1"] b { background-color: rgba(0, 19, 110, 0.2); } -#vwRenderer .logEntry > div.nooped > span:nth-of-type(7) b { +#vwRenderer .logEntry > div[data-status="3"] > span:nth-of-type(7) b { background-color: rgba(108, 108, 108, 0.2); } -body.colorBlind #vwRenderer .logEntry > div.nooped > span:nth-of-type(7) b { +body.colorBlind #vwRenderer .logEntry > div[data-status="3"] > span:nth-of-type(7) b { background-color: rgba(96, 96, 96, 0.2); } -#vwRenderer .logEntry > div.allowed > span:nth-of-type(7) b { +#vwRenderer .logEntry > div[data-status="2"] > span:nth-of-type(7) b, +#netFilteringDialog > .panes > .details > div[data-status="2"] b { background-color: rgba(0, 160, 0, 0.2); } -body.colorBlind #vwRenderer .logEntry > div.allowed > span:nth-of-type(7) b { +body.colorBlind #vwRenderer .logEntry > div[data-status="2"] > span:nth-of-type(7) b, +body.colorBlind #netFilteringDialog > .panes > .details > div[data-status="2"] b { background-color: rgba(255, 194, 57, 0.2); } #vwRenderer #vwBottom { diff --git a/src/js/logger-ui.js b/src/js/logger-ui.js index 102d3ad9d..3dbbc5e2f 100644 --- a/src/js/logger-ui.js +++ b/src/js/logger-ui.js @@ -624,11 +624,11 @@ const viewPort = (function() { // Event if ( cells[2] === '--' ) { - divcl.add('blocked'); + div.setAttribute('data-status', '1'); } else if ( cells[2] === '++' ) { - divcl.add('allowed'); + div.setAttribute('data-status', '2'); } else if ( cells[2] === '**' ) { - span.add('nooped'); + div.setAttribute('data-status', '3'); } else if ( cells[2] === '<<' ) { divcl.add('redirect'); } @@ -1336,7 +1336,7 @@ const netFilteringManager = (function() { const cantPreview = type !== 'image' || targetRow.classList.contains('networkRealm') === false || - targetRow.classList.contains('blocked'); + targetRow.getAttribute('data-status') === '1'; // Whether picker can be used dialog.querySelector('.picker').classList.toggle( @@ -1533,6 +1533,10 @@ const netFilteringManager = (function() { // URL text = trch[6].textContent; if ( text !== '' ) { + const attr = tr.getAttribute('data-status') || ''; + if ( attr !== '' ) { + rows[7].setAttribute('data-status', attr); + } rows[7].children[1].appendChild(trch[6].cloneNode(true)); } else { rows[7].style.display = 'none'; diff --git a/src/logger-ui.html b/src/logger-ui.html index bdb4b64df..c0df2cfed 100644 --- a/src/logger-ui.html +++ b/src/logger-ui.html @@ -2,8 +2,7 @@ - +