Merge pull request #3513 from matrix-org/travis/mask-eye

Use a mask instead of an img for "Show image" eye

res/css/views/messages/_MImageBody.scss

@@ -79,11 +79,17 @@ limitations under the License.
     .mx_HiddenImagePlaceholder_button {
         color: $accent-color;
 
-        img {
+        span.mx_HiddenImagePlaceholder_eye {
             margin-right: 8px;
+
+            background-color: $accent-color;
+            mask-image: url('$(res)/img/feather-customised/eye.svg');
+            display: inline-block;
+            width: 18px;
+            height: 14px;
         }
 
-        span {
+        span:not(.mx_HiddenImagePlaceholder_eye) {
             vertical-align: text-bottom;
         }
     }

src/components/views/messages/MImageBody.js

@@ -496,7 +496,7 @@ export class HiddenImagePlaceholder extends React.PureComponent {
         return (
             <div className={className}>
                 <div className='mx_HiddenImagePlaceholder_button'>
-                    <img src={require("../../../../res/img/feather-customised/eye.svg")} width={17} height={12} />
+                    <span className='mx_HiddenImagePlaceholder_eye' />
                     <span>{_t("Show image")}</span>
                 </div>
             </div>