attendant/src/stories/Header3.tsx

31 lines
733 B
TypeScript

import React, { FC, ReactNode } from "react";
import styled from "styled-components";
import CSS from "csstype";
import { color, typography } from "../shared/styles";
export interface Header3Props {
children: ReactNode | null;
style?: CSS.Properties;
small?: boolean;
}
const Header3: FC<Header3Props> = ({ children, style, small }) => {
return (
<StyledHeader3 style={style} small={small}>
{children}
</StyledHeader3>
);
};
export { Header3 };
const StyledHeader3 = styled.h3<Header3Props>`
font-size: ${(props) =>
props.small ? typography.size.medium : typography.size.large};
font-family: ${typography.family.primary};
font-weight: ${typography.weight.regular};
color: ${color.white};
`;