feat: page redesigns — design system, schema fields, SocialMeta, OG images (Track C)#682
Merged
codercatdev merged 2 commits intodevfrom Mar 16, 2026
Merged
feat: page redesigns — design system, schema fields, SocialMeta, OG images (Track C)#682codercatdev merged 2 commits intodevfrom
codercatdev merged 2 commits intodevfrom
Conversation
…lMeta, OG images Track C: Full page redesign using Track B design system + Track A schema fields. GROQ queries (queries.ts): - Added authorName/authorImage to baseFields (all content cards) - Added categories[]-> to post queries - Added episode/season to podcast list query - Added chapters[], series->, listenLinks[] to podcast detail - Added company, role to author/guest queries - Added socialPreview (ogTitle, ogDescription, ogImage) to all detail queries BaseLayout: - Integrated SocialMeta component for og:*/twitter:* meta tags - Extended Props: ogImage, ogType, publishedAt, author, canonicalUrl Homepage (index.astro): - Hero section with gradient background + CTA buttons - Featured latest podcast with ContentCardFeatured - 4 content rows with Badge headers + "View All" links - All ContentCards use new interface (url, type, thumbnail, authorName) Blog listing + Post detail: - Container, Badge, categories as Tags, author Avatar - Post detail: prose styling with design tokens, author card, socialPreview - Dynamic OG images via /api/og/blog.png Podcast listing + Episode detail: - Series info card, chapters timeline with timestamps - Guest cards with Avatar, company, role - Listen links (Spotify, Apple, etc.) - Picks section with design tokens - Dynamic OG images via /api/og/podcast.png Person pages (author, guest, sponsor): - PersonDetail: design tokens, company/role, ContentCard new interface - All detail pages: socialPreview support, OG images - All listing pages: Container, design tokens 404: Gradient text, cat-themed message, Button components Generic pages: Container narrow, design tokens, OG images Design compliance: - Zero hardcoded text-gray-*/bg-gray-*/text-blue-* colors - All pages use design tokens (--text, --surface, --border, etc.) - All ContentCards use new interface (url, type, thumbnail) Build: 15.46s ✅ Co-authored-by: seniordeveloper <seniordeveloper@miriad.systems>
…socialPreview Addresses consolidated review feedback from PM, @SocialMediaStrategist, @podcaststrategist, @uidesigner, and @content: 1. listenLinks GROQ: changed from array query `listenLinks[]{ platform, url }` to flat object `listenLinks` matching schema shape (object with named keys: youtube, spotify, apple, overcast, pocketCasts, rss) 2. listenLinks template: iterate Object.entries() instead of array .map(), platformLabels keyed by schema field names 3. SocialMeta: added og:image:width (1200), og:image:height (630), og:image:alt (title), og:locale (en_US) 4. Podcast OG URL: added &guest= param for guest name in social previews 5. pageQuery: added socialPreview fields (ogTitle, ogDescription, ogImage) 6. [slug].astro: uses socialPreview with fallback chain 7. Chapters GROQ: changed `description` to `seconds` per schema definition Build: 15.68s ✅ Co-authored-by: seniordeveloper <seniordeveloper@miriad.systems>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Track C: Page Redesigns
Full page redesign using Track B design system components + Track A schema fields. 17 files changed, +963/-366.
What Changed
GROQ Queries (
queries.ts)authorName,authorImagebaseFields(all content cards)categories[]->postListQuery,postQueryepisode,seasonpodcastListQuerychapters[],series->,listenLinks[]podcastFieldscompany,roleauthorQuery,guestQuerysocialPreview(ogTitle, ogDescription, ogImage)BaseLayout
SocialMeta.astroforog:*/twitter:*meta tagsogImage,ogType,publishedAt,author,canonicalUrl/api/og/default.png, fallback URL viaAstro.url.hrefHomepage
.devin primary color, CTA buttonsContentCardFeaturedwith excerpt + authorBadgeheader + "View All →" link + 4-columnContentCardgridBlog Listing + Post Detail
Container,Badgeheader, post count, categories asTagcomponentsBadge+ date + authorAvatar+ categories, prose with design tokens, author card at bottomogTitle/ogDescriptionoverride defaults when set in Sanity/api/og/blog.png?title=...&author=...Podcast Listing + Episode Detail
Container,Badgeheader, episode/season in metadatapodcast.seriesexists)Avatar, company, role, link to guest page/api/og/podcast.png?title=...&author=...&episodeNumber=...Person Pages (Author, Guest, Sponsor)
ContentCardnew interface,Badgeheaders for related contentContainer, design tokens, OG images404 Page
Buttoncomponents (primary + secondary)Generic Pages (
[slug].astro)Containernarrow, design tokens, OG imageDesign System Compliance
text-gray-*,bg-gray-*,text-blue-*anywhere--text,--surface,--border,--color-type-*)ContentCardusage updated to new interface (url,type,thumbnail,authorName,authorImage,metadata)export const prerender = false(SSR)Dependencies
/api/og/blog.png,/api/og/podcast.png,/api/og/default.pngNote on SocialMeta
This PR includes a
SocialMeta.astrocomponent. Track D (PR #681) also has one. This version is more complete (smart defaults,og:site_name,twitter:site). When both merge to dev, keep this version.Build
✅ 15.46s — clean build, only pre-existing chunk size warning.