diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json index 2564b8fac..21a1638f4 100644 --- a/src/_locales/en/messages.json +++ b/src/_locales/en/messages.json @@ -1011,14 +1011,6 @@ "message":"Storage used: {{value}} {{unit}}", "description":" In Setting pane, renders as (example): Storage used: 13.2 MB" }, - "M":{ - "message":"M", - "description":"abbreviation for 'millions': metric system's 'mega'" - }, - "G":{ - "message":"G", - "description":"abbreviation for 'billions': metric system's 'giga'" - }, "KB":{ "message":"KB", "description":"short for 'kilobytes'" diff --git a/src/css/3p-filters.css b/src/css/3p-filters.css index e97d4f531..9ed894422 100644 --- a/src/css/3p-filters.css +++ b/src/css/3p-filters.css @@ -146,12 +146,12 @@ body.hideUnused #listsOfBlockedHostsPrompt::before, display: inline-flex; } .listEntry .obsolete { - color: var(--fg-icon-info-lvl-2-dimmed); - fill: var(--fg-icon-info-lvl-2-dimmed); + color: var(--info-lvl-2-ink); + fill: var(--info-lvl-2-ink); } .listEntry .obsolete:hover { - color: var(--fg-icon-info-lvl-2); - fill: var(--fg-icon-info-lvl-2); + color: var(--info-lvl-2-ink-hover); + fill: var(--info-lvl-2-ink-hover); } body:not(.updating) .listEntry.checked.obsolete .obsolete { display: inline-flex; diff --git a/src/css/popup-fenix.css b/src/css/popup-fenix.css index ce01217b2..4bb4dbe05 100644 --- a/src/css/popup-fenix.css +++ b/src/css/popup-fenix.css @@ -12,8 +12,13 @@ :root.mobile body { font-size: 14px; line-height: 20px; + transition-duration: 0.2s; + transition-property: opacity; width: 100%; } +:root body.loading { + opacity: 0; + } a { color: inherit; text-decoration: none; @@ -466,11 +471,6 @@ body.advancedUser #firewall > div > span.noopRule.ownRule, /* mouse-driven devices */ :root.desktop body { overflow: auto; - transition-duration: 0.2s; - transition-property: opacity; - } -:root.desktop body.loading { - opacity: 0; } :root.desktop #panes { flex-direction: row-reverse; diff --git a/src/css/themes/default.css b/src/css/themes/default.css index ff47f4f57..b0f632c1d 100644 --- a/src/css/themes/default.css +++ b/src/css/themes/default.css @@ -22,6 +22,8 @@ --light-gray-40: #cfcfd8; --violet-70: #592acb; --violet-80: #45278d; + --yellow-50: #ffa436; + --yellow-60: #e27f2e; --black: #000; --white: #fff; } @@ -84,8 +86,8 @@ --fg-icon-info-lvl-0: inherit; --fg-icon-info-lvl-1-dimmed: hsla(240, 100%, 40%, 0.5); --fg-icon-info-lvl-1: hsla(240, 100%, 40%, 1); - --fg-icon-info-lvl-2-dimmed: hsla(36, 100%, 40%, 0.5); - --fg-icon-info-lvl-2: hsla(36, 100%, 40%, 1); + --info-lvl-2-ink: var(--yellow-50); + --info-lvl-2-ink-hover: var(--yellow-60); --fg-icon-info-lvl-3-dimmed: hsla(16, 100%, 50%, 0.5); --fg-icon-info-lvl-3: hsla(16, 100%, 50%, 1); --fg-icon-info-lvl-4-dimmed: hsla(0, 100%, 35%, 0.5); diff --git a/src/js/popup-fenix.js b/src/js/popup-fenix.js index 95ee5cc55..5eb8da63a 100644 --- a/src/js/popup-fenix.js +++ b/src/js/popup-fenix.js @@ -154,20 +154,10 @@ const hashFromPopupData = function(reset) { const formatNumber = function(count) { if ( typeof count !== 'number' ) { return ''; } if ( count < 1e6 ) { return count.toLocaleString(); } - const mln = vAPI.i18n('M'); - if ( count < 1e7 && mln.length > 2 ) { // Maybe not worth abbreviating - return count.toLocaleString(); - } - let unit; - if ( count < 1e9 ) { - count /= 1e6; - unit = mln; - } else { - count /= 1e9; - unit = vAPI.i18n('G'); - } - return count.toLocaleString(undefined, { maximumSignificantDigits: 4 }) + - `\u2009${unit}`; + return count.toLocaleString(undefined, { + notation: 'compact', + maximumSignificantDigits: 4, + }); }; /******************************************************************************/