diff --git a/scss/westgate/_wiki-prose.scss b/scss/westgate/_wiki-prose.scss index ef2e538..ebce790 100644 --- a/scss/westgate/_wiki-prose.scss +++ b/scss/westgate/_wiki-prose.scss @@ -246,6 +246,12 @@ text-shadow: 0 0 10px rgba(194, 163, 90, 0.28); } +.westgate-wiki .wiki-article-prose .wiki-callout::after, +.westgate-wiki-compose .wiki-editor__content .wiki-callout::after { + mask-mode: alpha; + -webkit-mask-mode: alpha; +} + .westgate-wiki .wiki-article-prose :where(h1, h2, h3, h4), .westgate-wiki-compose .wiki-article-prose .ck.ck-editor__editable_inline.ck-content :where(h1, h2, h3, h4), .westgate-wiki-compose .ck.ck-editor__editable_inline.wiki-article-prose.ck-content :where(h1, h2, h3, h4) { diff --git a/tests/wiki-callout-icon-theme.test.js b/tests/wiki-callout-icon-theme.test.js new file mode 100644 index 0000000..9ce8722 --- /dev/null +++ b/tests/wiki-callout-icon-theme.test.js @@ -0,0 +1,45 @@ +const assert = require("assert"); +const fs = require("fs"); +const path = require("path"); + +const stylesheet = fs.readFileSync( + path.join(__dirname, "..", "scss", "westgate", "_wiki-prose.scss"), + "utf8" +); + +function ruleHasDeclaration(selector, declaration) { + const rulePattern = /([^{}]+)\{([^{}]*)\}/g; + let match; + while ((match = rulePattern.exec(stylesheet)) !== null) { + const selectors = match[1].split(",").map(value => value.trim()); + const body = match[2]; + if (selectors.includes(selector) && body.includes(declaration)) { + return true; + } + } + return false; +} + +[ + ".westgate-wiki .wiki-article-prose .wiki-callout::after", + ".westgate-wiki-compose .wiki-editor__content .wiki-callout::after", +].forEach(selector => { + assert( + ruleHasDeclaration(selector, "mask-mode: alpha"), + `${selector} should force alpha mask rendering without changing the plugin's icon color` + ); + assert( + ruleHasDeclaration(selector, "-webkit-mask-mode: alpha"), + `${selector} should force alpha mask rendering on WebKit/Blink mobile browsers` + ); +}); + +assert( + !stylesheet.includes("--wiki-callout-icon-color"), + "The theme should not introduce new callout icon colors for this mobile rendering fix" +); + +assert( + !stylesheet.includes(".wiki-callout::before"), + "The theme should not restyle the callout icon tile for this mobile rendering fix" +);