diff --git a/res/css/views/verification/_VerificationShowSas.scss b/res/css/views/verification/_VerificationShowSas.scss
index 6e26943640..af003112f7 100644
--- a/res/css/views/verification/_VerificationShowSas.scss
+++ b/res/css/views/verification/_VerificationShowSas.scss
@@ -61,3 +61,21 @@ limitations under the License.
.mx_VerificationShowSas_emojiSas_break {
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;
+ }
+
+ // 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;
+ }
+ }
+}
diff --git a/src/components/views/dialogs/VerificationRequestDialog.js b/src/components/views/dialogs/VerificationRequestDialog.js
index 88ca0bc337..7ff2cb8f50 100644
--- a/src/components/views/dialogs/VerificationRequestDialog.js
+++ b/src/components/views/dialogs/VerificationRequestDialog.js
@@ -61,7 +61,6 @@ export default class VerificationRequestDialog extends React.Component {
verificationRequestPromise={this.props.verificationRequestPromise}
onClose={this.props.onFinished}
member={member}
- inDialog={true}
/>
;
}
diff --git a/src/components/views/right_panel/EncryptionPanel.js b/src/components/views/right_panel/EncryptionPanel.js
index da06c37f75..476b6cace9 100644
--- a/src/components/views/right_panel/EncryptionPanel.js
+++ b/src/components/views/right_panel/EncryptionPanel.js
@@ -32,7 +32,7 @@ import {_t} from "../../../languageHandler";
const MISMATCHES = ["m.key_mismatch", "m.user_error", "m.mismatched_sas"];
const EncryptionPanel = (props) => {
- const {verificationRequest, verificationRequestPromise, member, onClose, layout, isRoomEncrypted, inDialog} = props;
+ const {verificationRequest, verificationRequestPromise, member, onClose, layout, isRoomEncrypted} = props;
const [request, setRequest] = useState(verificationRequest);
// state to show a spinner immediately after clicking "start verification",
// before we have a request
@@ -133,7 +133,7 @@ const EncryptionPanel = (props) => {
isSelfVerification={isSelfVerification}
waitingForOtherParty={requested && initiatedByMe}
waitingForNetwork={requested && !initiatedByMe}
- inDialog={inDialog} />
+ inDialog={layout === "dialog"} />
);
} else {
return (
@@ -145,7 +145,7 @@ const EncryptionPanel = (props) => {
member={member}
request={request}
key={request.channel.transactionId}
- inDialog={inDialog}
+ inDialog={layout === "dialog"}
phase={phase}
device={device} />
);
diff --git a/src/components/views/verification/VerificationShowSas.js b/src/components/views/verification/VerificationShowSas.js
index 7e9096e8fe..5fd0dca267 100644
--- a/src/components/views/verification/VerificationShowSas.js
+++ b/src/components/views/verification/VerificationShowSas.js
@@ -125,10 +125,10 @@ export default class VerificationShowSas extends React.Component {
confirm = ;
} else {
confirm =