Add collapse all/expand all to Listcontrol (#912)

This commit is contained in:
Christian Nolte
2017-12-22 22:30:05 +01:00
committed by Shawn Erquhart
parent 8849953b50
commit 6ca9c04105
8 changed files with 75 additions and 48 deletions

View File

@ -22,7 +22,10 @@ const config = {
'arrow': {
direction: 'left',
},
'caret': {
'chevron': {
direction: 'down',
},
'chevron-double': {
direction: 'down',
}
};

View File

@ -2,8 +2,9 @@ import iconAdd from './add.svg';
import iconAddWith from './add-with.svg';
import iconArrow from './arrow.svg';
import iconBold from './bold.svg';
import iconCaret from './caret.svg';
import iconCheck from './check.svg';
import iconChevron from './chevron.svg';
import iconChevronDouble from './chevron-double.svg';
import iconCircle from './circle.svg';
import iconClose from './close.svg';
import iconCode from './code.svg';
@ -43,8 +44,9 @@ const images = {
'add-with': iconAddWith,
'arrow': iconArrow,
'bold': iconBold,
'caret': iconCaret,
'check': iconCheck,
'chevron': iconChevron,
'chevron-double': iconChevronDouble,
'circle': iconCircle,
'close': iconClose,
'code': iconCode,

View File

@ -0,0 +1,8 @@
<svg viewBox="0 0 24 24">
<g id="caret" transform="translate(2.000000, 3.000000)" fill-rule="nonzero">
<polygon points="3.1231456 0.32943568 0.86323447 2.46718624 9.5186981 11.6172615 18.8632345 2.5123409 16.6923073 0.28428102 9.6090173 7.1859389"/>
</g>
<g id="caret" transform="translate(2.000000, 10.000000)" fill-rule="nonzero">
<polygon points="3.1231456 0.32943568 0.86323447 2.46718624 9.5186981 11.6172615 18.8632345 2.5123409 16.6923073 0.28428102 9.6090173 7.1859389"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 511 B

View File

Before

Width:  |  Height:  |  Size: 184 B

After

Width:  |  Height:  |  Size: 184 B

View File

@ -15,7 +15,7 @@ export const ListItemTopBar = ({ collapsed, onCollapseToggle, onRemove, dragHand
{
onCollapseToggle
? <button className="nc-listItemTopBar-toggleButton" onClick={onCollapseToggle}>
<Icon type="caret" size="small" direction={collapsed ? 'up' : 'down'}/>
<Icon type="chevron" size="small" direction={collapsed ? 'up' : 'down'}/>
</button>
: null
}