Update: remove text-shadow + box-shadow when 'No Transparency' enabled (

fixes #73) (#113)

* remove 'text-shadow' when 'no transparency' enabled

* for 'no transparency', only remove box-shadow with transparency

* README 'no transparency' note added

README.md

@@ -23,6 +23,7 @@ It provides visual accessibility improvements.
 * In order to support paragraph spacing, all body text needs to be wrapped in [paragraph tags](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p).
 * Font size medium is the default font size (16px usually), large is 18pt, small is 9pt.
 * Hide decorative images is contingent on alt text.
+* No transparency removes `box-shadow` (where transparency is used), `text-shadow` and `opacity` styles.
 
 ### Theme considerations
 * All colour transformations are applied by mathematical shifts. It is therefore important that the course start from AA colour contrast for the algorithms to be applicable.

js/CSSRuleModifiers.js

@@ -17,14 +17,25 @@ import Color from './Color';
  */
 export default [
   [
-    // Remove box shadows
-    'box-shadow',
+    // Remove text shadows
+    'text-shadow',
     null,
     function () {
       if (!this.noTransparency) return;
       return 'none';
     }
   ],
+  [
+    // Remove box shadows with transparency
+    'box-shadow',
+    null,
+    function (output) {
+      if (!this.noTransparency) return;
+      const zeroOffsetAndBlur = '0px 0px 0px';
+      if (output.includes(zeroOffsetAndBlur)) return;
+      return 'none';
+    }
+  ],
   [
     // Increase opacity either way
     'opacity',