Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 30d997e

Browse files
richvdhrichvdh
authored
Remove green "verified" bar for e2e events (#11496)
There is a little-known feature where, if you have verified a user (eg, via the emoji game), then when you mouse-over a message that they sent, it gets a green highlight. We also show a brown bar sometimes, and according to the CSS there may be a yellow bar too? Very few people seem to know this exists, and even if you do know it exists nobody seems to understand what exactly the various colours are supposed to be. So, rather than porting this magic mystery feature to Rust Crypto, let's rip it out.
1 parent 6faad7a commit 30d997e

File tree

7 files changed

+0
-64
lines changed

7 files changed

+0
-64
lines changed

‎cypress/e2e/crypto/crypto.spec.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -332,7 +332,6 @@ describe("Cryptography", function () {
332332
cy.findByText("Hoo!");
333333
})
334334
.closest(".mx_EventTile")
335-
.should("have.class", "mx_EventTile_verified")
336335
.should("not.have.descendants", ".mx_EventTile_e2eIcon_warning");
337336

338337
// bob sends an edit to the first message with his unverified device
@@ -377,7 +376,6 @@ describe("Cryptography", function () {
377376
cy.findByText("Hee!");
378377
})
379378
.closest(".mx_EventTile")
380-
.should("have.class", "mx_EventTile_verified")
381379
.should("not.have.descendants", ".mx_EventTile_e2eIcon_warning");
382380
});
383381
});

‎res/css/structures/_FilePanel.pcss

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -52,16 +52,6 @@ limitations under the License.
5252
padding-inline-start: 0;
5353
}
5454

55-
&:hover {
56-
&.mx_EventTile_verified,
57-
&.mx_EventTile_unverified,
58-
&.mx_EventTile_unknown {
59-
.mx_EventTile_line {
60-
box-shadow: none;
61-
}
62-
}
63-
}
64-
6555
.mx_MFileBody {
6656
line-height: 2.4rem;
6757
}

‎res/css/views/rooms/_EventTile.pcss

Lines changed: 0 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -257,21 +257,6 @@ $left-gutter: 64px;
257257
.mx_EventTile_line {
258258
background-color: $event-selected-color;
259259
}
260-
261-
&.mx_EventTile_verified .mx_EventTile_line {
262-
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
263-
$e2e-verified-color;
264-
}
265-
266-
&.mx_EventTile_unverified .mx_EventTile_line {
267-
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
268-
$e2e-unverified-color;
269-
}
270-
271-
&.mx_EventTile_unknown .mx_EventTile_line {
272-
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
273-
$e2e-unknown-color;
274-
}
275260
}
276261
}
277262

@@ -596,14 +581,6 @@ $left-gutter: 64px;
596581
padding-inline-start: calc(var(--EventTile_group_line-spacing-inline-start) + 20px);
597582
}
598583
}
599-
600-
&:hover {
601-
&.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
602-
&.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
603-
&.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
604-
padding-inline-start: calc($left-gutter + 18px + var(--selected-message-border-width));
605-
}
606-
}
607584
}
608585

609586
&[data-layout="bubble"] {
@@ -1327,14 +1304,6 @@ $left-gutter: 64px;
13271304
position: absolute; /* for IRC layout */
13281305
top: 2px; /* Align with mx_EventTile_content */
13291306
}
1330-
1331-
&:hover {
1332-
&.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
1333-
&.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
1334-
&.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
1335-
padding-inline-start: 0;
1336-
}
1337-
}
13381307
}
13391308

13401309
&[data-layout="bubble"] {

‎res/themes/legacy-light/css/_legacy-light.pcss

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -241,8 +241,6 @@ $copy-button-url: "$(res)/img/element-icons/copy.svg";
241241

242242
/* e2e */
243243
$e2e-verified-color: #0dbd8b;
244-
$e2e-unknown-color: #e8bf37;
245-
$e2e-unverified-color: #e8bf37;
246244
$e2e-warning-color: #ff5b55;
247245
$e2e-verified-color-light: var(--cpd-color-green-300);
248246
$e2e-warning-color-light: var(--cpd-color-red-300);

‎res/themes/light/css/_light.pcss

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -210,8 +210,6 @@ $roomtile-default-badge-bg-color: $muted-fg-color;
210210
/* e2e */
211211
/* ******************** */
212212
$e2e-verified-color: var(--cpd-color-green-900);
213-
$e2e-unknown-color: var(--cpd-color-yellow-900);
214-
$e2e-unverified-color: var(--cpd-color-green-900);
215213
$e2e-warning-color: var(--cpd-color-red-900);
216214
$e2e-verified-color-light: var(--cpd-color-green-300);
217215
$e2e-warning-color-light: var(--cpd-color-red-300);

‎src/components/views/rooms/EventTile.tsx

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -981,9 +981,6 @@ export class UnwrappedEventTile extends React.Component<EventTileProps, IState>
981981
mx_EventTile_lastInSection: this.props.lastInSection,
982982
mx_EventTile_contextual: this.props.contextual,
983983
mx_EventTile_actionBarFocused: this.state.actionBarFocused,
984-
mx_EventTile_verified: !isBubbleMessage && this.state.verified === E2EState.Verified,
985-
mx_EventTile_unverified: !isBubbleMessage && this.state.verified === E2EState.Warning,
986-
mx_EventTile_unknown: !isBubbleMessage && this.state.verified === E2EState.Unknown,
987984
mx_EventTile_bad: isEncryptionFailure,
988985
mx_EventTile_emote: msgtype === MsgType.Emote,
989986
mx_EventTile_noSender: this.props.hideSender,

‎test/components/views/rooms/EventTile-test.tsx

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -245,9 +245,6 @@ describe("EventTile", () => {
245245

246246
const eventTiles = container.getElementsByClassName("mx_EventTile");
247247
expect(eventTiles).toHaveLength(1);
248-
const eventTile = eventTiles[0];
249-
250-
expect(eventTile.classList).toContain("mx_EventTile_unverified");
251248

252249
// there should be a warning shield
253250
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(1);
@@ -273,9 +270,6 @@ describe("EventTile", () => {
273270

274271
const eventTiles = container.getElementsByClassName("mx_EventTile");
275272
expect(eventTiles).toHaveLength(1);
276-
const eventTile = eventTiles[0];
277-
278-
expect(eventTile.classList).toContain("mx_EventTile_verified");
279273

280274
// there should be no warning
281275
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(0);
@@ -299,9 +293,6 @@ describe("EventTile", () => {
299293

300294
const eventTiles = container.getElementsByClassName("mx_EventTile");
301295
expect(eventTiles).toHaveLength(1);
302-
const eventTile = eventTiles[0];
303-
304-
expect(eventTile.classList).toContain("mx_EventTile_verified");
305296

306297
// there should be no warning
307298
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(0);
@@ -324,7 +315,6 @@ describe("EventTile", () => {
324315
});
325316

326317
// check it was updated
327-
expect(eventTile.classList).toContain("mx_EventTile_unverified");
328318
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(1);
329319
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")[0].classList).toContain(
330320
"mx_EventTile_e2eIcon_warning",
@@ -351,9 +341,6 @@ describe("EventTile", () => {
351341

352342
const eventTiles = container.getElementsByClassName("mx_EventTile");
353343
expect(eventTiles).toHaveLength(1);
354-
const eventTile = eventTiles[0];
355-
356-
expect(eventTile.classList).toContain("mx_EventTile_verified");
357344

358345
// there should be no warning
359346
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(0);
@@ -372,7 +359,6 @@ describe("EventTile", () => {
372359
});
373360

374361
// check it was updated
375-
expect(eventTile.classList).not.toContain("mx_EventTile_verified");
376362
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(1);
377363
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")[0].classList).toContain(
378364
"mx_EventTile_e2eIcon_warning",

0 commit comments

Comments
 (0)