this.setState({ modalVisible: false })}
+ />
+
);
// {enable2fa &&
diff --git a/src/app/components/elements/CopyPassword/index.jsx b/src/app/components/elements/CopyPassword/index.jsx
new file mode 100644
index 000000000..0244e41be
--- /dev/null
+++ b/src/app/components/elements/CopyPassword/index.jsx
@@ -0,0 +1,80 @@
+import React from 'react';
+import copy from 'app/assets/images/copy.png';
+import { CopyToClipboard } from 'react-copy-to-clipboard';
+import tt from 'counterpart';
+import Toast from 'app/components/elements/Toast';
+
+export default class CopyPassword extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ password: '',
+ showToast: false,
+ copySuccess: false,
+ };
+ this.copySuccess = this.copySuccess.bind(this);
+ this.close = this.close.bind(this);
+ }
+
+ copySuccess() {
+ this.setState({
+ copySuccess: true,
+ showToast: true,
+ });
+ setTimeout(() => {
+ this.setState({
+ showToast: false,
+ });
+ }, 2000);
+ }
+
+ close() {
+ if (!this.state.copySuccess) return;
+ this.props.close();
+ this.setState({
+ copySuccess: false,
+ });
+ }
+ render() {
+ return (
+
+ {this.props.visible ? (
+
+
+
+
+ {tt('copy_password.back_up')}
+
+
+ {tt('copy_password.back_up_tips')}
+
+
+ {this.props.newWif}
+
+
+
+
+
+ {tt('copy_password.back_up_success')}
+
+
+
+ ) : null}
+ {
+
+ }
+
+ );
+ }
+}
diff --git a/src/app/components/elements/CopyPassword/styles.scss b/src/app/components/elements/CopyPassword/styles.scss
new file mode 100644
index 000000000..e4a7608ac
--- /dev/null
+++ b/src/app/components/elements/CopyPassword/styles.scss
@@ -0,0 +1,80 @@
+
+ .copy_password {
+ .copy_password_modal{
+ position: fixed;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ padding: 20px;
+ width: 533px;
+ height: 324px;
+ background: #FFFFFF;
+ border-radius: 12px;
+ z-index: 99;
+ .title {
+ font-family: PingFang SC;
+ font-style: normal;
+ font-weight: 600;
+ font-size: 16px;
+ line-height: 22px;
+
+ color: #252736;
+ margin-bottom: 14px;
+ }
+ .content {
+ font-family: PingFang SC;
+ font-style: normal;
+ font-weight: normal;
+ font-size: 14px;
+ line-height: 20px;
+ color: rgba(47, 47, 47, 0.5);
+ margin-bottom: 29px;
+ }
+ .input_password {
+ position: relative;
+ background: #FFFFFF;
+ border: 1px solid #CACACA;
+ box-sizing: border-box;
+ border-radius: 4px;
+ margin-bottom: 64px;
+ padding: 12px;
+ font-family: PingFang SC;
+ font-style: normal;
+ font-weight: normal;
+ font-size: 12px;
+ line-height: 17px;
+ color: #939393;
+ img {
+ position: absolute;
+ right: 11px;
+ cursor: pointer;
+ }
+ }
+ .footer {
+ background: #F7F7F7;
+ border-radius: 10px;
+ font-family: PingFang SC;
+ font-style: normal;
+ font-weight: 500;
+ font-size: 14px;
+ line-height: 20px;
+ color: rgba(47, 47, 47, 0.5);
+ text-align: center;
+ padding: 10px;
+ }
+ .footer_blue {
+ color: #fff;
+ background: #1720C9;
+ cursor: pointer;
+ }
+ }
+ .copy_password_cover {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0,0,0,0.5);
+ z-index: 9;
+ }
+ };
\ No newline at end of file
diff --git a/src/app/components/elements/Toast/index.jsx b/src/app/components/elements/Toast/index.jsx
new file mode 100644
index 000000000..a2a83a904
--- /dev/null
+++ b/src/app/components/elements/Toast/index.jsx
@@ -0,0 +1,15 @@
+import React from 'react';
+
+export default class Toast extends React.Component {
+ constructor(props) {
+ super(props);
+ }
+
+ render() {
+ return (
+
+ {this.props.text}
+
+ );
+ }
+}
diff --git a/src/app/components/elements/Toast/styles.scss b/src/app/components/elements/Toast/styles.scss
new file mode 100644
index 000000000..b9d709b6a
--- /dev/null
+++ b/src/app/components/elements/Toast/styles.scss
@@ -0,0 +1,74 @@
+
+ .copy_toast {
+ visibility: hidden;
+ max-width: 160px;
+ height: 50px;
+ /*margin-left: -125px;*/
+ margin: auto;
+ background-color: #333;
+ color: #fff;
+ text-align: center;
+ border-radius: 4px;
+ line-height: 50px;
+ position: fixed;
+ z-index: 1;
+ left: 0;right:0;
+ bottom: 30px;
+ font-size: 16px;
+ white-space: nowrap;
+ z-index: 100;
+ }
+
+ .copy_toast.show {
+ visibility: visible;
+ -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
+ animation: fadein 0.5s, fadeout 0.5s 4.5s;
+ }
+
+ @-webkit-keyframes fadein {
+ from {bottom: 0; opacity: 0;}
+ to {bottom: 30px; opacity: 1;}
+ }
+
+ @keyframes fadein {
+ from {bottom: 0; opacity: 0;}
+ to {bottom: 30px; opacity: 1;}
+ }
+
+ @-webkit-keyframes expand {
+ from {min-width: 50px}
+ to {min-width: 350px}
+ }
+
+ @keyframes expand {
+ from {min-width: 50px}
+ to {min-width: 350px}
+ }
+ @-webkit-keyframes stay {
+ from {min-width: 350px}
+ to {min-width: 350px}
+ }
+
+ @keyframes stay {
+ from {min-width: 350px}
+ to {min-width: 350px}
+ }
+ @-webkit-keyframes shrink {
+ from {min-width: 350px;}
+ to {min-width: 50px;}
+ }
+
+ @keyframes shrink {
+ from {min-width: 350px;}
+ to {min-width: 50px;}
+ }
+
+ @-webkit-keyframes fadeout {
+ from {bottom: 30px; opacity: 1;}
+ to {bottom: 60px; opacity: 0;}
+ }
+
+ @keyframes fadeout {
+ from {bottom: 30px; opacity: 1;}
+ to {bottom: 60px; opacity: 0;}
+ }
\ No newline at end of file
diff --git a/src/app/locales/en.json b/src/app/locales/en.json
index 97c02b8a3..e95e26ee3 100644
--- a/src/app/locales/en.json
+++ b/src/app/locales/en.json
@@ -1128,5 +1128,13 @@
"Data is invalid. Please check if you are using the correct private key.",
"need_active_or_owner_key":
"This operation requires logging in with your Active or Owner key or Master password."
+ },
+ "copy_password": {
+ "back_up": "Back up password",
+ "back_up_success": "I've copied the password. Continue.",
+ "back_up_tips":
+ "Please copy and save this master password for future login.Please note: Steemit does not keep records of anyone's password. Lost passwords cannot be retrieved. Please save your password properly.",
+ "regenerate": "Regenerate",
+ "copy_success": "Copied successfully"
}
}
diff --git a/src/app/locales/zh.json b/src/app/locales/zh.json
index ff6296c80..b0be6d46d 100644
--- a/src/app/locales/zh.json
+++ b/src/app/locales/zh.json
@@ -903,5 +903,13 @@
"data_is_invalid": "数据异常.请确认你使用的私钥是正确的。",
"need_active_or_owner_key":
"此操作需要使用您的活跃密钥或拥有者密钥或主密码登陆。"
+ },
+ "copy_password": {
+ "back_up": "备份密码",
+ "back_up_success": "我已复制密码,继续",
+ "back_up_tips":
+ "请复制并保存此主密码,便于稍后登录您的账户。注意:Steemit不保存用户任何密码,因此一旦丢失,无法找回,请务必安全保存!",
+ "regenerate": "重新生成",
+ "copy_success": "复制成功"
}
}