Modern Company Dashboard - Copy this Html, Tailwind Component to your project
Create a sleek and modern website layout with interactive animations and smooth transitions. The design should be visually appealing, user-friendly, and dynamic. Layout Details: 1. Header Section: • Place the company name at the top in bold, modern typography with a subtle fade-in animation when the page loads. 2. Two Adjacent Cards Below the Header: • Right Card: Display the company logo with a hover effect (e.g., slight zoom-in or shadow animation). • Left Card: Show the company sector and ticker symbol with a slide-in animation from the left. 3. Three Key Info Cards Below: • Arrange three cards horizontally with smooth hover effects (e.g., background color change or bounce effect). The cards should display: • Card 1: Eligibility Date for distribution. • Card 2: Distribution Date. • Card 3: Share Value per stock. 4. Historical Distribution Table: • Place a responsive table below the cards to show previous distribution details. • Columns: Year, Quarters (Q1, Q2, Q3, Q4). • Rows: Corresponding data for each quarter. • Add a smooth scroll animation to reveal rows as the user scrolls down. Style and Animation Guidelines: • Use a minimalistic and clean color scheme (e.g., white, gray, and one accent color). • Apply subtle animations, such as fading, sliding, or scaling, for transitions. • Include interactive elements like tooltips or pop-ups on hover for additional details. • Optimize for both desktop and mobile views with responsive design.
