mirror of
https://github.com/gorhill/uBlock.git
synced 2024-09-15 07:22:28 +02:00
New way to convey IDN and CNAME info in popup panel
Hostnames which have unpunycoded IDN or canonical name information will have this information reported as an extra line under the hostname name in the popup panel, rather than as a tooltip. For the fenix UI flavor, the save/revert tools are now shown regardless of whether the overview area is visible or not.
This commit is contained in:
Raymond Hill
parent
1a133d0a1f
commit
8adad98a0d
@ -94,7 +94,7 @@ body.off #switch .fa-icon {
|
||||
visibility: hidden;
|
||||
}
|
||||
.rulesetTools [id]:not(:first-of-type) {
|
||||
margin-top: 0.25em;
|
||||
margin-top: 0.2em;
|
||||
}
|
||||
.rulesetTools [id]:hover {
|
||||
fill: black;
|
||||
@ -259,13 +259,16 @@ body[dir="rtl"] #tooltip {
|
||||
color: #000;
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
line-height: 2;
|
||||
padding: 0.33em 0;
|
||||
position: relative;
|
||||
}
|
||||
#firewallContainer > div:first-of-type > span:first-of-type {
|
||||
cursor: pointer;
|
||||
flex-direction: unset;
|
||||
}
|
||||
#firewallContainer > div > span:first-of-type {
|
||||
align-items: flex-end;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
padding-right: 2px;
|
||||
width: calc(100% - 4em);
|
||||
@ -273,18 +276,14 @@ body[dir="rtl"] #tooltip {
|
||||
#firewallContainer > div.isCname > span:first-of-type {
|
||||
color: mediumblue;
|
||||
}
|
||||
#firewallContainer > div > span:first-of-type > sup {
|
||||
color: #666;
|
||||
display: none;
|
||||
font-size: 80%;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
}
|
||||
#firewallContainer > div.isDomain > span.isIDN:first-of-type > sup {
|
||||
#firewallContainer > div > span:first-of-type > sub {
|
||||
display: inline-block;
|
||||
font-size: 85%;
|
||||
font-weight: normal;
|
||||
padding: 0.25em 0 0 0;
|
||||
}
|
||||
#firewallContainer > div.isDomain > span.isIDN:first-of-type > sup::before {
|
||||
content: '\0416\2002';
|
||||
#firewallContainer > div > span:first-of-type > sub:empty {
|
||||
display: none;
|
||||
}
|
||||
#firewallContainer > div > span:first-of-type ~ span {
|
||||
margin-left: 1px;
|
||||
@ -380,6 +379,7 @@ body.advancedUser #firewallContainer > div > span:first-of-type ~ span {
|
||||
left: 0;
|
||||
opacity: 0.4;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 7px;
|
||||
}
|
||||
#firewallContainer > div.isRootContext > span:first-of-type::before {
|
||||
|
||||
@ -270,13 +270,16 @@ body[dir="rtl"] #tooltip {
|
||||
color: #000;
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
line-height: 2;
|
||||
padding: 0.33em 0;
|
||||
position: relative;
|
||||
}
|
||||
#firewallContainer > div:first-of-type > span:first-of-type {
|
||||
cursor: pointer;
|
||||
flex-direction: unset;
|
||||
}
|
||||
#firewallContainer > div > span:first-of-type {
|
||||
align-items: flex-end;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
padding-right: 2px;
|
||||
width: calc(100% - 4em);
|
||||
@ -284,18 +287,14 @@ body[dir="rtl"] #tooltip {
|
||||
#firewallContainer > div.isCname > span:first-of-type {
|
||||
color: mediumblue;
|
||||
}
|
||||
#firewallContainer > div > span:first-of-type > sup {
|
||||
color: #666;
|
||||
display: none;
|
||||
font-size: 80%;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
}
|
||||
#firewallContainer > div.isDomain > span.isIDN:first-of-type > sup {
|
||||
#firewallContainer > div > span:first-of-type > sub {
|
||||
display: inline-block;
|
||||
font-size: 85%;
|
||||
font-weight: normal;
|
||||
padding: 0.25em 0 0 0;
|
||||
}
|
||||
#firewallContainer > div.isDomain > span.isIDN:first-of-type > sup::before {
|
||||
content: '\0416\2002';
|
||||
#firewallContainer > div > span:first-of-type > sub:empty {
|
||||
display: none;
|
||||
}
|
||||
#firewallContainer > div > span:first-of-type ~ span {
|
||||
margin-left: 1px;
|
||||
@ -391,6 +390,7 @@ body.advancedUser #firewallContainer > div > span:first-of-type ~ span {
|
||||
left: 0;
|
||||
opacity: 0.4;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 7px;
|
||||
}
|
||||
#firewallContainer > div.isRootContext > span:first-of-type::before {
|
||||
|
||||
@ -287,16 +287,22 @@ const buildAllFirewallRows = function() {
|
||||
const isPunycoded = prettyDomainName !== des;
|
||||
|
||||
const span = row.querySelector('span:first-of-type');
|
||||
span.classList.toggle(
|
||||
'isIDN',
|
||||
isPunycoded &&
|
||||
reCyrillicAmbiguous.test(prettyDomainName) === true &&
|
||||
reCyrillicNonAmbiguous.test(prettyDomainName) === false
|
||||
);
|
||||
span.querySelector('span').textContent = prettyDomainName;
|
||||
span.title = isDomain && isPunycoded ? des : '';
|
||||
|
||||
const classList = row.classList;
|
||||
|
||||
let desExtra = '';
|
||||
if ( classList.toggle('isCname', popupData.cnameMap.has(des)) ) {
|
||||
desExtra = punycode.toUnicode(popupData.cnameMap.get(des));
|
||||
} else if (
|
||||
isDomain && isPunycoded &&
|
||||
reCyrillicAmbiguous.test(prettyDomainName) &&
|
||||
reCyrillicNonAmbiguous.test(prettyDomainName) === false
|
||||
) {
|
||||
desExtra = des;
|
||||
}
|
||||
span.querySelector('sub').textContent = desExtra;
|
||||
|
||||
classList.toggle('isRootContext', des === popupData.pageHostname);
|
||||
classList.toggle('isDomain', isDomain);
|
||||
classList.toggle('isSubDomain', !isDomain);
|
||||
@ -306,10 +312,6 @@ const buildAllFirewallRows = function() {
|
||||
classList.toggle('totalBlocked', hnDetails.totalBlockCount !== 0);
|
||||
classList.toggle('expandException', expandExceptions.has(hnDetails.domain));
|
||||
|
||||
if ( classList.toggle('isCname', popupData.cnameMap.has(des)) ) {
|
||||
span.title = punycode.toUnicode(popupData.cnameMap.get(des));
|
||||
}
|
||||
|
||||
row = row.nextElementSibling;
|
||||
}
|
||||
|
||||
@ -975,7 +977,7 @@ const toggleHostnameSwitch = async function(ev) {
|
||||
hostname: popupData.pageHostname,
|
||||
state: target.classList.contains('on'),
|
||||
tabId: popupData.tabId,
|
||||
persist: popupData.dfEnabled === false || ev.ctrlKey || ev.metaKey,
|
||||
persist: ev.ctrlKey || ev.metaKey,
|
||||
});
|
||||
|
||||
cachePopupData(response);
|
||||
|
||||
@ -322,16 +322,22 @@ const buildAllFirewallRows = function() {
|
||||
const isPunycoded = prettyDomainName !== des;
|
||||
|
||||
const span = row.querySelector('span:first-of-type');
|
||||
span.classList.toggle(
|
||||
'isIDN',
|
||||
isPunycoded &&
|
||||
reCyrillicAmbiguous.test(prettyDomainName) === true &&
|
||||
reCyrillicNonAmbiguous.test(prettyDomainName) === false
|
||||
);
|
||||
span.querySelector('span').textContent = prettyDomainName;
|
||||
span.title = isDomain && isPunycoded ? des : '';
|
||||
|
||||
const classList = row.classList;
|
||||
|
||||
let desExtra = '';
|
||||
if ( classList.toggle('isCname', popupData.cnameMap.has(des)) ) {
|
||||
desExtra = punycode.toUnicode(popupData.cnameMap.get(des));
|
||||
} else if (
|
||||
isDomain && isPunycoded &&
|
||||
reCyrillicAmbiguous.test(prettyDomainName) === true &&
|
||||
reCyrillicNonAmbiguous.test(prettyDomainName) === false
|
||||
) {
|
||||
desExtra = des;
|
||||
}
|
||||
span.querySelector('sub').textContent = desExtra;
|
||||
|
||||
classList.toggle('isRootContext', des === popupData.pageHostname);
|
||||
classList.toggle('isDomain', isDomain);
|
||||
classList.toggle('isSubDomain', !isDomain);
|
||||
@ -341,10 +347,6 @@ const buildAllFirewallRows = function() {
|
||||
classList.toggle('totalBlocked', hnDetails.totalBlockCount !== 0);
|
||||
classList.toggle('expandException', expandExceptions.has(hnDetails.domain));
|
||||
|
||||
if ( classList.toggle('isCname', popupData.cnameMap.has(des)) ) {
|
||||
span.title = punycode.toUnicode(popupData.cnameMap.get(des));
|
||||
}
|
||||
|
||||
row = row.nextElementSibling;
|
||||
}
|
||||
|
||||
|
||||
@ -64,7 +64,7 @@
|
||||
</div>
|
||||
|
||||
<div id="templates" style="display: none">
|
||||
<div data-des="" data-type="*"><span><sup></sup><span></span></span><span data-src="/"></span><span data-src="."></span><span data-src="."></span></div>
|
||||
<div data-des="" data-type="*"><span><span></span><sub></sub></span><span data-src="/"></span><span data-src="."></span><span data-src="."></span></div>
|
||||
<div id="actionSelector"><span id="dynaAllow"></span><span id="dynaNoop"></span><span id="dynaBlock"></span></div>
|
||||
<div id="hotspotTip"></div>
|
||||
<div id="tooltip"></div>
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
</div>
|
||||
|
||||
<div id="templates" style="display: none">
|
||||
<div data-des="" data-type="*"><span><sup></sup><span></span></span><span data-src="/"></span><span data-src="."></span><span data-src="."></span></div>
|
||||
<div data-des="" data-type="*"><span><span></span><sub></sub></span><span data-src="/"></span><span data-src="."></span><span data-src="."></span></div>
|
||||
<div id="actionSelector"><span id="dynaAllow"></span><span id="dynaNoop"></span><span id="dynaBlock"></span></div>
|
||||
<div id="hotspotTip"></div>
|
||||
<div id="tooltip"></div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user