diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 6cf4498f..550ac37e 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1301,6 +1301,12 @@ "message": "Style was not applied due to its incorrect usage of 'regexp()'", "description": "Tooltip in the popup for styles that were not applied at all" }, + "styleNotAppliedSchemeDark": { + "message": "This style is only applied in Dark Mode" + }, + "styleNotAppliedSchemeLight": { + "message": "This style is only applied in Light Mode" + }, "styleRegexpInvalidExplanation": { "message": "Some 'regexp()' rules that could not be compiled at all." }, diff --git a/background/style-manager.js b/background/style-manager.js index 6b53d883..6e836036 100644 --- a/background/style-manager.js +++ b/background/style-manager.js @@ -390,6 +390,7 @@ const styleManager = (() => { let excluded = false; let sloppy = false; let sectionMatched = false; + let excludedScheme = false; const match = urlMatchStyle(query, data); // TODO: enable this when the function starts returning false // if (match === false) { @@ -398,6 +399,9 @@ const styleManager = (() => { if (match === 'excluded') { excluded = true; } + if (match === 'excludedScheme') { + excludedScheme = true; + } for (const section of data.sections) { if (styleCodeEmpty(section.code)) { continue; @@ -415,7 +419,8 @@ const styleManager = (() => { result.push({ data: getStyleWithNoCode(data), excluded, - sloppy + sloppy, + excludedScheme }); } } diff --git a/popup/popup.js b/popup/popup.js index 0704e827..8655145e 100644 --- a/popup/popup.js +++ b/popup/popup.js @@ -329,13 +329,14 @@ function createStyleElement(style) { const styleName = $('.style-name', entry); styleName.lastChild.textContent = style.name; setTimeout(() => { - styleName.title = entry.styleMeta.sloppy ? - t('styleNotAppliedRegexpProblemTooltip') : - styleName.scrollWidth > styleName.clientWidth + 1 ? - styleName.textContent : ''; + styleName.title = + entry.styleMeta.sloppy ? t('styleNotAppliedRegexpProblemTooltip') : + entry.styleMeta.excludedScheme ? t(`styleNotAppliedScheme${capitalize(entry.styleMeta.preferScheme)}`) : + styleName.scrollWidth > styleName.clientWidth + 1 ? styleName.textContent : + ''; }); - entry.classList.toggle('not-applied', style.excluded || style.sloppy); + entry.classList.toggle('not-applied', style.excluded || style.sloppy || style.excludedScheme); entry.classList.toggle('regexp-partial', style.sloppy); $('.exclude-by-domain-checkbox', entry).checked = styleExcluded(style, 'domain'); @@ -347,6 +348,10 @@ function createStyleElement(style) { return entry; } +function capitalize(s) { + return s[0].toUpperCase() + s.slice(1); +} + function styleExcluded({exclusions}, type) { if (!exclusions) { return false;