Welcome to the modernized version of Cplusplus.com 🎉! This project is a complete UI/UX overhaul of the original Cplusplus.com, featuring a sleek glassmorphism design, a dynamic sidebar, an interactive navbar, and an optimized content layout.
✅ Glassmorphism UI - A modern, blurred glass effect for a futuristic look.
✅ Responsive Sidebar - Collapsible with smooth animations and auto-closing on smaller screens.
✅ Navbar - Fully responsive top navigation for better accessibility.
✅ React Router Integration - For seamless navigation across different pages.
✅ Submenu & Active Page Highlighting - Users can see which section they are in.
✅ Mobile-Friendly Sidebar - Overlaps content without blocking the main UI.
✅ Optimized Scrollable Content - Ensuring a clean layout without content overflow.
✅ Custom Scrollbars - Styled to match the theme.
This project utilizes the following modern web technologies:
- React.js - For building the interactive UI.
- React Router - For client-side routing and navigation.
- Tailwind CSS - For highly customizable and responsive styling.
- Framer Motion - For smooth animations and transitions.
- Heroicons - For adding beautiful icons.
- React Icons - For additional branding and custom icons.
- Sidebar & Navbar Animation: Smooth transitions using Framer Motion.
- Active Page Highlighting: Shows the current section in the sidebar.
- Glassmorphism Theme: Modern transparent, blurred background effect.
- Content Optimization: Enhancing readability with a clean layout.
- Desktop: Sidebar is expanded by default.
- Tablet & Mobile: Sidebar auto-collapses and overlays the content.
- Touch-Friendly Navigation: Improved experience for smaller devices.
1️⃣ Clone the repository:
git clone https://github.com/Konarksharma13/GlassCpp.git
cd GlassCpp2️⃣ Install dependencies:
npm install tailwindcss @tailwindcss/vite
npm install framer-motion
npm install react-icons –save
npm install @heroicons/react
npm install motion
3️⃣ Start the development server:
npm run dev4️⃣ Open in your browser:
http://localhost:5173/
Feel free to contribute by opening issues and submitting pull requests to enhance this project further!
This project is open-source and available under the MIT License.
💡 Created with ❤️ by Konark Sharma