Dashboard Component - Copy this Angular, Tailwind Component to your project
Create-and-design-an-Angular-component-for-a-dashboard-with-the-following-features:-1.-Welcoming-Card-At-the-top-of-the-dashboard,-include-a-card-with-a-welcoming-message-such-as:-Hello-[User],-welcome-to-your-TalentFlow-dashboard.-Dynamically-replace-[User]-with-the-employee's-name.-The-card-should-be-visually-appealing-and-positioned-prominently.-2.-Calendar-with-Events-Add-a-calendar-to-the-dashboard-that-displays-a-list-of-events.-Each-event-should-have:-A-start-date-and-end-date.-Details-displayed-as-event-labels-on-the-corresponding-calendar-dates.-Users-should-be-able-to-view-all-events-directly-on-the-calendar.-3.-Leave-Balance-Information-Beside-the-calendar,-display-a-section-for-leave-balance-details.-Show-the-remaining-leave-days-for-each-leave-type-(e.g.,-SICK,-ANNUAL,-CASUAL).-Present-the-leave-balance-in-a-structured-and-organized-format,-highlighting:-Leave-Type.-Total-Days.-Remaining-Days.-4.-Responsive-Design-Ensure-the-layout-is-responsive,-with-the-calendar-taking-up-the-majority-of-the-width-(e.g.,-60%)-and-the-leave-balance-section-taking-the-remaining-space-(e.g.,-40%).-Adapt-the-design-for-smaller-screens-by-stacking-the-calendar-and-leave-balance-section-vertically.-5.-Optional-Enhancements-Add-color-coded-indicators-on-the-calendar-for-different-event-types.-Provide-tooltips-or-modals-with-more-details-when-clicking-on-an-event.-The-component-should-offer-an-intuitive-and-clean-interface,-making-it-easy-for-employees-to-track-their-events-and-monitor-their-leave-balances.
