m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Make editable actoin item a button, autofocus input contents

Browse Source
This commit is contained in:
David Walsh 2020-11-11 12:00:12 -06:00
parent 552ea136b7
commit 74866a6efb
2 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
ui/app/components/ui/editable-label/editable-label.js
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>,
]
}

3
ui/app/components/ui/editable-label/index.scss
View File

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