diff --git a/README.md b/README.md index 26a7fe6..97b682a 100644 --- a/README.md +++ b/README.md @@ -4,11 +4,11 @@ This document details the complete modernization of the Biohazard VFX website from a static HTML/CSS/JavaScript site to a modern Next.js application with React, TypeScript, and a full content management system. -**Date**: August 7, 2025 +**Date**: August 15, 2025 **Original Site**: Static HTML/CSS/JS in `/BiohazardVFX_Website` -**New Site**: Next.js app in `/BiohazardVFX_Website/nextjs-app` +**New Site**: Next.js app in `/BiohazardVFX_Website/biohazard-vfx` -## πŸš€ What Was Accomplished +## What Was Accomplished ### 1. **Complete Technology Stack Upgrade** @@ -50,7 +50,7 @@ This document details the complete modernization of the Biohazard VFX website fr - Preserved original dark theme aesthetic - Smooth animations and transitions - Mobile-responsive design -- Improved navigation with blog section +- Improved navigation with left-side slide-in menu - Interactive team menu overlay ### 3. **Technical Improvements** @@ -74,10 +74,10 @@ This document details the complete modernization of the Biohazard VFX website fr - ARIA labels for accessibility - Semantic HTML structure -## πŸ“ Project Structure +## Project Structure ``` -nextjs-app/ +biohazard-vfx/ β”œβ”€β”€ src/ β”‚ β”œβ”€β”€ app/ # Next.js App Router pages β”‚ β”‚ β”œβ”€β”€ admin/ # Admin dashboard pages @@ -95,9 +95,9 @@ nextjs-app/ β”‚ β”‚ β”œβ”€β”€ layout.tsx # Root layout β”‚ β”‚ └── page.tsx # Homepage β”‚ β”œβ”€β”€ components/ # Reusable React components -β”‚ β”‚ β”œβ”€β”€ Navigation.tsx # Site navigation +β”‚ β”‚ β”œβ”€β”€ Navigation.tsx # Site navigation (updated) β”‚ β”‚ β”œβ”€β”€ HeroSection.tsx # Hero video section -β”‚ β”‚ β”œβ”€β”€ ProjectGrid.tsx # Project portfolio grid +β”‚ β”‚ β”œβ”€β”€ ProjectsGrid.tsx # Project portfolio grid β”‚ β”‚ β”œβ”€β”€ TeamMenu.tsx # Team overlay menu β”‚ β”‚ β”œβ”€β”€ Footer.tsx # Site footer β”‚ β”‚ └── Providers.tsx # Auth providers @@ -127,15 +127,15 @@ nextjs-app/ ### Starting the Development Server ```bash -cd /home/Nicholai/Nextcloud/Dev/BiohazardVFX_Website/nextjs-app +cd /home/Nicholai/Nextcloud/Dev/BiohazardVFX_Website/biohazard-vfx npm run dev ``` -The site will be available at: http://localhost:3005 +The site will be available at: http://localhost:3000 ### Accessing the Admin Dashboard -1. **Navigate to**: http://localhost:3005/admin/login +1. **Navigate to**: http://localhost:3000/admin/login 2. **Login with**: - Email: `admin@biohazardvfx.com` - Password: `admin123` @@ -166,7 +166,7 @@ npm run build npm start ``` -## πŸ—ΊοΈ Site Map +## Site Map ### Public Pages - **/** - Homepage with hero video, about, projects, team, crew sections @@ -205,6 +205,15 @@ All 8 projects from the original site have been preserved: - FAQ data from `written/faq.json` - All project credits and info files maintained +## Recent Improvements + +### Navigation System (August 2025) +- **Redesigned Navigation**: Replaced the full-screen overlay menu with a sleek left-side sliding panel +- **Less Intrusive**: The new navigation slides in from the left and only covers a portion of the screen +- **Improved UX**: Added backdrop blur, outside click detection, and keyboard escape functionality +- **Consistent Design**: Matches the site's dark theme with subtle borders and proper spacing +- **Better Mobile Experience**: More compact and easier to use on mobile devices + ## πŸ“‹ What Needs to Be Done Next ### High Priority @@ -274,7 +283,7 @@ All 8 projects from the original site have been preserved: - Create API documentation - Write deployment guide -## πŸš€ Deployment Considerations +## Deployment Considerations ### Environment Variables Create a `.env.production` file with: @@ -300,7 +309,7 @@ WEB3FORMS_ACCESS_KEY="your-web3forms-key" - Optimize image delivery - Implement proper caching headers -## 🎯 Summary +## Summary The Biohazard VFX website has been successfully modernized from a static site to a dynamic, database-driven Next.js application. The new architecture provides: