📚 Backstage Magazine Archive

A modern, interactive web archive for Backstage, a contemporary cosmopolitan magazine, inspired by Frontend Practice's Backstage Talks exercise.

View Live Demo | Report Bug | Request Feature

✨ Features

• 🔄 Smooth Scroll Transitions - Seamless color transitions between magazine issues
• 📏 CSS Scroll Snap - Precise, controlled scrolling between sections
• 🎨 Dynamic Color Palette

  Teal   (#00c1b5) 
  Orange (#ff651a) 
  Yellow (#ffbe00) 
  Blue   (#1d3fbb)
  Red    (#e30512) 
  Pink   (#ff608c)
  

• 📱 Responsive Design - Adapts smoothly from desktop to mobile
• 📍 Fixed Content Positioning - Key elements remain accessible while scrolling
• 🎯 Minimal, Clean Layout - Focus on content with an uncluttered design

🛠️ Technologies Used

• HTML5 - Semantic markup
• CSS3
  • Flexbox & CSS Grid
  • CSS Custom Properties
  • Media Queries
• jQuery Libraries
  • in-view - Viewport detection
  • jQuery scrollie - Scroll effects

📁 Project Structure

backstage/
├── 📄 index.html
├── 📄 index.css
├── 📂 scripts/
│   ├── 📄 in-view.min.js
│   └── 📄 jquery.scrollie.min.js
├── 📂 assets/
│   └── ...
└── 📄 README.md

📱 Responsive Behavior

Device	Behavior
Desktop	Full-screen magazine covers with snap scrolling
Mobile	Adjusted layout with modified scroll behavior and resized images

🌐 Browser Support

✅ Chrome (latest)
✅ Safari (latest) ✅ Firefox (latest) ✅ Edge (latest)

📄 License

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

👏 Acknowledgments

• Original design inspiration: Frontend Practice
• Backstage Talks Magazine website

👨‍💻 Author

Jekayin-Oluwa
GitHub: j-rayx

---

Found this project useful? Give it a ⭐!