Sponsor page updates #32
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
WalkthroughRefactors AdPackageCard layout (grid/flex and text class changes) and a major sponsor page content/layout overhaul: static headline, updated metrics and locations, new 3‑month partnership block, and an expanded grid of five sponsorship packages with pricing and closing/sign‑off copy. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20–30 minutes
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
i noticed in prod the buttons go to |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/components/AdPackageCard.astro (1)
31-53: Fix invalid HTML structure: move elements outside<ul>.The
<h3>(price) and<div>(button) elements are direct children of<ul>, which violates HTML semantics. Only<li>elements should be direct children of<ul>. This can cause accessibility issues and may fail HTML validation.Apply this diff to move the price and button outside the list:
- <ul class="flex flex-col px-8"> + <ul class="flex list-disc flex-col px-8"> { bullets.map((bullet) => { return ( <li class="dark:border-dark-border border-b py-6 text-balance"> {bullet} </li> ); }) } + </ul> <h3 class="text-light-text-heading mt-8 mb-12 flex-1 content-end px-5 text-4xl font-bold tabular-nums dark:text-white" > {price} <span class="text-light-text-body dark:text-dark-text-body text-3xl font-light" > / </span> <span class="text-light-text-body dark:text-dark-text-body text-2xl"> per episode </span> </h3> <div class="flex w-full"> <a class="btn mb-8 w-full justify-center" href="/contact"> <span class="text-light-text-heading rounded-full px-8 py-3 text-center text-sm dark:text-white" > Become a sponsor </span> </a> </div> - </ul>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/components/AdPackageCard.astro(1 hunks)src/pages/sponsor.astro(2 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: e2e
🔇 Additional comments (6)
src/pages/sponsor.astro (6)
51-79: Metrics section looks good.The updated metrics and layout are clear and well-structured. The use of tabular-nums for consistent number spacing is a nice touch.
81-114: Location stats section implemented correctly.The use of fragments to wrap multiple sibling elements in the map is appropriate. The grid layout and progress bars provide a clean visualization of listener distribution.
116-139: Promotional block is well-crafted.The 200,000 impressions claim aligns with the stated 75K+ monthly impressions over a 3-month period (225K total). The messaging is compelling and the gradient styling draws attention appropriately.
141-187: Sponsorship packages are well-structured.The grid of AdPackageCard components provides a clear, comprehensive view of sponsorship options. The pricing progression from $250 to $4k is logical, and the package names are creative and on-brand.
189-209: Closing section adds a personal touch.The conversational closing with team names creates a welcoming, approachable tone that aligns well with the show's personality.
33-36: The text fragment link is a practical choice. Text fragments (#:~:text=) have solid browser support as of 2025 across Chromium-based browsers (Chrome/Edge 80+), Safari 16.1+, and recent Firefox versions, though some older or privacy-focused browsers may not support them. Buzzsprout's stats page doesn't provide traditional named anchors, so the text fragment approach is reasonable for highlighting the "Top 10%" statistic. The link should work reliably in modern browsers.
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (1)
src/pages/sponsor.astro (1)
190-190: Fix typo in text size class.
text-xgis not a valid Tailwind CSS class. This should be corrected to a valid size class such astext-xlortext-2xl.Apply this diff (assuming
text-2xlwas intended):- <p class="text-xg mb-6 text-gray-600 lg:text-3xl dark:text-gray-400"> + <p class="text-2xl mb-6 text-gray-600 lg:text-3xl dark:text-gray-400">
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
src/pages/sponsor.astro(3 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: e2e
🔇 Additional comments (5)
src/pages/sponsor.astro (5)
51-79: LGTM!The metrics section is well-structured with proper grid layout, updated figures, and appropriate dark mode styling.
81-114: LGTM!The location stats section is properly restructured with a clean grid layout, dynamic progress bars, and appropriate dark mode support.
116-139: LGTM!The 3-month partnership callout block is well-implemented with effective gradient highlighting and proper dark mode support.
34-34: No action needed. The Buzzsprout stats URL is accessible (HTTP 200) and text fragments are a supported web standard with broad browser compatibility. The link will function reliably across all modern browsers, and if the text fragment cannot be found, browsers gracefully fall back to the base URL.
141-187: No changes needed. The AdPackageCard component correctly implements the sponsorship packages by linking to a contact form (/contact) for sponsor inquiries, which is the appropriate flow for these high-value custom packages. Each card properly displays the package name, features, and price without requiring direct checkout integration.
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (1)
src/pages/sponsor.astro (1)
7-9: Remove commented-out code.These commented lines should be removed to improve maintainability.
🧹 Nitpick comments (2)
src/pages/sponsor.astro (2)
46-49: Consider making the year dynamic.The hardcoded "2025" reference will become outdated next year. Consider using
new Date().getFullYear()or a configuration value.Apply this diff to make the year dynamic:
- We're offering shared access to a 2025 tech audience through all the most + We're offering shared access to a {new Date().getFullYear()} tech audience through all the most popular channels.
142-149: Consider consistent price formatting.The detailed pricing in the bullets ("$700 for 30-seconds or $1,000 for 60-seconds") contrasts with the abbreviated price display ("$700-1k"). While accurate, this inconsistency might be slightly confusing to users.
Consider either:
- Simplifying the bullets to match the price format, or
- Updating the price prop to match the detailed format (e.g.,
price="$700 / $1k")
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/components/AdPackageCard.astro(1 hunks)src/pages/sponsor.astro(3 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- src/components/AdPackageCard.astro
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: e2e
🔇 Additional comments (2)
src/pages/sponsor.astro (2)
189-209: LGTM! Typo fixed.The closing section looks good, and the previously flagged typo (
text-xg→text-2xl) has been corrected.
141-187: Sponsorship packages currently route to contact form instead of checkout.The five AdPackageCard components link to
/contact("Become a sponsor" button) rather than a checkout flow with product IDs. If the PR intended to implement direct checkout with product-specific links (e.g.,/api/checkout?products=23a257d7-0cc0-401b-94b6-251f31e79055), that integration is not present in the codebase. Currently, sponsors go through the contact form at/api/contactto inquire about packages.
https://starpod-git-sponsorship-update-shipshapecode.vercel.app/sponsor
Summary by CodeRabbit
New Features
Content
Style
✏️ Tip: You can customize this high-level summary in your review settings.