Create Typography Component

[sanjaysah101]

Description

Develop a reusable Typography component for email templates, inspired by the Shadcn UI Typography component. This component will handle different text elements such as headings, paragraphs, and other textual content. It should allow for consistent styling across the email templates while adhering to the design specifications.

Reference

The component should follow the structure and flexibility offered by the Shadcn UI Typography component. You can review the reference documentation here: Shadcn Typography Component.

• https://github.com/ansopedia/web-app/blob/dev/src/components/ui/Typography/Typography.tsx

Tasks

• Implement the Typography Component:

  • Create a reusable Typography component that supports different text styles, including Heading, Paragraph, and Text.
  • Allow for customizable levels of headings (e.g., h1, h2, h3, etc.).

• Apply Consistent Styles:

  • Style the Typography component to match the Figma design and maintain consistency across the email templates.
  • Ensure that different text elements (e.g., headings, paragraphs) follow the same font sizes, weights, and line heights as per the design.

• Test the Component:

  • Test the Typography component in the React-Email preview to ensure it renders correctly across different email clients.
  • Ensure the component is responsive and accessible.