Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-15 20:54:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

Update the button styling on the emoji comparison dialog during cross-signing

Browse Source 
Signed-off-by: Faye Duxovni <fayed@element.io>
This commit is contained in:
Faye Duxovni 2021-10-14 00:46:15 -04:00
parent 418043488b
commit 8f10a1d3fb
2 changed files with 9 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
res/css/views/verification/_VerificationShowSas.scss
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;
}
}

15
src/components/views/verification/VerificationShowSas.tsx
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">