Skip to content

Redesign Matchplay home page — action-first two-column layout#128

Open
Studio-18 wants to merge 16 commits into
mainfrom
codex/redesign-matchplay-home-page-ui
Open

Redesign Matchplay home page — action-first two-column layout#128
Studio-18 wants to merge 16 commits into
mainfrom
codex/redesign-matchplay-home-page-ui

Conversation

@Studio-18
Copy link
Copy Markdown
Collaborator

Motivation

  • Modernize the Matchplay home page to be more action-focused and easier to scan while keeping all backend, auth, and state logic intact.
  • Replace the existing stacked homepage with a two-column layout that surfaces primary actions (Create Match / Book Lesson) and groups discovery, filters, and schedule for faster task completion.

Description

  • Navigation: simplified top nav (removed Home/Credits/My Activity, merged coaches links into a single Coaches item), made the brand/logo a link to home, and added a messages icon beside notifications in src/components/MainLayout.tsx.
  • Home layout: replaced the previous dashboard content with a two-column home-redesign in src/pages/DashboardPage.jsx that adds dual hero action cards, a week-aware date selector with previous/next buttons and a date-picker trigger, a combined location/distance/type filter bar, a unified activity list, and a right sidebar for My Schedule / Your Stats / Find Players CTA.
  • Styling: added and adjusted styles for hero cards, date selector, filter bar, unified activity cards, and sidebar sections in src/App.css to match the design spec (gradients, radii, spacing, and color tokens).
  • Behavior: preserved all existing server interactions and schedule logic by continuing to call getPlayerFutureLessons and getPlayerFutureGroupLessons; no API endpoints, models, authentication, or store/context logic were changed.
  • Files changed: src/pages/DashboardPage.jsx, src/components/MainLayout.tsx, src/App.css (UI-only changes).

Testing

  • Ran npm run lint and resolved a lint issue; lint completed successfully.
  • Built a production bundle with npm run build; the build completed successfully (Vite build).
  • Started the dev server and captured an automated Playwright screenshot of the redesigned homepage (dev server reachable and screenshot produced).

Codex Task

@netlify
Copy link
Copy Markdown

netlify Bot commented Feb 21, 2026

Deploy Preview for ttp-player-web-staging ready!

Name Link
🔨 Latest commit acbe6c6
🔍 Latest deploy log https://app.netlify.com/projects/ttp-player-web-staging/deploys/699bc4f4c6db0d0008954029
😎 Deploy Preview https://deploy-preview-128--ttp-player-web-staging.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented Feb 21, 2026

PR Preview Action v1.6.2

🚀 View preview at
https://CodeMyMobile.github.io/ttp-player-web/pr-preview/pr-128/

Built to branch gh-pages at 2026-02-23 03:10 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant