Add saved state for button
This commit is contained in:
parent
99f2a65cf8
commit
6f78730a69
2 changed files with 24 additions and 0 deletions
|
|
@ -34,6 +34,24 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.save:hover {
|
||||||
|
color: #FF4D4D;
|
||||||
|
|
||||||
|
.icon svg {
|
||||||
|
fill: #FF4D4D;
|
||||||
|
stroke: #FF4D4D;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.save.Active {
|
||||||
|
color: #FF4D4D;
|
||||||
|
|
||||||
|
.icon svg {
|
||||||
|
fill: #FF4D4D;
|
||||||
|
stroke: #FF4D4D;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&.modal:hover {
|
&.modal:hover {
|
||||||
background: $grey-90;
|
background: $grey-90;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,7 @@ import CrossIcon from '~public/icons/Cross.svg'
|
||||||
import EditIcon from '~public/icons/Edit.svg'
|
import EditIcon from '~public/icons/Edit.svg'
|
||||||
import LinkIcon from '~public/icons/Link.svg'
|
import LinkIcon from '~public/icons/Link.svg'
|
||||||
import MenuIcon from '~public/icons/Menu.svg'
|
import MenuIcon from '~public/icons/Menu.svg'
|
||||||
|
import SaveIcon from '~public/icons/Save.svg'
|
||||||
|
|
||||||
import './index.scss'
|
import './index.scss'
|
||||||
|
|
||||||
|
|
@ -63,6 +64,10 @@ class Button extends React.Component<Props, State> {
|
||||||
icon = <span className='icon'>
|
icon = <span className='icon'>
|
||||||
<EditIcon />
|
<EditIcon />
|
||||||
</span>
|
</span>
|
||||||
|
} else if (this.props.icon === 'save') {
|
||||||
|
icon = <span className='icon stroke'>
|
||||||
|
<SaveIcon />
|
||||||
|
</span>
|
||||||
}
|
}
|
||||||
|
|
||||||
const classes = classNames({
|
const classes = classNames({
|
||||||
|
|
@ -70,6 +75,7 @@ class Button extends React.Component<Props, State> {
|
||||||
'Active': this.props.active,
|
'Active': this.props.active,
|
||||||
'btn-pressed': this.state.isPressed,
|
'btn-pressed': this.state.isPressed,
|
||||||
'btn-disabled': this.props.disabled,
|
'btn-disabled': this.props.disabled,
|
||||||
|
'save': this.props.icon === 'save',
|
||||||
'destructive': this.props.type == ButtonType.Destructive
|
'destructive': this.props.type == ButtonType.Destructive
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue