blob: ad7c092f9cfe7f728252ff55b35420181b87e314 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
import * as React from 'react';
import styled from 'styled-components';
import { colors } from '../../config.json';
import ImageView from './ImageView';
const Container = styled.div({
display: 'flex',
alignItems: 'center',
});
const Caption = styled.span((props: { open: boolean }) => ({
fontFamily: 'Open Sans',
fontSize: '15px',
fontWeight: 600,
lineHeight: '20px',
color: props.open ? colors.white : colors.white40,
[Container + ':hover &']: {
color: colors.white,
},
}));
const Chevron = styled(ImageView)({
[Container + ':hover &']: {
backgroundColor: colors.white,
},
});
interface IProps {
pointsUp: boolean;
onToggle?: () => void;
children: React.ReactText;
className?: string;
}
export default function ConnectionPanelDisclosure(props: IProps) {
return (
<Container className={props.className} onClick={props.onToggle}>
<Caption open={props.pointsUp}>{props.children}</Caption>
<Chevron
source={props.pointsUp ? 'icon-chevron-up' : 'icon-chevron-down'}
width={24}
height={24}
tintColor={colors.white40}
/>
</Container>
);
}
|