Fix black-on-black GIF icon for stickers

Text colour ended up being the link colour on images because the
whole image is in an `a`, but stickers are not so it got the default
font colour, which might be black. Define an explicit colour.

Also set pointer-events: none so you can hover over the gif icon
too (I managed to make the message panel small which made the icon
cover most the image, so this prevented the gif from animating
at all).

Fixes element-hq/element-web#8004

res/css/views/messages/_MImageBody.scss

@@ -56,4 +56,6 @@ limitations under the License.
     border-radius: 5px;
     background: $imagebody-giflabel;
     border: 2px solid $imagebody-giflabel-border;
+    color: $imagebody-giflabel-color;
+    pointer-events: none;
 }

res/themes/dark/css/_dark.scss

@@ -164,6 +164,7 @@ $lightbox-border-color: #ffffff;
 
 $imagebody-giflabel: rgba(1, 1, 1, 0.7);
 $imagebody-giflabel-border: rgba(1, 1, 1, 0.2);
+$imagebody-giflabel-color: rgba(0, 0, 0, 1);
 
 // unused?
 $progressbar-color: #000;

res/themes/dharma/css/_dharma.scss

@@ -99,6 +99,7 @@ $lightbox-background-bg-color: #000;
 
 $imagebody-giflabel: rgba(0, 0, 0, 0.7);
 $imagebody-giflabel-border: rgba(0, 0, 0, 0.2);
+$imagebody-giflabel-color: rgba(255, 255, 255, 1);
 
 $greyed-fg-color: #888;
 

res/themes/light/css/_base.scss

@@ -177,6 +177,7 @@ $lightbox-border-color: #ffffff;
 
 $imagebody-giflabel: rgba(0, 0, 0, 0.7);
 $imagebody-giflabel-border: rgba(0, 0, 0, 0.2);
+$imagebody-giflabel-color: rgba(255, 255, 255, 1);
 
 // unused?
 $progressbar-color: #000;