This is a submission for Frontend Challenge: Office Edition sponsored by Axero, Holistic Webdev: Office Space
What I Built
I created NovaCorp Intranet, a modern employee portal designed to streamline internal communications and productivity. This responsive web application features:
Dynamic Theme Switching: Smooth dark/light mode transitions with system preference detection
Interactive Dashboard: Company news, upcoming events, and quick resources sections
Employee Spotlight: Team member highlights with hover effects
Responsive Design: Fully functional across all device sizes
Persistent Preferences: Remembers user theme choices via localStorage
Demo
live site : frontend-challenge-a3xn.vercel.app
source code : https://github.com/urvashi-agrawal-dev/Frontend-Challenge
Journey
Key Features Implemented
Theme Engine:
CSS variables for consistent theming
Animated transitions between modes
OS-level preference detection
Dashboard Components:
News feed with timestamped entries
Interactive event calendar
Quick-access resource grid
Technical Choices:
Pure CSS (no frameworks) for maximum performance
Semantic HTML5 for accessibility
Mobile-first responsive approach
Challenges Overcome
Theme Persistence: Solved localStorage integration for remembering user preferences
Color Contrast: Carefully tested accessibility in both themes
Performance: Optimized assets and minimized reflows for smooth animations
What I Learned
Advanced CSS variable manipulation
System preference media queries
The importance of reduced motion preferences
How to create intuitive UI patterns for theme switching
License
This project is licensed under the MIT License - feel free to use it as inspiration for your own projects!
Top comments (0)