List: implement right icon for list items.

master
Tom Hacohen 6 years ago
parent 85ac4da839
commit 68b38f115f

@ -26,13 +26,20 @@
outline: 0; outline: 0;
} }
.ListItem .ListIcon { .ListItem .ListIconLeft {
margin-left: 5px; margin-left: 5px;
margin-right: 20px; margin-right: 20px;
margin-top: 8px; margin-top: 8px;
margin-bottom: 8px; margin-bottom: 8px;
} }
.ListItem .ListIconRight {
margin-left: auto;
margin-right: 5px;
margin-top: 8px;
margin-bottom: 8px;
}
.ListItem-Item:hover { .ListItem-Item:hover {
background-color: rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1);
cursor: pointer; cursor: pointer;

@ -85,7 +85,11 @@ export const ListItem = pure((_props: any) => {
} = _props; } = _props;
const leftIconHolder = (leftIcon) ? ( const leftIconHolder = (leftIcon) ? (
<div className="ListIcon">{leftIcon}</div> <div className="ListIconLeft">{leftIcon}</div>
) : undefined;
const rightIconHolder = (rightIcon) ? (
<div className="ListIconRight">{rightIcon}</div>
) : undefined; ) : undefined;
let textHolder = primaryText; let textHolder = primaryText;
@ -105,6 +109,7 @@ export const ListItem = pure((_props: any) => {
{leftIconHolder} {leftIconHolder}
{textHolder} {textHolder}
{children} {children}
{rightIconHolder}
</ListItemRaw> </ListItemRaw>
); );
}); });

Loading…
Cancel
Save