Myrae UI Library

Welcome to the Myrae UI Library! This library provides a collection of reusable UI components designed to help you build modern web applications for MyRae.

Available Components

Our library includes the following components:

• Button: A versatile button component with customizable styles.
• Navigator: A navigation component for seamless user experience.
• Footer: A customizable footer for your application.
• Logo: Display your brand logo effortlessly.
• Spacing: Control the spacing between elements with precision.
• Headings: Consistent heading styles for your application.
• Paragraphs: Standardized paragraph styles for improved readability.
• Grid: A flexible grid layout component.
• ContentBlock: For organizing content in distinct blocks.
• Contact Form: A striking banner to highlight key content.
• Meet Expert Block: A striking banner to highlight key content.
• Service Image Block: A striking banner to highlight key content.
• About Component: A striking banner to highlight key content.
• Testimonials: A striking banner to highlight key content...

How to Use Our Package

To get started with the Myrae UI Library, follow these steps:

Installation

1. Install the package:

   npm install @codingmonsters/lib-ui-myrae
   

2. **Configure Tailwind CSS: Add the following to your tailwind.config.js file:

       module.exports = {
       content: [
         "./node_modules/@codingmonsters/lib-ui-myrae/**/*.{js,jsx,ts,tsx}",
       ]
     }
   

3. **Import and use components:

    import { Button } from "@codingmonsters/lib-ui-myrae";
    export default function Home() {
      return (
        <div>
          <Button
          bgColorBtn="black"
          btnRadius="rounded-full"
          childrenBtn="Contact Us"
          />
        </div>
      );
    }