Skip to content

Implement Context-Aware Footer Across the Application #93

Description

@imuniqueshiv

Description

The current landing page footer is designed for marketing purposes and includes multiple sections such as project information, quick links, resources, and technology stack. While this works well for the public landing page, it becomes repetitive and occupies excessive space on authenticated pages such as the Dashboard, Meetings, AI Search, Organizations, Profile, Settings, Calendar, and other internal pages.

The goal of this issue is to implement context-aware footers by keeping the existing rich footer on the landing page while introducing a clean, compact footer for all authenticated and nested pages.

Important: This issue focuses only on improving the footer experience. Do not modify existing routing, authentication, or page functionality.


Objective

Create two footer variants:

Landing Page Footer

Keep the existing comprehensive footer as-is.

Application Footer

Create a clean, minimal footer similar to modern developer platforms (e.g., GitHub, Vercel, Linear, Notion, etc.) that provides only essential information without distracting users from the application's primary workflows.


Files to Review

Frontend

client/src/App.jsx

client/src/components/Footer.jsx

client/src/components/

client/src/pages/

Supporting files may be updated if necessary while keeping the implementation focused on this feature.


Features to Implement

Landing Footer

Keep the current footer exclusively for the public landing page.


Compact Application Footer

Display a lightweight footer on authenticated and nested pages.

Suggested content:

  • MeetOnMemory logo
  • Copyright
  • Version (optional)
  • Privacy Policy
  • Terms
  • GitHub Repository
  • Back to Top (optional)

Avoid repeating marketing content already available on the landing page.


Responsive Design

Ensure the compact footer works well across:

  • Desktop
  • Tablet
  • Mobile

Consistent Layout

The compact footer should:

  • Maintain proper spacing
  • Match the application's design language
  • Never interfere with page content
  • Remain visually minimal

Functional Requirements

The following functionality must remain unchanged:

  • Authentication
  • Navigation
  • Routing
  • Dashboard
  • Meetings
  • Organizations
  • AI Search
  • Existing page layouts

Out of Scope

Please do not:

  • Redesign the landing page footer
  • Modify page content
  • Change routing behavior
  • Refactor unrelated components

UI Requirements

The compact footer should:

  • Follow MeetOnMemory's design language
  • Be minimal and distraction-free
  • Maintain consistent spacing and typography
  • Support desktop, tablet, and mobile devices
  • Prioritize accessibility and readability

Testing Requirements

Before submitting a Pull Request, verify:

Functionality

  • ✅ Landing page displays the existing footer.
  • ✅ Internal pages display the compact footer.
  • ✅ Footer renders correctly across all supported pages.
  • ✅ Existing functionality remains unaffected.

UI

  • ✅ Responsive on desktop, tablet, and mobile.
  • ✅ No layout overflow.
  • ✅ No console errors.

Before Opening a Pull Request

Run:

npm run format:check

npm run lint

npx prettier . --check

npm run build

Ensure:

  • No formatting issues
  • No lint errors
  • Successful production build

Pull Request Requirements

Please include:

  • Summary of the implementation
  • Before & After screenshots
  • Short screen recording demonstrating:
    • Landing page footer
    • Compact footer on authenticated pages
  • Confirmation that all testing requirements were completed

Acceptance Criteria

  • Existing footer remains unchanged on the landing page.
  • A compact footer is displayed on all authenticated and nested pages.
  • Footer styling is consistent with the application design.
  • Responsive across supported devices.
  • Existing functionality remains unchanged.
  • No console, lint, or build errors.

Notes

  • Keep this Pull Request focused only on the footer implementation.
  • Reuse the existing Footer component where possible or create reusable variants to avoid code duplication.
  • The compact footer should prioritize usability over marketing content, creating a cleaner experience for users working inside the application.
  • Follow the project's CONTRIBUTING.md guidelines before opening a Pull Request.

Difficulty: Good First Issue

Estimated PR Size: Small–Medium (≈100–250 LOC)

Metadata

Metadata

Assignees

Labels

ECSoC26Eligible for Elite Coders Summer of Code 2026 automated scoring.UI/UXenhancementNew feature or requestfrontendgood first issueGood for newcomersgood-pr+15 XP

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions