PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Remove bubble from around location events (#7459)

Browse source
This commit is contained in:
Michael Telatynski 2022-01-10 12:53:11 +00:00 committed by GitHub
parent dbd7949e79
commit 8b88b48edc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
res/css/views/rooms/_EventBubbleTile.scss
View file

@ -163,7 +163,7 @@ limitations under the License.
padding: 4px 8px;
bottom: 0;
right: 0;
z-index: 1; // above media
z-index: 3; // above media and location share maps
}
//noinspection CssReplaceWithShorthandSafely
@ -181,7 +181,7 @@ limitations under the License.
}
}
.mx_EventTile_line:not(.mx_EventTile_mediaLine) {
&:not(.mx_EventTile_noBubble) .mx_EventTile_line:not(.mx_EventTile_mediaLine) {
padding: var(--gutterSize);
padding-right: 60px; // space for the timestamp
background: var(--backgroundColor);
@ -190,14 +190,14 @@ limitations under the License.
&.mx_EventTile_continuation[data-self=false] .mx_EventTile_line {
border-top-left-radius: 0;
.mx_MImageBody .mx_MImageBody_thumbnail {
.mx_MImageBody .mx_MImageBody_thumbnail, .mx_MLocationBody_map {
border-top-left-radius: 0;
}
}
&.mx_EventTile_lastInSection[data-self=false] .mx_EventTile_line {
border-bottom-left-radius: var(--cornerRadius);
.mx_MImageBody .mx_MImageBody_thumbnail {
.mx_MImageBody .mx_MImageBody_thumbnail, .mx_MLocationBody_map {
border-bottom-left-radius: var(--cornerRadius);
}
}
@ -205,14 +205,14 @@ limitations under the License.
&.mx_EventTile_continuation[data-self=true] .mx_EventTile_line {
border-top-right-radius: 0;
.mx_MImageBody .mx_MImageBody_thumbnail {
.mx_MImageBody .mx_MImageBody_thumbnail, .mx_MLocationBody_map {
border-top-right-radius: 0;
}
}
&.mx_EventTile_lastInSection[data-self=true] .mx_EventTile_line {
border-bottom-right-radius: var(--cornerRadius);
.mx_MImageBody .mx_MImageBody_thumbnail {
.mx_MImageBody .mx_MImageBody_thumbnail, .mx_MLocationBody_map {
border-bottom-right-radius: var(--cornerRadius);
}
}

2
src/components/views/rooms/EventTile.tsx
View file

@ -1123,7 +1123,7 @@ export default class EventTile extends React.Component<IProps, IState> {
mx_EventTile_unverified: !isBubbleMessage && this.state.verified === E2EState.Warning,
mx_EventTile_unknown: !isBubbleMessage && this.state.verified === E2EState.Unknown,
mx_EventTile_bad: isEncryptionFailure,
mx_EventTile_emote: msgtype === 'm.emote',
mx_EventTile_emote: msgtype === MsgType.Emote,
mx_EventTile_noSender: this.props.hideSender,
mx_EventTile_clamp: this.props.tileShape === TileShape.ThreadPanel,
mx_EventTile_noBubble: noBubbleEvent,

8
src/utils/EventUtils.ts
View file

@ -19,6 +19,7 @@ import { EventType, MsgType, RelationType } from "matrix-js-sdk/src/@types/event
import { MatrixClient } from 'matrix-js-sdk/src/client';
import { logger } from 'matrix-js-sdk/src/logger';
import { POLL_START_EVENT_TYPE } from "matrix-js-sdk/src/@types/polls";
import { LOCATION_EVENT_TYPE } from 'matrix-js-sdk/src/@types/location';
import { MatrixClientPeg } from '../MatrixClientPeg';
import shouldHideEvent from "../shouldHideEvent";
@ -148,7 +149,12 @@ export function getEventDisplayInfo(mxEvent: MatrixEvent): {
);
// Some non-info messages want to be rendered in the appropriate bubble column but without the bubble background
const noBubbleEvent = (
POLL_START_EVENT_TYPE.matches(eventType)
POLL_START_EVENT_TYPE.matches(eventType) ||
LOCATION_EVENT_TYPE.matches(eventType) ||
(
eventType === EventType.RoomMessage &&
LOCATION_EVENT_TYPE.matches(msgtype)
)
);
// If we're showing hidden events in the timeline, we should use the