Skip to content

refactor: migrate to React Router and modularize component architecture#5

Merged
rivka14 merged 9 commits intomy-featurefrom
feature/improve-interface
Jan 25, 2026
Merged

refactor: migrate to React Router and modularize component architecture#5
rivka14 merged 9 commits intomy-featurefrom
feature/improve-interface

Conversation

@rivka14
Copy link
Collaborator

@rivka14 rivka14 commented Jan 25, 2026

Summary

This PR introduces comprehensive UI/UX improvements to the BeSafe application, including:

  • React Router Integration: Added routing support for better navigation flow
  • Component Refactoring: Modernized Login, Navbar, and home page components
  • CSS Modules Migration: Converted to CSS modules for better style isolation
  • Responsive Design: Enhanced mobile, tablet, and desktop support
  • Visual Improvements: Updated styling with modern aesthetics, animations, and transitions

Changes

Features

  • ✨ Add React Router navigation and improve app structure
  • ✨ Add LoginPage component with CSS modules

Refactoring

  • ♻️ Improve Login component with routing and context integration
  • ♻️ Update global styles and app styling

Styling

  • 💄 Enhance Navbar with improved styling and responsive design
  • 💄 Redesign home page sections with modern UI improvements
  • 💄 Update HeroSection, AboutSection, and DemoSection

Maintenance

  • 🧹 Remove build artifacts
  • 🧹 Remove node_modules from git tracking

Files Changed

  • client/src/App.jsx - Added routing and navigation
  • client/src/index.jsx - Wrapped with Router
  • client/src/pages/Login.jsx - Refactored with context integration
  • client/src/pages/LoginPage.jsx - New login page component
  • client/src/components/layout/Navbar.jsx - Enhanced responsive design
  • client/src/components/home/* - Redesigned all home sections
  • client/src/styles/* - Updated global styles and modules

Test Plan

  • Test login flow with Google OAuth
  • Verify navigation between pages works correctly
  • Check responsive design on mobile, tablet, and desktop
  • Ensure all home page sections render properly
  • Verify styling consistency across components

🤖 Generated with Claude Code

rivka14 and others added 9 commits January 22, 2026 21:47
- Integrate React Router with useNavigate in App.jsx
- Add Router wrapper in index.jsx for routing support
- Update login flow to use navigation instead of conditional rendering
- Add loading state for user authentication check

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Add React Router navigation support
- Integrate GameContext for centralized state management
- Convert Login.css to CSS modules (Login.module.css)
- Improve authentication flow with navigation
- Clean up Google OAuth integration

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Add comprehensive responsive breakpoints for mobile/tablet/desktop
- Improve visual hierarchy with better spacing and typography
- Enhance button and link hover effects
- Add smooth transitions and animations
- Update navbar component structure for better maintainability

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Enhance HeroSection with improved layout and visual effects
- Redesign AboutSection with better content structure
- Update DemoSection styling with modern aesthetics
- Add responsive design improvements across all sections
- Improve typography and spacing consistency
- Add smooth animations and transitions

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Enhance global CSS with modern design tokens and variables
- Update App.module.css with improved layout and spacing
- Add new color schemes and theme support
- Improve typography scale and consistency
- Add utility classes for common patterns

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Delete build error and output files

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Create new LoginPage component with routing support
- Add Login.module.css for modular styling
- Remove unnecessary hakathon file

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
- Remove accidentally tracked node_modules files
- These files are already in .gitignore

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@rivka14 rivka14 changed the title UI/UX improvements: redesign interface with React Router and modern styling Improvements: redesign interface with React Router and modern styling Jan 25, 2026
@rivka14 rivka14 changed the title Improvements: redesign interface with React Router and modern styling refactor: migrate to React Router and modularize component architecture Jan 25, 2026
@rivka14 rivka14 merged commit 2185231 into my-feature Jan 25, 2026
0 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant