self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2024-12-24 13:43:12 +02:00
Code Issues Releases Activity

Removing is hover state and using css instead

Browse Source
This commit is contained in:
Jesús Espino 2020-10-27 16:30:15 +01:00
parent 119dd543dc
commit fa92e0fbfd
2 changed files with 12 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
webapp/src/components/viewTitle.scss
View File

@ -1,10 +1,12 @@
.ViewTitle {
.Button {
display: none;
}
&:hover {
&.octo-hovercontrols {
.Button {
display: block;
display: none;
}
&.add-visible:hover {
.Button {
display: block;
}
}
}
}

18
webapp/src/components/viewTitle.tsx
View File

@ -12,13 +12,14 @@ import Editable from '../widgets/editable'
import Button from './button'
import './viewTitle.scss'
type Props = {
board: Board
intl: IntlShape
}
type State = {
isHoverOnCover: boolean
title: string
}
@ -30,7 +31,7 @@ class ViewTitle extends React.Component<Props, State> {
constructor(props: Props) {
super(props)
this.state = {isHoverOnCover: false, title: props.board.title}
this.state = {title: props.board.title}
}
render(): JSX.Element {
@ -38,17 +39,8 @@ class ViewTitle extends React.Component<Props, State> {
return (
<>
<div
className='octo-hovercontrols'
onMouseOver={() => {
this.setState({isHoverOnCover: true})
}}
onMouseLeave={() => {
this.setState({isHoverOnCover: false})
}}
>
<div className={'ViewTitle octo-hovercontrols ' + (board.icon ? '' : 'add-visible')}>
<Button
style={{display: (!board.icon && this.state.isHoverOnCover) ? null : 'none'}}
onClick={() => {
const newIcon = BlockIcons.shared.randomIcon()
mutator.changeIcon(board, newIcon)
@ -61,7 +53,7 @@ class ViewTitle extends React.Component<Props, State> {
</Button>
</div>
<div className='octo-icontitle'>
<div className='ViewTitle octo-icontitle'>
{board.icon &&
<MenuWrapper>
<div className='octo-button octo-icon'>{board.icon}</div>