Nemcio/SCM-Manager
1
0
Fork 0
mirror of https://github.com/scm-manager/scm-manager.git synced 2025-11-10 23:45:44 +01:00
Code Issues Packages Projects Releases Activity

Update behavior when optional props are not passed, Consistency towards two CardColumns established

Browse Source
This commit is contained in:
Florian Scholdei
2020-04-08 15:20:35 +02:00
parent bbcff0c9df
commit 825f5fcdb4
6 changed files with 177 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
scm-ui/ui-components/src/CardColumnSmall.tsx
View File

@@ -29,7 +29,7 @@ import { Link } from "react-router-dom";
type Props = {
link: string;
icon: ReactNode;
avatar?: ReactNode;
contentLeft: ReactNode;
contentRight: ReactNode;
footer?: ReactNode;
@@ -62,21 +62,24 @@ const StyledLink = styled(Link)`
}
`;
const IconWrapper = styled.figure`
const AvatarWrapper = styled.figure`
margin-right: 0.5rem;
`;
const CardColumnSmall: FC<Props> = ({ link, icon, contentLeft, contentRight, footer }) => {
const CardColumnSmall: FC<Props> = ({ link, avatar, contentLeft, contentRight, footer }) => {
const renderAvatar = avatar ? <AvatarWrapper className="media-left">{avatar}</AvatarWrapper> : null;
const renderFooter = footer ? <small>{footer}</small> : null;
return (
<StyledLink to={link}>
<div className="media">
<IconWrapper className="media-left">{icon}</IconWrapper>
{renderAvatar}
<FlexFullHeight className={classNames("media-content", "text-box", "is-flex")}>
<CenteredItems className="is-flex">
<ContentLeft>{contentLeft}</ContentLeft>
<ContentRight>{contentRight}</ContentRight>
</CenteredItems>
<small>{footer}</small>
{renderFooter}
</FlexFullHeight>
</div>
</StyledLink>