first commit

This commit is contained in:
Afiq 2025-05-26 16:17:02 +08:00
commit d44c704659

157
README.md Normal file
View File

@ -0,0 +1,157 @@
# Corrad UI 2025 🚀
A modern, feature-rich UI component library built with Nuxt 3, designed for creating beautiful and responsive web applications. Corrad UI combines the power of Vue 3 with the flexibility of Tailwind CSS to deliver a seamless development experience.
![Nuxt 3](https://img.shields.io/badge/Nuxt-3-00DC82?style=for-the-badge&logo=nuxt.js&logoColor=white)
![Vue 3](https://img.shields.io/badge/Vue-3-4FC08D?style=for-the-badge&logo=vue.js&logoColor=white)
![Tailwind CSS](https://img.shields.io/badge/Tailwind-CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white)
![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white)
## ✨ Features
- 🎨 **25+ Modern UI Components** - From basic buttons to complex data tables
- 🌓 **Light/Dark Theme** - Built-in theme switching capability
- 🌐 **RTL Support** - Full Right-to-Left layout support
- 📱 **Responsive Design** - Mobile-first approach for all components
- 🔧 **Customizable** - Easy to customize with Tailwind CSS
- 📝 **Form Handling** - Integrated FormKit with custom styling
- 🎯 **TypeScript Support** - Full type safety and better DX
- ⚡ **Auto-imports** - Zero-config component importing
## 🎯 Components
<details>
<summary>View Component List</summary>
- **Layout**
- Accordion
- Card
- Modal
- Tabs
- Separator
- **Data Display**
- Table
- Data Table
- Avatar
- Badge
- Progress
- **Navigation**
- Breadcrumb
- Dropdown
- Context Menu
- Stepper
- **Feedback**
- Alert
- Toast
- Tooltip
- Hover Card
- Popover
- **Media**
- Carousel
- Skeleton
- **Utils**
- Scroll Area
- Theme Switcher
- Button
</details>
## 🚀 Getting Started
### Prerequisites
- Node.js 16.x or later
- pnpm (recommended) or npm
### Installation
```bash
# Clone the repository
git clone https://github.com/corrad-software/corrad-2025.git
# Navigate to project directory
cd corrad-2025
# Install dependencies
pnpm install
```
### Development
```bash
# Start development server
pnpm dev
# Build for production
pnpm build
# Preview production build
pnpm preview
```
## 📖 Documentation
Each component comes with comprehensive documentation and examples:
- Basic usage
- Props API
- Events
- Customization options
- Live examples
## 🎨 Customization
### Tailwind Configuration
Customize the design system by modifying `tailwind.config.js`:
```js
module.exports = {
theme: {
extend: {
colors: {
// Your custom colors
},
// Other theme extensions
}
}
}
```
### FormKit Theme
Customize form elements through `formkit.theme.js`.
## 🛠️ Project Structure
```
corrad-2025/
├── components/ # UI Components
├── composables/ # Vue composables
├── layouts/ # Page layouts
├── pages/ # Application routes
├── plugins/ # Nuxt plugins
├── stores/ # State management
├── assets/ # Static assets
├── public/ # Public files
└── server/ # Server-side code
```
## 🤝 Contributing
Contributions are welcome! Please read our contributing guidelines before submitting pull requests.
## 📄 License
This project is licensed under the MIT License - see the LICENSE file for details.
## 🙏 Acknowledgments
- Built with [Nuxt 3](https://nuxt.com)
- Styled with [Tailwind CSS](https://tailwindcss.com)
- Forms powered by [FormKit](https://formkit.com)