Theme Configuration

Dropdown Component Instructions

"This is a custom dropdown component that you can easily modify according to your preferences using your own CSS classes."

Position: Specify where the dropdown should appear upon opening (e.g., "top", "bottom", "left", "right").

Trigger: Determine how the dropdown will be activated—by "click" or "hover".

Dropdown Class Name: To apply a custom class to the dropdown component, use the prop DropdownClassName="your-class-name" .

Button Class Name: To customize the appearance of the dropdown button, utilize the prop colorclass="your-class-name".

Menu Class Name: For styling the dropdown menu with a unique class, pass it using the prop menuclass="your-class-name".

You can place show the custom dropdown code in the file located at src/components/CustomComponents/Dropdown/Dropdown.jsx.

Example
<Dropdown trigger="click" dropdownClassName="dropdown">
    <DropdownButton colorclass="flex items-center gap-2 btn-green btn" arrow={true}> Green Option</DropdownButton>
    <DropdownMenu menuclass="px-0 item-center">
        {data.map((item) => (
          <Link href="#" className={`dropdown-item dropdown-green`} key={item.id}> {item.text}</Link> ))}
    </DropdownMenu>
</Dropdown>

This guide covers everything you need to know to make sure Tailwind generates all of the CSS needed for your project.

Receive the latest updates directly in your inbox!

Be the first to know about new updates and exclusive discounts. No spam, just great offers!

How about

A Custom Project?

With over 7 years of experienced team, we specialize in delivering custom projects for startups, blue-chip companies, and government agencies. We have successfully completed over 250+ projects, providing tailored solutions that meet the unique needs of each client.

Hire Us
Domiex Admin & Dashboards
230+

Total Pages

5+

Layouts

11+

Application

We provide quick support withing one business day to all of our customers.

© Domiex Created & Crafted by SRBThemes.