UI Components Library

A modern UI components library featuring interactive buttons, modals, and accordions with smooth animations, theme toggles (Dark Mode & Night Light Mode), and customizable styles.

---

📌 Features

✅ Reusable UI components (Buttons, Modals, Accordions)
✅ Smooth animations & transitions
✅ Dark Mode & Night Light Mode
✅ Shake Button for fun interaction
✅ Customizable styles with CSS variables
✅ Fully responsive design

---

📌 Installation & Setup

1️⃣ Clone the repository

git clone https://github.com/your-username/UI-Components-Library.git
cd UI-Components-Library

2️⃣ Open the project

Simply open the index.html file in your browser.

3️⃣ (Optional) Start a local server

If you want to run a live server:

npx live-server

OR

python -m http.server 8000

Then visit: http://localhost:8000

---

📌 File Structure

📁 UI-Components-Library
│── 📁 styles
│   ├── main.css
│   ├── components
│   │   ├── buttons.css
│   │   ├── modals.css
│   │   ├── accordions.css
│── 📁 js
│   ├── components
│   │   ├── buttons.js
│   │   ├── modals.js
│   │   ├── accordions.js
│── index.html
│── README.md

---

📌 Usage

🖱 Buttons

• Primary Button: Shows an alert message.
• Shake Button: Makes all buttons shake.
• Night Light Mode: Applies a warm filter to reduce eye strain.

📝 Modals

• Click "Open Modal" to display the pop-up window.
• Click the X button to close the modal.

📑 Accordions

• Click on any Accordion section to expand/collapse it.

---

📌 Customization

You can modify the design by editing styles/main.css and component-specific styles inside styles/components/.

For example, change button colors:

:root {
    --primary-color: #4A90E2;
    --secondary-color: #195b9e;
}

---

📌 Contributing

Contributions are welcome! Feel free to fork the repository, create a new branch, and submit a pull request.

1. Fork the project
2. Create a new branch (git checkout -b feature-branch)
3. Make your changes
4. Commit (git commit -m "Added new feature")
5. Push (git push origin feature-branch)
6. Open a Pull Request

---

📌 License

This project is licensed under the MIT License.

📜 Feel free to modify and use it for your own projects!

---