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

See https://github.com/matrix-org/matrix-react-sdk/pull/3492#pullrequestreview-296223646
2019-10-02 12:52:07 -06:00
parent b94c94db04
commit 0491b742c2
2 changed files with 9 additions and 3 deletions
@@ -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;
        }
    }