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 element-hq/element-web#21651 * put a lozenge on the timestamp rather than evil gradient
matrix-org · Sep 8, 2022 · 8bc03aa · 8bc03aa
1 parent eb97b96
commit 8bc03aa
Showing 1 changed file with 5 additions and 15 deletions.
diff --git 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;
                 }
             }
         }