Modern UI Overhaul: More Intuitive, Attractive, and Consistent Experience#2
Merged
Modern UI Overhaul: More Intuitive, Attractive, and Consistent Experience#2
Conversation
This major update modernizes and simplifies the entire user interface across the application for a more appealing, user-friendly experience. - Revamps the landing page, authentication, header, and library views with better layout, modern gradients, glassmorphism, improved spacing, and animation utility classes - Refactors library card grid, upload form, and empty/loader states for visual polish and feedback - Updates PDF reader controls and loading screens for consistency - Implements improved global animation and utility styles The new UI enhances usability and aesthetics with no breaking changes.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
💡 Enable Vercel Agent with $100 free credit for automated AI reviews |
Adopted a warm and cozy color system with modern gradients and glass effects. Improved page responsiveness, modernized visual hierarchy, and enhanced layout spacing. Added new utility classes for cards, glows, and more expressive focus/hover states.
Apply modern asymmetric layouts, bento grids, and new font families across the homepage and header. Ensure all text is readable in both light and dark modes (fixes brand/gradient text). Dramatically enhance structure, style, and visual hierarchy for a contemporary feel. - Redesigned home page with modern hero, bento layout, and cta - Switched to Inter, Playfair Display, and JetBrains Mono font stack - Updated header with visible brand text and style coherence - CSS clarity: all text uses text-foreground, improve gradient fallback
- Makes navbar visible and non-transparent for improved readability - Refines dark mode palette for less clashing, more harmonious look - Restores Instrument Sans as the body font and consistent non-display usage - Ensures navbar remains responsive with accessible mobile navigation - Removes misleading marketing claims from landing features section
Ensure Instrument Sans font is properly set as the main font for body text by including its className in the body element in layout.tsx. Resolves issue where fallback fonts were displaying instead of Instrument Sans, maintaining consistent sitewide typography.
- Improves mobile navigation experience with a modal backdrop overlay - Adds smooth slide-down animation and disables body scroll when open - Updates menu layout and icons for modern, touch-friendly usability - Closes mobile menu on overlay click or Escape key for accessibility
- Explicitly enforce Instrument Sans as the default body font for all non-heading elements in CSS, ensuring no text unintentionally uses fallback fonts - Remove legacy font CSS variables for cleaner configuration - Correct theme font references so all text except headings adheres to the typography system
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Summary
Delivers a visually consistent UI refresh with unified typography, improved color palette for dark mode, clear value propositions, refined spacing, and a much improved mobile navigation experience.
Details
Warning: Task VM test is not passing, cto.new will perform much better if you fix the setup