mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2025-12-24 20:42:43 +00:00
Add divider buttons
This commit is contained in:
@@ -85,13 +85,25 @@ const SplitPane = createClass({
|
||||
},
|
||||
*/
|
||||
renderDivider : function(){
|
||||
return <div className='divider' onMouseDown={this.handleDown} >
|
||||
<div className='dots'>
|
||||
<i className='fas fa-circle' />
|
||||
<i className='fas fa-circle' />
|
||||
<i className='fas fa-circle' />
|
||||
return <>
|
||||
<div className='arrow left'
|
||||
style={{ left: this.state.currentDividerPos-4 }}
|
||||
onClick={()=>console.log('left')} >
|
||||
<i className='fas fa-arrow-left' />
|
||||
</div>
|
||||
</div>;
|
||||
<div className='arrow right'
|
||||
style={{ left: this.state.currentDividerPos-4 }}
|
||||
onClick={()=>console.log('right')} >
|
||||
<i className='fas fa-arrow-right' />
|
||||
</div>
|
||||
<div className='divider' onMouseDown={this.handleDown} >
|
||||
<div className='dots'>
|
||||
<i className='fas fa-circle' />
|
||||
<i className='fas fa-circle' />
|
||||
<i className='fas fa-circle' />
|
||||
</div>
|
||||
</div>
|
||||
</>;
|
||||
},
|
||||
|
||||
render : function(){
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
.divider{
|
||||
display : table;
|
||||
height : 100%;
|
||||
width : 12px;
|
||||
width : 15px;
|
||||
cursor : ew-resize;
|
||||
background-color : #bbb;
|
||||
text-align : center;
|
||||
@@ -32,4 +32,25 @@
|
||||
background-color: #999;
|
||||
}
|
||||
}
|
||||
.arrow{
|
||||
position : absolute;
|
||||
width : 25px;
|
||||
height : 25px;
|
||||
border : 2px solid black;
|
||||
border-radius : 15px;
|
||||
text-align : center;
|
||||
font-size : 1.2em;
|
||||
cursor : pointer;
|
||||
background-color : #bbb;
|
||||
z-index : 999;
|
||||
&.left{
|
||||
top : 30px;
|
||||
}
|
||||
&.right{
|
||||
top : 60px;
|
||||
}
|
||||
&:hover{
|
||||
background-color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user