GDSC Website

A modern, responsive website for Google Developer Groups On Campus KARE built with React and Emotion.

✨ Features

• 🌓 Dark/Light theme support
• 🎨 Google's Material Design principles
• 📱 Fully responsive design
• 🚀 Smooth animations with Framer Motion
• 🎯 Interactive feature cards and team profiles
• 📝 Dynamic form handling
• 🖼️ Image carousel with fallback support

🛠️ Tech Stack

• React
• Emotion (Styled Components)
• Framer Motion
• Tailwind CSS
• Google Sans Font

🎨 Design System

The website follows Google's color palette and design principles:

Colors

• Primary Blues: #4285F4, #174EA6
• Reds: #EA4335, #A50E0E
• Yellows: #FBBC04
• Greens: #34A853, #0D652D

Typography

• Google Sans font for all text
• Responsive sizing
• Gradient text effects

🚀 Getting Started

1. Clone the repository:

git clone https://github.com/your-username/gdsc-website.git

2. Install dependencies:

cd gdsc-website
npm install

3. Start the development server:

npm run dev

📱 Responsive Design

The website is fully responsive with breakpoints at:

• Mobile: < 480px
• Tablet: < 768px
• Desktop: > 768px

🌓 Theme Support

The website supports both light and dark themes with automatic system preference detection. Theme colors are managed through CSS variables for easy customization.

🤝 Contributing

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

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• Google Developer Student Clubs
• Google Developer Groups
• React Community
• Framer Motion
• Emotion Team
• Kalasalingam Academy of Research and Education

📊 This Month's Contributions