Configured Tailwindcss

[SudiptaPaul-31]

🚀 Configure TailwindCSS with Custom Theme

📌 Overview

This PR sets up TailwindCSS v4 as the primary styling framework for the project and configures a custom design theme.

The setup ensures consistent styling, scalable utility-first development, and proper dependency management.

---

resolves #5

✅ Changes Made

🔹 Tailwind Setup

• Installed tailwindcss, @tailwindcss/postcss, postcss, and autoprefixer
• Configured postcss.config.js for Tailwind v4
• Added @import "tailwindcss"; in src/index.css
• Verified Tailwind integration with Vite

🔹 Custom Theme Configuration

Updated tailwind.config.js with:

• primary color → #0F172A
• accent color → #6366F1
• Poppins as the default font family

🔹 Plugins Added

• @tailwindcss/forms
• @tailwindcss/typography

🔹 Global Styling

• Added base reset styles
• Integrated Google Fonts (Poppins)
• Ensured Tailwind utilities work across all components and routes

🔹 Dependency Management

• Committed package-lock.json to ensure consistent dependency versions across environments

---

🧪 Acceptance Criteria

• Tailwind utility classes work in all components
• Custom theme tokens (primary, accent, font-poppins) are accessible
• Forms and typography plugins are functional
• Project runs successfully with npm run dev

---

📷 Verification

Tailwind styling confirmed in development environment (localhost:5173).

---

🎯 Result

The project now uses a scalable, modern TailwindCSS setup with a centralized design system foundation.

[ayshadogo]

Hii @SudiptaPaul-31 Please fix the Lint workflow
thank you

[SudiptaPaul-31]

@ayshadogo Lint fixed
Please Check

[ayshadogo]

Nice work @SudiptaPaul-31

Thank you for your contribution