Conditional CSS with styled tag

## Ask your Question

Is it possible to do something like the following?

```
const TopLevelList = styled.ul<{ dark?: boolean }>`
border-top: 1px solid ${BrandColors.BORDER};
margin-top: 0;

${props => props.dark && ({
color: 'black',
})}
`;
```

Typescript is giving the following error:

```
Argument of type '(props: { dark?: boolean | undefined; }) => false | { color: string; } | undefined' is not assignable to parameter of type 'string | number | CSSProperties | ((props: { dark?: boolean | undefined; }) => TLength)'.
Type '(props: { dark?: boolean | undefined; }) => false | { color: string; } | undefined' is not assignable to type '(props: { dark?: boolean | undefined; }) => TLength'.
Type 'false | { color: string; } | undefined' is not assignable to type 'TLength'.
Type 'undefined' is not assignable to type 'TLength'.ts(2345)
```