Skip to content

feat: ui improvements to cover the requirements

Mohana Sri Bhavitha requested to merge ui-bhavitha into dev

This MR refines key UI areas to improve navigation behavior, visual consistency, and layout spacing across the site.

What was improved

Reworked the Services navbar dropdown so it opens in a stable, centered position relative to the active nav item. Improved dropdown interaction logic for nested service links and responsive behavior on smaller screens. Updated dropdown styling (App.css) for clearer structure, better widths, cleaner hover/active states, and improved readability. Refined the About hero section content and visuals by updating the hero image path, simplifying heading content, and making eyebrow text optional. Cleaned About/Resources hero styling by removing heavy overlay effects and improving image positioning and container spacing. Expanded Footer service links into grouped parent/child links for easier access to sub-services. Updated research hero layout and typography to better match theme and visual hierarchy. Simplified research hero copy for clearer messaging. Updated Contact Us left info card by removing the email row and aligning phone/location text consistently beside icons. Fixed excessive vertical gap between the Why Codonix section and Partner With Us CTA so spacing now matches other sections. User-visible impact

Dropdown feels more predictable and easier to use. About and Research hero sections look cleaner and more consistent with light/dark themes. Footer navigation is more informative and navigable. Contact card is cleaner and better aligned. Research page section spacing is visually balanced. Files/areas touched

Navbar and global nav styles: src/components/Navbar.jsx, src/App.css About pages and hero styles: src/components/HeroSection.jsx, src/pages/AboutUs.jsx, src/pages/AboutResources.css Footer service navigation: src/components/Footer.jsx Research page content/layout/spacing: src/pages/ResearchDevelopment.jsx, src/pages/ResearchDevelopment.css Contact page card layout: src/pages/ContactUs.jsx, src/pages/ContactUs.css Assets/config adjustments: public/assets/images/about_us.png, public/assets/images/aboutus.jpeg, vite.config.js Validation

Build passes successfully with npm run build.

Merge request reports

Loading