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

Use mask images in key entry dialogs

pull/21833/head
David Baker 2020-06-26 12:56:41 +01:00
parent 919c3bd360
commit 178cbca934
2 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
res/css/views/dialogs/secretstorage/_AccessSecretStorageDialog.scss
View File

@ -15,6 +15,25 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_AccessSecretStorageDialog_titleWithIcon::before {
content: '';
display: inline-block;
width: 24px;
height: 24px;
margin-right: 8px;
position: relative;
top: 5px;
background-color: $primary-fg-color;
}
.mx_AccessSecretStorageDialog_secureBackupTitle::before {
mask-image: url('$(res)/img/feather-customised/secure-backup.svg');
}
.mx_AccessSecretStorageDialog_securePhraseTitle::before {
mask-image: url('$(res)/img/feather-customised/secure-phrase.svg');
}
.mx_AccessSecretStorageDialog_keyStatus {
height: 30px;
}

8
src/components/views/dialogs/secretstorage/AccessSecretStorageDialog.js
View File

@ -111,12 +111,12 @@ export default class AccessSecretStorageDialog extends React.PureComponent {
let content;
let title;
let headerImage;
let titleClass;
if (hasPassphrase && !this.state.forceRecoveryKey) {
const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
title = _t("Security Phrase");
headerImage = require("../../../../../res/img/feather-customised/secure-phrase.svg");
titleClass = ['mx_AccessSecretStorageDialog_titleWithIcon mx_AccessSecretStorageDialog_securePhraseTitle'];
let keyStatus;
if (this.state.keyMatches === false) {
@ -166,7 +166,7 @@ export default class AccessSecretStorageDialog extends React.PureComponent {
</div>;
} else {
title = _t("Security Key");
headerImage = require("../../../../../res/img/feather-customised/secure-backup.svg");
titleClass = ['mx_AccessSecretStorageDialog_titleWithIcon mx_AccessSecretStorageDialog_secureBackupTitle'];
const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
let keyStatus;
@ -213,9 +213,9 @@ export default class AccessSecretStorageDialog extends React.PureComponent {
return (
<BaseDialog className='mx_AccessSecretStorageDialog'
headerImage={headerImage}
onFinished={this.props.onFinished}
title={title}
titleClass={titleClass}
>
<div>
{content}