OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

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.
pull/28217/head
Richard van der Hoff 2023-09-01 10:41:14 +01:00 committed by GitHub
parent 6faad7aae3
commit 30d997e21c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 0 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
cypress/e2e/crypto/crypto.spec.ts
View File

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

10
res/css/structures/_FilePanel.pcss
View File

@ -52,16 +52,6 @@ limitations under the License.
padding-inline-start: 0;
}
&:hover {
&.mx_EventTile_verified,
&.mx_EventTile_unverified,
&.mx_EventTile_unknown {
.mx_EventTile_line {
box-shadow: none;
}
}
}
.mx_MFileBody {
line-height: 2.4rem;
}

31
res/css/views/rooms/_EventTile.pcss
View File

@ -257,21 +257,6 @@ $left-gutter: 64px;
.mx_EventTile_line {
background-color: $event-selected-color;
}
&.mx_EventTile_verified .mx_EventTile_line {
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$e2e-verified-color;
}
&.mx_EventTile_unverified .mx_EventTile_line {
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$e2e-unverified-color;
}
&.mx_EventTile_unknown .mx_EventTile_line {
box-shadow: inset var(--EventTile-box-shadow-offset-x) 0 0 var(--EventTile-box-shadow-spread-radius)
$e2e-unknown-color;
}
}
}
@ -596,14 +581,6 @@ $left-gutter: 64px;
padding-inline-start: calc(var(--EventTile_group_line-spacing-inline-start) + 20px);
}
}
&:hover {
&.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
&.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
&.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
padding-inline-start: calc($left-gutter + 18px + var(--selected-message-border-width));
}
}
}
&[data-layout="bubble"] {
@ -1327,14 +1304,6 @@ $left-gutter: 64px;
position: absolute; /* for IRC layout */
top: 2px; /* Align with mx_EventTile_content */
}
&:hover {
&.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
&.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
&.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
padding-inline-start: 0;
}
}
}
&[data-layout="bubble"] {

2
res/themes/legacy-light/css/_legacy-light.pcss
View File

@ -241,8 +241,6 @@ $copy-button-url: "$(res)/img/element-icons/copy.svg";
/* e2e */
$e2e-verified-color: #0dbd8b;
$e2e-unknown-color: #e8bf37;
$e2e-unverified-color: #e8bf37;
$e2e-warning-color: #ff5b55;
$e2e-verified-color-light: var(--cpd-color-green-300);
$e2e-warning-color-light: var(--cpd-color-red-300);

2
res/themes/light/css/_light.pcss
View File

@ -210,8 +210,6 @@ $roomtile-default-badge-bg-color: $muted-fg-color;
/* e2e */
/* ******************** */
$e2e-verified-color: var(--cpd-color-green-900);
$e2e-unknown-color: var(--cpd-color-yellow-900);
$e2e-unverified-color: var(--cpd-color-green-900);
$e2e-warning-color: var(--cpd-color-red-900);
$e2e-verified-color-light: var(--cpd-color-green-300);
$e2e-warning-color-light: var(--cpd-color-red-300);

3
src/components/views/rooms/EventTile.tsx
View File

@ -981,9 +981,6 @@ export class UnwrappedEventTile extends React.Component<EventTileProps, IState>
mx_EventTile_lastInSection: this.props.lastInSection,
mx_EventTile_contextual: this.props.contextual,
mx_EventTile_actionBarFocused: this.state.actionBarFocused,
mx_EventTile_verified: !isBubbleMessage && this.state.verified === E2EState.Verified,
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 === MsgType.Emote,
mx_EventTile_noSender: this.props.hideSender,

14
test/components/views/rooms/EventTile-test.tsx
View File

@ -245,9 +245,6 @@ describe("EventTile", () => {
const eventTiles = container.getElementsByClassName("mx_EventTile");
expect(eventTiles).toHaveLength(1);
const eventTile = eventTiles[0];
expect(eventTile.classList).toContain("mx_EventTile_unverified");
// there should be a warning shield
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(1);
@ -273,9 +270,6 @@ describe("EventTile", () => {
const eventTiles = container.getElementsByClassName("mx_EventTile");
expect(eventTiles).toHaveLength(1);
const eventTile = eventTiles[0];
expect(eventTile.classList).toContain("mx_EventTile_verified");
// there should be no warning
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(0);
@ -299,9 +293,6 @@ describe("EventTile", () => {
const eventTiles = container.getElementsByClassName("mx_EventTile");
expect(eventTiles).toHaveLength(1);
const eventTile = eventTiles[0];
expect(eventTile.classList).toContain("mx_EventTile_verified");
// there should be no warning
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(0);
@ -324,7 +315,6 @@ describe("EventTile", () => {
});
// check it was updated
expect(eventTile.classList).toContain("mx_EventTile_unverified");
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(1);
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")[0].classList).toContain(
"mx_EventTile_e2eIcon_warning",
@ -351,9 +341,6 @@ describe("EventTile", () => {
const eventTiles = container.getElementsByClassName("mx_EventTile");
expect(eventTiles).toHaveLength(1);
const eventTile = eventTiles[0];
expect(eventTile.classList).toContain("mx_EventTile_verified");
// there should be no warning
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(0);
@ -372,7 +359,6 @@ describe("EventTile", () => {
});
// check it was updated
expect(eventTile.classList).not.toContain("mx_EventTile_verified");
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")).toHaveLength(1);
expect(container.getElementsByClassName("mx_EventTile_e2eIcon")[0].classList).toContain(
"mx_EventTile_e2eIcon_warning",