diff --git a/ui/components/app/modals/export-private-key-modal/export-private-key-modal.component.js b/ui/components/app/modals/export-private-key-modal/export-private-key-modal.component.js index ae378f3ce..2b5cb0acb 100644 --- a/ui/components/app/modals/export-private-key-modal/export-private-key-modal.component.js +++ b/ui/components/app/modals/export-private-key-modal/export-private-key-modal.component.js @@ -4,7 +4,6 @@ import React, { Component } from 'react'; import { stripHexPrefix } from 'ethereumjs-util'; import copyToClipboard from 'copy-to-clipboard'; -import ReadOnlyInput from '../../../ui/readonly-input'; import Button from '../../../ui/button'; import AccountModalContainer from '../account-modal-container'; import { toChecksumHexAddress } from '../../../../../shared/modules/hexstring-utils'; @@ -78,13 +77,12 @@ export default class ExportPrivateKeyModal extends Component { } return ( - copyToClipboard(plainKey)} - /> + > + {plainKey} + ); } @@ -147,10 +145,9 @@ export default class ExportPrivateKeyModal extends Component { backButtonAction={() => showAccountDetailModal()} > {name} - +
+ {toChecksumHexAddress(address)} +
{this.context.t('showPrivateKeys')} diff --git a/ui/components/app/modals/export-private-key-modal/index.scss b/ui/components/app/modals/export-private-key-modal/index.scss index 3734d04a4..46e12a102 100644 --- a/ui/components/app/modals/export-private-key-modal/index.scss +++ b/ui/components/app/modals/export-private-key-modal/index.scss @@ -65,24 +65,17 @@ margin-top: 18px; } - &__password-display-wrapper { + &__private-key-display { + @include Paragraph; + height: 80px; width: 291px; border: 1px solid var(--color-border-default); border-radius: 2px; - } - - &__password-display-textarea { - @include Paragraph; - color: var(--color-error-default); - background-color: var(--color-background-default); - border: none; - height: 75px; - width: 100%; - overflow: hidden; - resize: none; padding: 9px 13px 8px; + overflow: hidden; + overflow-wrap: break-word; } &__buttons { @@ -104,18 +97,13 @@ } .ellip-address-wrapper { - display: flex; - justify-content: center; border: 1px solid var(--color-border-default); padding: 5px 10px; margin-top: 7px; - width: 286px; - - input { - background: var(--color-background-default); - color: var(--color-text-default); - border: 0; - } + max-width: 286px; + direction: ltr; + overflow: hidden; + text-overflow: ellipsis; } } diff --git a/ui/components/ui/readonly-input/index.js b/ui/components/ui/readonly-input/index.js deleted file mode 100644 index f944d6a89..000000000 --- a/ui/components/ui/readonly-input/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './readonly-input'; diff --git a/ui/components/ui/readonly-input/index.scss b/ui/components/ui/readonly-input/index.scss deleted file mode 100644 index 9eff60bbb..000000000 --- a/ui/components/ui/readonly-input/index.scss +++ /dev/null @@ -1,8 +0,0 @@ -.readonly-input { - &__input { - direction: ltr; - overflow: hidden; - text-overflow: ellipsis; - width: 100%; - } -} diff --git a/ui/components/ui/readonly-input/readonly-input.js b/ui/components/ui/readonly-input/readonly-input.js deleted file mode 100644 index 30fbce0e2..000000000 --- a/ui/components/ui/readonly-input/readonly-input.js +++ /dev/null @@ -1,38 +0,0 @@ -import PropTypes from 'prop-types'; -import React from 'react'; -import classnames from 'classnames'; - -export default function ReadOnlyInput(props) { - const { - wrapperClass = '', - inputClass = '', - value, - textarea, - onClick, - autoFocus = false, - } = props; - - const InputType = textarea ? 'textarea' : 'input'; - - return ( -
- event.target.select()} - onClick={onClick} - autoFocus={autoFocus} - /> -
- ); -} - -ReadOnlyInput.propTypes = { - wrapperClass: PropTypes.string, - inputClass: PropTypes.string, - value: PropTypes.string, - textarea: PropTypes.bool, - onClick: PropTypes.func, - autoFocus: PropTypes.bool, -}; diff --git a/ui/components/ui/ui-components.scss b/ui/components/ui/ui-components.scss index ff57d3769..52c0a8e95 100644 --- a/ui/components/ui/ui-components.scss +++ b/ui/components/ui/ui-components.scss @@ -40,7 +40,6 @@ @import 'pulse-loader/index'; @import 'qr-code/index'; @import 'radio-group/index'; -@import 'readonly-input/index'; @import 'sender-to-recipient/index'; @import 'show-hide-toggle/index.scss'; @import 'snackbar/index';