37 lines
760 B
TypeScript
37 lines
760 B
TypeScript
import React, { FC, ReactNode } from "react";
|
|
import styled, { css } from "styled-components";
|
|
import CSS from "csstype";
|
|
|
|
interface TextAlignWrapperProps {
|
|
children: ReactNode | null;
|
|
style?: CSS.Properties;
|
|
align: "left" | "center" | "right";
|
|
marginBottom?: boolean;
|
|
}
|
|
|
|
const TextAlignWrapper: FC<TextAlignWrapperProps> = ({
|
|
children,
|
|
style,
|
|
align = "left",
|
|
marginBottom = true,
|
|
}) => {
|
|
return (
|
|
<StyledDiv style={style} align={align} marginBottom={marginBottom}>
|
|
{children}
|
|
</StyledDiv>
|
|
);
|
|
};
|
|
|
|
export { TextAlignWrapper };
|
|
|
|
const StyledDiv = styled.div<TextAlignWrapperProps>`
|
|
text-align: ${(props) => props.align};
|
|
width: 100%;
|
|
|
|
${(props) =>
|
|
props.marginBottom &&
|
|
css`
|
|
margin-bottom: 0.7rem;
|
|
`}
|
|
`;
|