From 6b45846d6d9c5f2ae969ac716d66c734ad24bd80 Mon Sep 17 00:00:00 2001 From: Jamey Greenwood Date: Tue, 20 Jan 2026 19:13:48 +0000 Subject: [PATCH] feat: enhance contact page with newsletter and social cards Add newsletter_card component with :card and :inline variants to share between footer and contact page. Add social_links_card component with full-width icon+text cards for better discoverability. Improve contact_form with optional email link and response time display, keeping important contact info above the fold. Reorganize contact page layout with form on left, info cards on right. Co-Authored-By: Claude Opus 4.5 --- ROADMAP.md | 30 +--- .../page_templates/contact.html.heex | 6 +- .../components/shop_components.ex | 162 +++++++++++++++--- 3 files changed, 147 insertions(+), 51 deletions(-) diff --git a/ROADMAP.md b/ROADMAP.md index 6367611..cc46e06 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -339,29 +339,7 @@ This ensures sellers never unknowingly sell at a loss due to Printify price chan ## Quick Wins (Low Effort) -### Enhanced Contact Page -**Status:** Not implemented -**Effort:** Small - -The current contact page has subtle footer social icons that are easy to miss. Improvements: - -1. **Newsletter signup card** - Prominent card encouraging newsletter subscription as the best way to stay updated (already in footer, but deserves dedicated placement) - -2. **Social media links card** - Full-width card listing social platforms with icons and text labels: - ``` - [Instagram icon] Instagram - [Patreon icon] Patreon - [TikTok icon] TikTok - [Facebook icon] Facebook - [Pinterest icon] Pinterest - ``` - This makes social links more discoverable than the current small footer icons. - -**Implementation:** -- Add `newsletter_card/1` component to ShopComponents -- Add `social_links_card/1` component with configurable platforms -- Update contact page template to include both cards -- Consider making platforms configurable via theme settings +*(None pending)* --- @@ -488,3 +466,9 @@ The project is currently named `simpleshop_theme` (reflecting its origins as a t - Current page is not a link (avoids self-links) - Logo links to home except when on home page - `aria-current="page"` with visual underline indicator + +### Enhanced Contact Page ✅ +- `newsletter_card` component with `:card` and `:inline` variants (shared with footer) +- `social_links_card` component with icon + text label cards +- Contact form with integrated email link and response time +- Reorganized layout: contact form left, info cards right diff --git a/lib/simpleshop_theme_web/components/page_templates/contact.html.heex b/lib/simpleshop_theme_web/components/page_templates/contact.html.heex index c920788..1016329 100644 --- a/lib/simpleshop_theme_web/components/page_templates/contact.html.heex +++ b/lib/simpleshop_theme_web/components/page_templates/contact.html.heex @@ -15,7 +15,7 @@ />
- <.contact_form /> + <.contact_form email="hello@example.com" response_time="We typically respond within 24 hours" />
<.order_tracking_card /> @@ -26,9 +26,9 @@ %{label: "Returns", value: "Happy to help with faulty or damaged items"} ]} /> - <.contact_info_card email="hello@example.com" /> + <.newsletter_card /> - <.social_links /> + <.social_links_card />
diff --git a/lib/simpleshop_theme_web/components/shop_components.ex b/lib/simpleshop_theme_web/components/shop_components.ex index 51cb96c..8940008 100644 --- a/lib/simpleshop_theme_web/components/shop_components.ex +++ b/lib/simpleshop_theme_web/components/shop_components.ex @@ -147,30 +147,7 @@ defmodule SimpleshopThemeWeb.ShopComponents do