Implement ShadCN UI for Consistent and Modern Component Styling

[sakib-shunyeka]

Description: Our current UI uses a mix of custom and basic Tailwind components, leading to inconsistent design and repetitive styling. To improve maintainability, accessibility, and visual consistency across the app, we should integrate ShadCN UI as our base component system.

Tasks:

Install and configure ShadCN UI

Replace existing custom components (buttons, modals, inputs, alerts, etc.) with ShadCN equivalents

Ensure theme compatibility (light/dark mode)

Align component spacing, border radius, and typography with our design guidelines

Test all replaced components for responsiveness and accessibility

Benefits:

Unified design system with consistent styles

Faster development using prebuilt, accessible components

Easier theme customization and dark mode support

Reduced custom CSS overhead

References:

https://ui.shadcn.com/

ShadCN GitHub Repository

Priority: Medium

[Somilg11]

Hey @sakib-shunyeka assign this issue to me, i would like to contribute to it

[devvsakib]

@Somilg11 Assigned, GL

[devvsakib]

Hi @Somilg11 just wondering the estimate timeline to complete this task?

[Somilg11]

Yes @devvsakib , it will be completed by the end of the day