Briq
/
multiparty-meeting
7
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Make the sidebar badge red if there are unread messages

master
Torjus 2018-07-12 17:50:47 +02:00
parent 9af194769b
commit 40f6eabdd9
2 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/lib/components/ToolArea/ToolAreaButton.jsx
View File

@ -10,14 +10,16 @@ class ToolAreaButton extends React.Component
{ {
const { const {
toolAreaOpen, toolAreaOpen,
toggleToolArea toggleToolArea,
unread
} = this.props; } = this.props;
return ( return (
<div data-component='ToolAreaButton'> <div data-component='ToolAreaButton'>
<div <div
className={classnames('button', 'toolarea-button', { className={classnames('button', 'toolarea-button', {
on : toolAreaOpen on : toolAreaOpen,
unread
})} })}
data-tip='Toggle tool area' data-tip='Toggle tool area'
data-type='dark' data-type='dark'
@ -32,13 +34,15 @@ class ToolAreaButton extends React.Component
ToolAreaButton.propTypes = ToolAreaButton.propTypes =
{ {
toolAreaOpen : PropTypes.bool.isRequired, toolAreaOpen : PropTypes.bool.isRequired,
toggleToolArea : PropTypes.func.isRequired toggleToolArea : PropTypes.func.isRequired,
unread : PropTypes.bool.isRequired
}; };
const mapStateToProps = (state) => const mapStateToProps = (state) =>
{ {
return { return {
toolAreaOpen : state.toolarea.toolAreaOpen toolAreaOpen : state.toolarea.toolAreaOpen,
unread : state.toolarea.unread > 0
}; };
}; };

4
app/stylus/components/ToolArea.styl
View File

@ -32,6 +32,10 @@
width: 32px; width: 32px;
} }
&.unread {
background-color: #b12525;
}
&.on { &.on {
background-color: rgba(#fff, 0.7); background-color: rgba(#fff, 0.7);
} }