attendant/src/stories/utilities/SpaceBetweenContainer.tsx

34 lines
698 B
TypeScript

import React, { FC, ReactNode } from "react";
import styled, { css } from "styled-components";
import CSS from "csstype";
interface SpaceBetweenContainerProps {
children: ReactNode | null;
style?: CSS.Properties;
width100pct?: boolean;
}
const SpaceBetweenContainer: FC<SpaceBetweenContainerProps> = ({
children,
style,
width100pct = true,
}) => {
return (
<StyledDiv style={style} width100pct={width100pct}>
{children}
</StyledDiv>
);
};
export default SpaceBetweenContainer;
const StyledDiv = styled.div<SpaceBetweenContainerProps>`
display: flex;
justify-content: space-between;
${(props) =>
props.width100pct &&
css`
width: 100%;
`}
`;