From 08d706858882724dab73ad5facaad137a9da6e65 Mon Sep 17 00:00:00 2001 From: Tom Hall Date: Thu, 26 Mar 2026 12:31:52 -0400 Subject: [PATCH] Redesign membership page with new messaging and layout - Update hero subtitle and intro copy to coalition/HUB framing - Replace accordions with inline content: HUB bullet points, dues section with calculator and Qgiv form - Add inclusivity/waiver section with tax deductibility and payment method info - Remove 'Mobilizing for Palestine' accordion Co-Authored-By: Claude Sonnet 4.6 --- src/components/MembershipPage.tsx | 239 +++++++++++------------------- src/pages/membership.astro | 2 +- 2 files changed, 90 insertions(+), 151 deletions(-) diff --git a/src/components/MembershipPage.tsx b/src/components/MembershipPage.tsx index b9cd461..844309c 100644 --- a/src/components/MembershipPage.tsx +++ b/src/components/MembershipPage.tsx @@ -1,14 +1,11 @@ -import { useEffect, useRef, useState } from "react"; +import { useEffect, useRef } from "react"; import { Box, Typography, - Accordion, - AccordionSummary, - AccordionDetails, Card, CardContent, } from "@mui/material"; -import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; +import MembershipCalculator from "./MembershipCalculator"; const teams = [ { @@ -61,36 +58,36 @@ function QgivEmbed() { } export default function MembershipPage() { - const [expanded, setExpanded] = useState(false); - - const handleChange = - (panel: string) => (_event: React.SyntheticEvent, isExpanded: boolean) => { - setExpanded(isExpanded ? panel : false); - }; - - const accordionSx = { - mb: 2, - "&:before": { display: "none" }, - boxShadow: "0 1px 3px 0 rgb(0 0 0 / 0.1)", - border: "1px solid #e5e7eb", - borderRadius: "8px !important", - "&.Mui-expanded": { margin: "0 0 16px 0" }, - }; - - const summaryTitleSx = { - fontWeight: 700, - fontSize: "1.25rem", - color: "#111827", - }; - return ( {/* Intro */} - - Join the coalition working on impactful initiatives for Palestinian liberation. Browse - activism initiatives looking for your skills, or start an initiative of your own with T4P - support. + + Membership dues fund training, financial grants, and volunteers for breakthrough projects + like Upscrolled, Boycat, and Newscord. + + + As a member, you are invited to join the T4P HUB. On the HUB, you can: + +
  • Browse and join teams to advocate and help with Palestinian liberation
  • +
  • Start an initiative of your own, with T4P support and resources
  • +
  • + Coming soon: Activism Journey missions to guide you through small actions like + trialing ethical tech tools or building awareness in your community. +
  • +
  • Coming soon: Community meetups
  • +
    {/* Team cards */} @@ -127,132 +124,74 @@ export default function MembershipPage() { ))}
    - {/* Mobilizing for Palestine accordion */} - - } sx={{ "& .MuiAccordionSummary-content": { my: 2 } }}> - Mobilizing for Palestine - - - - We're mobilizing tech workers and professionals – founders, engineers, marketers, - lawyers, analysts, finance pros, and more – using our unique skillsets to fight for - Palestine. With your Hub access, you can: - - -
  • - Browse and join teams scaling activism initiatives and tech projects for Palestine -
  • -
  • - Create a team for your own activism initiative, and connect with T4P members for - support and T4P leadership for strategy and resources -
  • -
  • See team updates, including progress and requests for support
  • -
    - - T4P member accounts are anonymous by default - you can choose to share information - about yourself with the community, or keep your account private. - - - Coming soon: - - -
  • Activism Journey - earn badges by trying out activism tools & taking small actions
  • -
  • Community meetups
  • -
    -
    -
    + {/* Membership Dues */} + + Membership dues are pay-what-you-can. We suggest a contribution equal to one hour's salary, + which you can calculate below: + - {/* Membership Dues accordion */} - - } sx={{ "& .MuiAccordionSummary-content": { my: 2 } }}> - Membership Dues - - - - Membership dues fund training, financial grants, and volunteers for breakthrough - projects like Upscrolled, Boycat, Thaura, Jaywalk, Newscord, and more. - - - Dues are pay-what-you-can, starting at $1 per month. We suggest a contribution equal - to one hour's salary. - - - If you are in the US, your dues are tax deductible. If you are in the UK, contact us - at{" "} - - membership@techforpalestine.org - {" "} - after signup and we will ensure that future donations are processed through our gift - aid partner. - - - Tech for Palestine aims for inclusivity. Please reach out to{" "} - - membership@techforpalestine.org - {" "} - to request a waiver of dues in the following circumstances: - - -
  • Not having access to banking services/debit card
  • -
  • Being located in Gaza or the West Bank
  • -
  • Being a refugee from Gaza or the West Bank evacuated during the genocide
  • -
  • Not being able to afford membership due to personal circumstances
  • -
  • Being a T4P paid staff member
  • -
    - - Options to pay via DAF, cryptocurrency, foundations, and other methods will be - supported in the future. We will help you migrate to your preferred method of giving - once available. - -
    -
    + - {/* Dues payment form */} + {/* Inclusivity / waiver note */} + + + Tech for Palestine aims for inclusivity. Please reach out to{" "} + + membership@techforpalestine.org + {" "} + to request a waiver of dues in the following circumstances: + + +
  • Not having access to banking services/debit card
  • +
  • Being located in Gaza or the West Bank
  • +
  • Being a refugee from Gaza or the West Bank evacuated during the genocide
  • +
  • Not being able to afford membership due to personal circumstances
  • +
  • Being a T4P paid staff member
  • +
    + + If you are in the US, your dues are tax deductible. If you are in the UK, contact us at{" "} + + membership@techforpalestine.org + {" "} + after signup and we will ensure that future donations are processed through our gift aid + partner. + + + Options to pay via DAF, cryptocurrency, foundations, and other methods will be supported + in the future. We will help you migrate to your preferred method of giving once available. + +
    + {/* Contact */}