geeks-ui-framework/README.md

A modern, lightweight CSS framework with 15+ components for developers. Build beautiful interfaces with minimal effort.

# Geeks UI Framework v2.0

[![npm version](https://img.shields.io/npm/v/geeks-ui-framework.svg)](https://www.npmjs.com/package/geeks-ui-framework)
[![npm downloads](https://img.shields.io/npm/dm/geeks-ui-framework.svg)](https://www.npmjs.com/package/geeks-ui-framework)
[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
[![GitHub release](https://img.shields.io/github/release/Geeks-UI-Css-Framework/Geeks_UI.svg)](https://github.com/Geeks-UI-Css-Framework/Geeks_UI/releases)

A modern, lightweight CSS framework with 15+ components for developers. Build beautiful interfaces with minimal effort.

## 🚀 Quick Start

### NPM Installation
```bash
npm install geeks-ui-framework@2.0.0
```

### CDN
```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/geeks-ui-framework@2.0.0/dist/geeks-ui.min.css">
```

### Download
Download the latest release from our [GitHub repository](https://github.com/Geeks-UI-Css-Framework/Geeks_UI/releases).

## 📖 Usage

### Import in your project

#### CSS
```css
@import 'geeks-ui-framework/dist/geeks-ui.css';
```

#### HTML
```html
<link rel="stylesheet" href="node_modules/@geeksui/framework/dist/geeks-ui.min.css">
```

#### JavaScript/TypeScript
```js
import '@geeksui/framework/dist/geeks-ui.css';
```

### Components

#### Alerts
```html
<div class="alert alert-primary">Primary alert</div>
<div class="alert alert-warning">Warning alert</div>
<div class="alert alert-success">Success alert</div>
```

#### Buttons
```html
<button class="btn btn-primary">Primary</button>
<button class="btn btn-secondary">Secondary</button>
<button class="btn btn-outline-primary">Outline</button>
```

#### Layout
```html
<div class="container">
  <h1>Your content here</h1>
</div>
```

## 🎨 Customization

Override CSS variables to customize the framework:

```css
:root {
  --geeks-ui-primary: #your-color;
  --geeks-ui-secondary: #your-color;
  /* Override any variable */
}
```

## 📦 What's Included

```
@geeksui/framework/
├── dist/
│   ├── geeks-ui.css
│   └── geeks-ui.min.css
├── src/
│   ├── variables.css
│   ├── alerts.css
│   ├── buttons.css
│   ├── layout.css
│   ├── navigation.css
│   └── footer.css
└── package.json
```

## 🌐 Browser Support

- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)

## 📄 License

MIT © [Joey Cadieux](https://tech-center.com)

## 🤝 Contributing

1. Fork the repository
2. Create your feature branch: `git checkout -b feature/amazing-feature`
3. Commit your changes: `git commit -m 'Add amazing feature'`
4. Push to the branch: `git push origin feature/amazing-feature`
5. Open a Pull Request

## 📧 Support

- 📧 Email: joey@tech-center.com
- 🐙 GitHub: [Issues](https://github.com/Geeks-UI-Css-Framework/issues)
- 🌐 Website: [tech-center.com](https://tech-center.com)