From 8bc03aabba5c0b1a66e5720a8f33bbc3011f365f Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Thu, 8 Sep 2022 15:54:35 +0100 Subject: [PATCH] remove the grey gradient on images in bubbles in the timeline (#9241) * remove the grey gradient on images in the timeline given we now show timestamps with a nice lozenge overlay, so the gradient is unnecessary and just screws up the image. fixes https://github.com/vector-im/element-web/issues/21651 * put a lozenge on the timestamp rather than evil gradient --- res/css/views/rooms/_EventBubbleTile.pcss | 20 +++++--------------- 1 file changed, 5 insertions(+), 15 deletions(-) diff --git a/res/css/views/rooms/_EventBubbleTile.pcss b/res/css/views/rooms/_EventBubbleTile.pcss index f536355d3f0..88368a4bea5 100644 --- a/res/css/views/rooms/_EventBubbleTile.pcss +++ b/res/css/views/rooms/_EventBubbleTile.pcss @@ -292,23 +292,13 @@ limitations under the License. } /* we put the timestamps for media (other than stickers) atop the media */ - /* for images we also apply a linear gradient and change the timestamp colour to aid readability */ &.mx_EventTile_image { .mx_MessageTimestamp { - color: #ffffff; /* regardless of theme, always visible on the below gradient */ - } - - /* linear gradient to make the timestamp more visible */ - .mx_MImageBody::before { - content: ""; - position: absolute; - background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%); - z-index: 1; - top: 0; - bottom: 0; - left: 0; - right: 0; - pointer-events: none; + border-radius: $timeline-image-border-radius; + /* Hardcoded colours because it's the same on all themes */ + background-color: rgba(0, 0, 0, 0.6); + color: #ffffff; + padding: 0px 4px 0px 4px; } } }