feat: gbfs validator front page styling

[Alessandro100]

Summary:

closes: https://github.com/MobilityData/product-tasks/issues/160

The styling and links for the front page of the gbfs validator

Expected behavior:

The front page of the gbfs validator should look good in any resolution and in dark mode. The links should all work (except View GBFS Validator API docs as it's not made yet)

Testing tips:

Go to 'gbfs-validator' and assure there are no visual bugs (light / dark mode) (desktop / mobile)

Please make sure these boxes are checked before submitting your pull request - thanks!

• Run the unit tests with ./scripts/api-tests.sh to make sure you didn't break anything
• Add or update any needed documentation to the repo
• Format the title like "feat: [new feature short description]". Title must follow the Conventional Commit Specification(https://www.conventionalcommits.org/en/v1.0.0/).
• Linked all relevant issues
• Include screenshot(s) showing how this pull request works and fixes the issue(s)

[github-actions]

*Lighthouse ran on https://mobility-feeds-dev--pr-1411-p9u29zfz.web.app/ * (Desktop)
⚡️ HTML Report Lighthouse report for the changes in this PR:

Performance	Accessibility	Best Practices	SEO
🟠 84	🟢 100	🟢 100	🟢 100

*Lighthouse ran on https://mobility-feeds-dev--pr-1411-p9u29zfz.web.app/feeds * (Desktop)
⚡️ HTML Report Lighthouse report for the changes in this PR:

Performance	Accessibility	Best Practices	SEO
🟠 65	🟢 91	🟢 100	🟢 100

*Lighthouse ran on https://mobility-feeds-dev--pr-1411-p9u29zfz.web.app/feeds/gtfs/mdb-2126 * (Desktop)
⚡️ HTML Report Lighthouse report for the changes in this PR:

Performance	Accessibility	Best Practices	SEO
🟠 53	🟢 95	🟢 100	🟢 100

*Lighthouse ran on https://mobility-feeds-dev--pr-1411-p9u29zfz.web.app/feeds/gtfs_rt/mdb-2585 * (Desktop)
⚡️ HTML Report Lighthouse report for the changes in this PR:

Performance	Accessibility	Best Practices	SEO
🟢 91	🟠 88	🟢 100	🟢 100

*Lighthouse ran on https://mobility-feeds-dev--pr-1411-p9u29zfz.web.app/gbfs/gbfs-flamingo_porirua * (Desktop)
⚡️ HTML Report Lighthouse report for the changes in this PR:

Performance	Accessibility	Best Practices	SEO
🟢 100	🟢 100	🟢 100	🟢 100

[github-actions]

Preview Firebase Hosting URL: https://mobility-feeds-dev--pr-1411-p9u29zfz.web.app

[emmambd]

Let's refer to Entur here: https://entur.no/

[Copilot]

Pull Request Overview

This PR implements the front-end styling and layout improvements for the GBFS Validator page, making it responsive across different screen sizes and compatible with both light and dark themes. The changes focus on visual presentation, accessibility enhancements, and improved navigation with functional links.

Key changes:

• Added responsive layout components and styling for the validator landing page
• Implemented functional navigation links to external resources and internal pages
• Enhanced accessibility with proper ARIA labels and alt text for images

Reviewed Changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File	Description
validator.styles.ts	Added new styled components for responsive promotion row layouts
index.tsx	Updated hero section, promotion rows with responsive design and functional links
GbfsFeedSearchInput.tsx	Added navigation functionality, improved form accessibility, and responsive layout
Header.tsx	Added accessibility label to language selector

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The null check reverse != null is unnecessary. Since reverse is typed as boolean | undefined, you can simplify this to reverse ? 'row-reverse' : 'row', which will correctly handle undefined, false, and true values.

Suggested change

	flexDirection: reverse != null && reverse ? 'row-reverse' : 'row',
	flexDirection: reverse ? 'row-reverse' : 'row',