Complete UI redesign inspired by competitive programming platforms (Codeforces, AtCoder, TLE, MyCPTrainer, AlgoZenith) #174
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Co-authored-by: Hackeries <123194124+Hackeries@users.noreply.github.com>
Co-authored-by: Hackeries <123194124+Hackeries@users.noreply.github.com>
Co-authored-by: Hackeries <123194124+Hackeries@users.noreply.github.com>
…ns, and tap targets Co-authored-by: Hackeries <123194124+Hackeries@users.noreply.github.com>
Co-authored-by: Hackeries <123194124+Hackeries@users.noreply.github.com>
Copilot
AI
changed the title
[WIP] Implement responsive dark mode UI overhaul
Implement dark-mode glassmorphism UI redesign with responsive breakpoints
Dec 22, 2025
Copilot
AI
changed the title
Implement dark-mode glassmorphism UI redesign with responsive breakpoints
Complete UI redesign inspired by competitive programming platforms (Codeforces, AtCoder, TLE, MyCPTrainer, AlgoZenith)
Dec 22, 2025
There was a problem hiding this comment.
Pull request overview
This PR implements a comprehensive UI redesign inspired by competitive programming platforms like Codeforces, AtCoder, and others. The changes introduce modern design patterns including glassmorphism effects, enhanced gradients, improved hover interactions, and refined spacing/typography throughout the application.
Key Changes:
- Applied glassmorphism styling with backdrop blur effects across cards and panels
- Fixed multiple CSS class name typos (
bg-linear-to-*corrected tobg-gradient-to-*) - Enhanced interactive elements with hover lift, scale, and glow effects
- Added new utility classes in globals.css for consistent glass effects and animations
Reviewed changes
Copilot reviewed 7 out of 7 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
components/sidebar-layout.tsx |
Enhanced sidebar and mobile navigation with rounded corners, gradient backgrounds, border styling, and improved hover/active states with scale animations |
components/landing/platform-features.tsx |
Fixed gradient class typos and applied glass-card styling to feature cards with enhanced hover effects |
components/landing-hero.tsx |
Corrected gradient class typos, added gradient overlays on stat cards, and improved button hover states with scale transforms |
components/dashboard/skill-progress-dashboard.tsx |
Applied glassmorphism to cards, enhanced loading skeleton with gradients, improved stat card icons with gradient backgrounds, and refined topic mastery display |
components/arena/arena-leaderboard.tsx |
Modernized leaderboard with glass-card styling, improved player entries with hover-lift effects, enhanced avatar styling, and refined stat displays |
app/globals.css |
Added comprehensive glassmorphism utilities (glass-card, glass-panel), hover effect classes (hover-lift, hover-scale, hover-glow), and responsive utilities |
app/analytics/analytics-client.tsx |
Applied glass-card styling and enhanced icon displays with gradient backgrounds for feature cards |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <div className="space-y-2"> | ||
| {leaderboard.map((entry) => ( | ||
| <div className="space-y-2 max-h-[600px] lg:max-h-[700px] xl:max-h-[800px] overflow-y-auto scrollbar-thin"> | ||
| {leaderboard.map((entry, index) => ( |
There was a problem hiding this comment.
The 'index' parameter is declared but never used in the map callback. Consider removing it if it's not needed.
Suggested change
| {leaderboard.map((entry, index) => ( | |
| {leaderboard.map((entry) => ( |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
updated UI