Merge pull request #6943 from matrix-org/fayed/emoji-compare-buttons

Update the button styling on the emoji comparison dialog during cross-signing
This commit is contained in:
Faye Duxovni 2021-10-15 10:34:25 -04:00 committed by GitHub
commit 1b7277b8f0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 28 deletions

View file

@ -62,20 +62,13 @@ limitations under the License.
flex-basis: 100%;
}
.mx_VerificationShowSas {
.mx_Dialog_buttons {
// this is more specific than the DialogButtons css so gets preference
button.mx_VerificationShowSas_matchButton {
color: $accent-color;
background-color: $accent-bg-color;
border: none;
}
.mx_VerificationShowSas_buttonRow {
text-align: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
// this is more specific than the DialogButtons css so gets preference
button.mx_VerificationShowSas_noMatchButton {
color: $notice-primary-color;
background-color: $notice-primary-bg-color;
border: none;
}
.mx_AccessibleButton {
margin-inline: 9px;
}
}

View file

@ -20,7 +20,6 @@ import { DeviceInfo } from "matrix-js-sdk/src//crypto/deviceinfo";
import { _t, _td } from '../../../languageHandler';
import { PendingActionSpinner } from "../right_panel/EncryptionInfo";
import AccessibleButton from "../elements/AccessibleButton";
import DialogButtons from "../elements/DialogButtons";
import { fixupColorFonts } from '../../../utils/FontManager';
import { replaceableComponent } from "../../../utils/replaceableComponent";
@ -143,25 +142,15 @@ export default class VerificationShowSas extends React.Component<IProps, IState>
text = _t("Cancelling…");
}
confirm = <PendingActionSpinner text={text} />;
} else if (this.props.inDialog) {
// FIXME: stop using DialogButtons here once this component is only used in the right panel verification
confirm = <DialogButtons
primaryButton={_t("They match")}
onPrimaryButtonClick={this.onMatchClick}
primaryButtonClass="mx_UserInfo_wideButton mx_VerificationShowSas_matchButton"
cancelButton={_t("They don't match")}
onCancel={this.onDontMatchClick}
cancelButtonClass="mx_UserInfo_wideButton mx_VerificationShowSas_noMatchButton"
/>;
} else {
confirm = <React.Fragment>
confirm = <div className="mx_VerificationShowSas_buttonRow">
<AccessibleButton onClick={this.onDontMatchClick} kind="danger">
{ _t("They don't match") }
</AccessibleButton>
<AccessibleButton onClick={this.onMatchClick} kind="primary">
{ _t("They match") }
</AccessibleButton>
</React.Fragment>;
</div>;
}
return <div className="mx_VerificationShowSas">

View file

@ -952,8 +952,8 @@
"Waiting for you to verify on your other session…": "Waiting for you to verify on your other session…",
"Waiting for %(displayName)s to verify…": "Waiting for %(displayName)s to verify…",
"Cancelling…": "Cancelling…",
"They match": "They match",
"They don't match": "They don't match",
"They match": "They match",
"To be secure, do this in person or use a trusted way to communicate.": "To be secure, do this in person or use a trusted way to communicate.",
"Dog": "Dog",
"Cat": "Cat",