Dashboard - Copy this React, Tailwind Component to your project

**Project Brief: Community Platform Dashboard for 'Diasporan'** I’m looking to design a clean and organized community platform dashboard UI for a service called **Diasporan**, which supports immigrants settling into the UK. Below are the detailed requirements for the layout and design: ### **General Design Requirements:** 1. **Style**: - The overall design should be **minimalist**, clean, and user-friendly. - Use a **white background** with **light blue accents** to keep the interface professional, calm, and inviting. - **Typography** should be simple, clear, and readable. 2. **Target Users**: - The platform is geared towards new immigrants, so the UI should be welcoming, accessible, and easy to navigate. - The dashboard should provide easy access to critical resources and encourage community interaction. ### **Layout and Features:** 1. **Left Sidebar (Navigation Panel)**: - This should be prominently positioned on the left side, allowing users to navigate between different sections of the platform. - Include the following items with relevant icons: - **Community Feed** (this will be the default view and should be highlighted when active). - **Employment Support**. - **Healthcare System**. - **Finance Management**. - **Administrative Processes**. - **Immigration Policies**. - **Community Forum**. - **Marketplace**. 2. **Top Bar (Header)**: - Display a **personalized welcome message** at the top of the screen, such as "Welcome back, [User’s Name]!". - On the right side of this top bar, include a **search bar** with a placeholder text (“Search Diasporan...”) and icons for **notifications** (e.g., an envelope icon for messages) and **account settings** (e.g., a user profile icon). 3. **Main Content Area**: - The main content area will consist of three tabs at the top: **Community Feed** (selected by default), **Resources**, and **Upcoming Events**. - In the **Community Feed**, users will see posts in card format from other community members. The posts should include: - The poster's name. - Time posted (e.g., “2 hours ago”). - Content (such as text or images). - Options for users to **Like**, **Comment**, and **Share** each post. - Example post content: - **Sarah Johnson** posts about setting up a bank account with Monzo and offers advice. - **Mike Brown** announces a meetup for new immigrants in London. 4. **Right Panel**: - Add a section for **Quick Links** to essential services such as: - **Find a Job**. - **Housing Resources**. - **Language Exchange**. - **Legal Advice**. - Include sections for: - **Trending Topics** with relevant hashtags. - **Community Stats** (e.g., total number of users, active discussions). ### **Design Elements**: 1. **Post Structure**: - The posts in the Community Feed should have a card-like structure with enough spacing to prevent clutter. - Incorporate buttons (e.g., Like, Comment, Share) that are easily recognizable and accessible. 2. **Use of Icons and Imagery**: - Use simple, meaningful icons for navigation links, actions, and features. - Where applicable, use placeholders for user profile images (e.g., a generic avatar). 3. **Mobile Responsiveness**: - Ensure the design is mobile-responsive and can be adapted to different screen sizes without losing clarity or functionality. 4. **Color Palette**: - **Primary color**: Light blue for accents, tabs, buttons, and highlights. - **Background**: White for a clean, professional feel. - **Text**: Black or dark grey for readability. --- Let me know if any further details are needed or if you'd like additional specifications!