CommunityRule/community-rule
2
0 Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Put the use-case index on Learn and match the guide grid #91

Merged
an.di merged 2 commits from adilallo/feature/CR-223-learn-and-use-cases into main 2026-11-04 04:06:58 +00:00
Conversation 0 Commits 2 Files Changed 28
+754 -430
an.di commented 2026-11-04 04:06:21 +00:00
Member
Copy link
Copy source

Overview

Learn now carries the use-case index, the guides, and the FAQ, in the order drawn for the marketing pages. /use-cases redirects there so the old index address still lands somewhere, and the three pilot stories stay on their own URLs. Share images resolve against the host that serves the page, so a staging link previews with a staging image.

Changes

  • Rebuilt /learn from the existing marketing sections: page header, the three pilot tiles, “Who is this for?”, the triple step, “Organizing is hard”, the guide plus eight articles, the triple text block, the FAQ, and Ask an organizer.
  • The guide card is first and links to /how-it-works. Article cards use the one-line summaries. The hidden “Most communities don't fail” block is not rendered.
  • Guide cards follow the frames: one full-width card below 640, two columns from 640, three from 1024, and four from 1440, with the last card centered. The guide card has its tag and the small Rule drawing.
  • Card icons use empty alt text. Author and date stay off the cards until the dates are approved.
  • The FAQ lives on Learn at #faq, with the first answer open.
  • /use-cases permanently redirects to /learn. Pilot pages stay at /use-cases/[slug] and /use-cases/[slug]/rule. The sitemap drops the index URL and keeps the pilot URLs.
  • The public name on the medics pilot is Boulder Street Medics. The slug is unchanged. Mutual Aid Colorado’s Values entries no longer include the Food Not Bombs paragraphs.
  • metadataBase comes from the request host, so og:image is absolute on that host. Staging still disallows indexing, and unfurl agents are allowed through.

Screenshots

01-learn-top.png

How to Test

  1. Run npm run dev and open /learn.
  2. Confirm the section order above, the guide link to /how-it-works, and that the first FAQ item is expanded at /learn#faq.
  3. Resize to about 390, 768, 1280, and 1440. The guide grid should be 1, 2, 3, then 4 columns. The last wide card is centered.
  4. Open /use-cases and confirm it redirects to /learn. Open each pilot story and its rule page.
  5. On the Mutual Aid Colorado rule, confirm the Values entries do not include the Food Not Bombs charity sentence. That sentence should still be on the Food Not Bombs rule.
  6. Request /learn with X-Forwarded-Host: staging.communityrule.info and confirm og:image points at https://staging.communityrule.info/assets/marketing/og-image.png.

Notes

  • Card bylines stay off until the dates are approved. The frames draw a name and a date on each card.
  • The footer still says “Use cases”. That link redirects to Learn. The footer label waits on the navigation redesign.
  • Article bodies were not rewritten. The corrected text file for the out-of-order guides is not in the repo.
  • The guide card’s Rule is decorative art on the thumbnail, not a live rule.02-who-is-this-for.png03-steps.png04-guides.png05-faq.png
## Overview Learn now carries the use-case index, the guides, and the FAQ, in the order drawn for the marketing pages. `/use-cases` redirects there so the old index address still lands somewhere, and the three pilot stories stay on their own URLs. Share images resolve against the host that serves the page, so a staging link previews with a staging image. ## Changes - Rebuilt `/learn` from the existing marketing sections: page header, the three pilot tiles, “Who is this for?”, the triple step, “Organizing is hard”, the guide plus eight articles, the triple text block, the FAQ, and Ask an organizer. - The guide card is first and links to `/how-it-works`. Article cards use the one-line summaries. The hidden “Most communities don't fail” block is not rendered. - Guide cards follow the frames: one full-width card below 640, two columns from 640, three from 1024, and four from 1440, with the last card centered. The guide card has its tag and the small Rule drawing. - Card icons use empty alt text. Author and date stay off the cards until the dates are approved. - The FAQ lives on Learn at `#faq`, with the first answer open. - `/use-cases` permanently redirects to `/learn`. Pilot pages stay at `/use-cases/[slug]` and `/use-cases/[slug]/rule`. The sitemap drops the index URL and keeps the pilot URLs. - The public name on the medics pilot is Boulder Street Medics. The slug is unchanged. Mutual Aid Colorado’s Values entries no longer include the Food Not Bombs paragraphs. - `metadataBase` comes from the request host, so `og:image` is absolute on that host. Staging still disallows indexing, and unfurl agents are allowed through. ## Screenshots ![01-learn-top.png](attachments/1a2a66ac-ad8b-4534-94f8-756f27defc95) ## How to Test 1. Run `npm run dev` and open `/learn`. 2. Confirm the section order above, the guide link to `/how-it-works`, and that the first FAQ item is expanded at `/learn#faq`. 3. Resize to about 390, 768, 1280, and 1440. The guide grid should be 1, 2, 3, then 4 columns. The last wide card is centered. 4. Open `/use-cases` and confirm it redirects to `/learn`. Open each pilot story and its rule page. 5. On the Mutual Aid Colorado rule, confirm the Values entries do not include the Food Not Bombs charity sentence. That sentence should still be on the Food Not Bombs rule. 6. Request `/learn` with `X-Forwarded-Host: staging.communityrule.info` and confirm `og:image` points at `https://staging.communityrule.info/assets/marketing/og-image.png`. ## Notes - Card bylines stay off until the dates are approved. The frames draw a name and a date on each card. - The footer still says “Use cases”. That link redirects to Learn. The footer label waits on the navigation redesign. - Article bodies were not rewritten. The corrected text file for the out-of-order guides is not in the repo. - The guide card’s Rule is decorative art on the thumbnail, not a live rule.![02-who-is-this-for.png](attachments/9a2d6cee-cc9d-4608-8616-cd684cefe104)![03-steps.png](attachments/fdc80358-b665-47c8-a392-d658d4297620)![04-guides.png](attachments/dd682f87-5db5-486d-8e63-9911362c483d)![05-faq.png](attachments/223e892f-e529-4525-9afd-ebf724c333b1)
01-learn-top.png
85 KiB
02-who-is-this-for.png
58 KiB
03-steps.png
246 KiB
04-guides.png
78 KiB
05-faq.png
62 KiB
an.di added 2 commits 2026-11-04 04:06:21 +00:00
Move the use-case index onto Learn so the pilot stories stay reachable, and make share images resolve on the host that serves the page. 9ea3f9fd0a 
Co-authored-by: Cursor <cursoragent@cursor.com>
Match the Learn guide grid to the frames, and put the tag and small Rule on the guide card. 4b0d15e89b 
Co-authored-by: Cursor <cursoragent@cursor.com>
an.di merged commit 0b6e8b00dd into main 2026-11-04 04:06:58 +00:00
an.di deleted branch adilallo/feature/CR-223-learn-and-use-cases 2026-11-04 04:06:58 +00:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
No items
No labels
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
an.di (Andy DiLallo) ntnsndr (Nathan Schneider)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: CommunityRule/community-rule#91