# Dwi Bakti N Dev - GitHub UI Design

## Overview
This document outlines the UI design for the Dwi Bakti N Dev GitHub project. The design focuses on simplicity, usability, and responsiveness.

---

## UI Components

### 1. Header
- **Logo**: Positioned on the left, clickable to return to the homepage.
- **Navigation Menu**: Includes links to "Home", "Projects", "About Us", and "Contact".
- **Search Bar**: Positioned on the right for quick access to repositories.

### 2. Sidebar
- **Profile Section**: Displays user avatar, name, and bio.
- **Repository List**: A scrollable list of repositories with filters for language and stars.

### 3. Main Content
- **Repository Overview**: Displays repository name, description, and key stats (stars, forks, issues).
- **Tabs**: Includes "Code", "Issues", "Pull Requests", "Actions", and "Wiki".
- **File Explorer**: Shows the directory structure of the repository.

### 4. Footer
- **Links**: Includes "Privacy Policy", "Terms of Service", and "Help".
- **Social Media Icons**: Links to GitHub, Twitter, and LinkedIn.

---

## Color Palette
- **Primary**: #0366d6 (GitHub blue)
- **Secondary**: #24292e (Dark gray)
- **Background**: #f6f8fa (Light gray)
- **Text**: #24292e (Dark gray)

---

## Typography
- **Font Family**: "Roboto", sans-serif
- **Heading Font Size**: 24px
- **Body Font Size**: 16px

---

## Responsive Design
- **Mobile View**: Collapsible sidebar and navigation menu.
- **Tablet View**: Two-column layout with sidebar and main content.
- **Desktop View**: Full layout with all components visible.

---

## Mockup
![UI Mockup](https://via.placeholder.com/800x600?text=UI+Mockup)

---

## Contributors
- **Dwi Bakti**: Lead Designer
- **N Dev**: Frontend Developer

---

## License
This project is licensed under the MIT License.