Skip to content

feat:Enhance About Page with Dynamic Content & Premium UI

Praveena Veeranki requested to merge feat/about into testing

Overview

This MR significantly improves the About Page by transitioning it to a modular, component-based architecture and providing a premium visual overhaul. The page is now fully dynamic, fetching high-quality data directly from Strapi APIs.

Key Changes

1. Modular Component Architecture Created a new set of reusable React components in src/components/about/ to ensure a clean, maintainable structure:

  • HeroSection: A high-impact hero with a theme aligned with the Home page, featuring bold blue typography and a professional layout.
  • KeyInitiatives: A clear showcase of major milestones (achievements) using distinct iconography and clean card designs.
  • JourneySection: A premium vertical zig-zag timeline with elegant card-based milestones for historical tracking.
  • ImpactSection: Statistical highlights using high-visibility metric cards.
  • LeadershipSection: A responsive grid for displaying the leadership team with support for images and roles.
  • FocusAreas: A structured grid showcasing core domain expertise with Lucide icons.

2. Dynamic Data Integration

  • Replaced previous static/hardcoded logic with robust data fetching from Strapi.
  • Integrated the /api/pages?filters[slug]=about endpoint to populate every section of the page.
  • Ensured consistent mapping for historical milestones (2004, 2014, etc.) in the Journey section.

3. UI/UX & Theme Alignment

  • Home Page Sync: Updated the About page hero aesthetics (colors, font-weights, and spacing) to maintain strict brand consistency with the main landing page.
  • Responsive Design: All new components are fully mobile-responsive with optimized layouts for all screen sizes.
  • Visual Polish: Added hover effects, micro-animations, and glassmorphism elements to elevate the overall user experience.

Verification

  • Manually tested layouts across mobile and desktop viewports.
  • Verified data integrity by comparing Strapi CMS content with local rendering.
  • Ensured that "Our Journey" correctly reflects historical organizational milestones.

Merge request reports