# Contributing to d@n tech Portfolio

Thank you for your interest in contributing to this web development portfolio project! This document provides guidelines for contributing.

## How to Contribute

1. **Fork the Repository** - Click the "Fork" button on GitHub to create your own copy.
2. **Clone Your Fork** - `git clone https://github.com/YOUR-USERNAME/webdev-site.git`
3. **Create a Feature Branch** - `git checkout -b feature/your-feature-name`
4. **Make Your Changes** - Follow the code style guidelines below.
5. **Test Your Changes** - Ensure the site builds and works across browsers.
6. **Commit Your Changes** - `git commit -m "Add your descriptive message"`
7. **Push to Your Fork** - `git push origin feature/your-feature-name`
8. **Open a Pull Request** - Navigate to the original repository and open a PR.

## Code Style Guidelines

Please adhere to the existing code style to maintain consistency:

### JavaScript
- Use ES6+ modules with `type="module"` in HTML
- Prefer `const` over `let`; avoid `var`
- Arrow functions for callbacks; named functions for top-level declarations
- CamelCase for variables/functions; PascalCase for classes
- Check element existence before DOM manipulation
- Use section headers: `// ===== SECTION NAME =====`

### CSS
- Use CSS Custom Properties defined in `:root` with semantic names
- CSS Nesting with `&` for nested selectors (modern browsers)
- Mobile-first media queries with `min-width`
- Support `prefers-color-scheme: dark` with variable overrides
- Kebab-case for class names

### HTML
- Semantic HTML5 elements (`<header>`, `<main>`, `<section>`)
- Include ARIA attributes where needed; proper heading hierarchy
- Use Bootstrap classes alongside custom styles
- `data-*` attributes for JavaScript hooks
- Lazy loading for images; defer non-critical scripts

## Testing

Before submitting a pull request, please verify:

1. **Build Success** - Run `npm run build` to ensure no errors
2. **Cross-Browser Compatibility** - Test in at least Firefox and Chrome
3. **Responsive Design** - Check mobile (375px) and desktop (1200px) views
4. **No Console Errors** - Open browser developer tools and ensure no errors
5. **Lighthouse Audit** - Run `npx lighthouse http://localhost:4173` for performance, accessibility, SEO, and best practices

## Reporting Issues

When reporting issues, please include:

- Steps to reproduce the issue
- Expected vs. actual behavior
- Browser and operating system information
- Screenshots if applicable

## Questions?

If you have questions, please open an issue or contact the maintainer via the portfolio site: [dev.dustin.coffee](https://dev.dustin.coffee/)

---

*Thank you for contributing!*