Skip to content

Commit

Permalink
remove the grey gradient on images in bubbles in the timeline (#9241)
Browse files Browse the repository at this point in the history
* 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
  • Loading branch information
ara4n committed Sep 8, 2022
1 parent eb97b96 commit 8bc03aa
Showing 1 changed file with 5 additions and 15 deletions.
20 changes: 5 additions & 15 deletions res/css/views/rooms/_EventBubbleTile.pcss
Expand Up @@ -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;
}
}
}
Expand Down

0 comments on commit 8bc03aa

Please sign in to comment.