mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-01-07 09:52:41 +00:00
Add divider buttons
This commit is contained in:
@@ -85,13 +85,25 @@ const SplitPane = createClass({
|
|||||||
},
|
},
|
||||||
*/
|
*/
|
||||||
renderDivider : function(){
|
renderDivider : function(){
|
||||||
return <div className='divider' onMouseDown={this.handleDown} >
|
return <>
|
||||||
<div className='dots'>
|
<div className='arrow left'
|
||||||
<i className='fas fa-circle' />
|
style={{ left: this.state.currentDividerPos-4 }}
|
||||||
<i className='fas fa-circle' />
|
onClick={()=>console.log('left')} >
|
||||||
<i className='fas fa-circle' />
|
<i className='fas fa-arrow-left' />
|
||||||
</div>
|
</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(){
|
render : function(){
|
||||||
|
|||||||
@@ -13,7 +13,7 @@
|
|||||||
.divider{
|
.divider{
|
||||||
display : table;
|
display : table;
|
||||||
height : 100%;
|
height : 100%;
|
||||||
width : 12px;
|
width : 15px;
|
||||||
cursor : ew-resize;
|
cursor : ew-resize;
|
||||||
background-color : #bbb;
|
background-color : #bbb;
|
||||||
text-align : center;
|
text-align : center;
|
||||||
@@ -32,4 +32,25 @@
|
|||||||
background-color: #999;
|
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