1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-26 12:29:06 +01:00

Merge pull request #9855 from darkwing/edit-account-focus

Make editable action item a button, autofocus input contents
This commit is contained in:
David Walsh 2020-11-13 13:07:40 -06:00 committed by GitHub
commit d78e6dc821
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 13 deletions

View File

@ -45,13 +45,15 @@ class EditableLabel extends Component {
className={classnames('large-input', 'editable-label__input', {
'editable-label__input--error': value === '',
})}
autoFocus
/>,
<div className="editable-label__icon-wrapper" key={2}>
<i
className="fa fa-check editable-label__icon"
onClick={() => this.handleSubmit()}
/>
</div>,
<button
className="editable-label__icon-button"
key={2}
onClick={() => this.handleSubmit()}
>
<i className="fa fa-check editable-label__icon" />
</button>,
]
}
@ -60,12 +62,13 @@ class EditableLabel extends Component {
<div key={1} className="editable-label__value">
{this.state.value}
</div>,
<div key={2} className="editable-label__icon-wrapper">
<i
className="fas fa-pencil-alt editable-label__icon"
onClick={() => this.setState({ isEditing: true })}
/>
</div>,
<button
key={2}
className="editable-label__icon-button"
onClick={() => this.setState({ isEditing: true })}
>
<i className="fas fa-pencil-alt editable-label__icon" />
</button>,
]
}

View File

@ -23,10 +23,11 @@
}
}
&__icon-wrapper {
&__icon-button {
position: absolute;
margin-left: 10px;
left: 100%;
background: unset;
}
&__icon {