diff options
| author | madelinegr <monika_hedman@brown.edu> | 2019-06-11 15:28:51 -0400 |
|---|---|---|
| committer | madelinegr <monika_hedman@brown.edu> | 2019-06-11 15:28:51 -0400 |
| commit | fc1290b614eeda0f99bb857b1a264dc0fc344674 (patch) | |
| tree | 84cc7859f9d50d347d323a31585ebf87536d0b11 /src/client/views/search/ToggleBar.tsx | |
| parent | 5c3580902a63f7321c08065188f42c1874d399ad (diff) | |
big icon changes coming
Diffstat (limited to 'src/client/views/search/ToggleBar.tsx')
| -rw-r--r-- | src/client/views/search/ToggleBar.tsx | 6 |
1 files changed, 4 insertions, 2 deletions
diff --git a/src/client/views/search/ToggleBar.tsx b/src/client/views/search/ToggleBar.tsx index f3a1a3171..7dbb3b767 100644 --- a/src/client/views/search/ToggleBar.tsx +++ b/src/client/views/search/ToggleBar.tsx @@ -19,6 +19,7 @@ export class ToggleBar extends React.Component<ToggleBarProps>{ @observable forwardTimeline: anime.AnimeTimelineInstance; @observable _toggleButton: React.RefObject<HTMLDivElement>; @observable _originalStatus: boolean = this.props.originalStatus; + @observable _curStatus: boolean = this.props.originalStatus; constructor(props: ToggleBarProps) { super(props); @@ -69,6 +70,7 @@ export class ToggleBar extends React.Component<ToggleBarProps>{ @action.bound onclick() { + this._curStatus = !this._curStatus; this.forwardTimeline.play(); this.forwardTimeline.reverse(); this.props.changeStatus(); @@ -78,8 +80,8 @@ export class ToggleBar extends React.Component<ToggleBarProps>{ return ( <div> <div className="toggle-title"> - <div className="toggle-option">{this.props.optionOne}</div> - <div className="toggle-option">{this.props.optionTwo}</div> + <div className="toggle-option" style = {{ opacity: (this._curStatus ? 1:.4)}}>{this.props.optionOne}</div> + <div className="toggle-option" style = {{ opacity: (this._curStatus ? .4:1)}}>{this.props.optionTwo}</div> </div> <div className="toggle-bar" id="toggle-bar" style={{ flexDirection: (this._originalStatus ? "row" : "row-reverse") }}> <div className="toggle-button" id="toggle-button" ref={this._toggleButton} onClick={this.onclick} /> |