Add media page with grid layout #601
Draft
+593
−110
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This pull request introduces a new media page to the Vets-Who-Code app, enhancing the site's content offering with a grid layout featuring sections for "What we have built", "publications", "podcasts", and "courses".
Adds new components and data:
media.tsx
insrc/pages
to serve as the media page, utilizing React Bootstrap for layout and including aMediaGrid
component for each section.media-grid.tsx
insrc/components
, which displays media items in a responsive grid layout, accepting section-specific data through props.media.json
insrc/data
to store the data for media items, including titles, descriptions, and links, structured by section.Updates existing components:
button/index.tsx
insrc/components/ui
to introduce a new button variant and color option for the media page.menu.ts
insrc/data
to include a navigation menu entry for the new media page, ensuring it is accessible from the main navigation.For more details, open the Copilot Workspace session.