Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Minor fixes on Fiscal Sponsorship #1091

Merged
merged 1 commit into from Mar 3, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
3 changes: 1 addition & 2 deletions components/fiscal-sponsorship/features.js
Expand Up @@ -28,7 +28,7 @@ export default function Features() {
<Module
icon="card"
name="Issue physical & virtual debit cards"
body="for your team, with  Pay support."
body="with receipt tracking & Apple Pay."
/>
<Module
icon="web"
Expand Down Expand Up @@ -91,7 +91,6 @@ function Module({ icon, name, body }) {
color: 'slate',
lineHeight: '1.375',
fontSize: 20,
alignSelf: 'center',
m: 0
}}
>
Expand Down
4 changes: 2 additions & 2 deletions components/stat.js
Expand Up @@ -34,7 +34,7 @@ const Stat = ({
as="span"
sx={{
color,
fontSize: lg ? [5, 6, 7] : sm ? [3, 4] : [4, 5, 6],
fontSize: lg ? [5, 6, 7] : sm ? [3, 4] : [5, 6],
fontWeight: 'heading',
letterSpacing: 'title',
my: 0
Expand Down Expand Up @@ -78,7 +78,7 @@ const Stat = ({
as="span"
variant="caption"
sx={{
fontSize: lg ? [1, 2, 3] : [0, 1],
fontSize: lg ? [1, 2, 3] : 1,
letterSpacing: 'headline',
textTransform: 'uppercase'
}}
Expand Down
49 changes: 31 additions & 18 deletions pages/fiscal-sponsorship/index.js
Expand Up @@ -138,7 +138,7 @@ export default function Page() {
as="header"
sx={{
position: 'relative',
pt: [5, 6],
pt: 6,
pb: [4, 5],
bg: 'rgb(104, 41, 205)',
backgroundImage:
Expand Down Expand Up @@ -169,8 +169,8 @@ export default function Page() {
position: 'absolute',
right: [3, 0],
bottom: 0,
width: [128, 200, 300],
height: [128, 200, 300],
width: [114, 200, 300],
height: [114, 200, 300],
opacity: 0.5
}
}}
Expand Down Expand Up @@ -205,7 +205,7 @@ export default function Page() {
sx={{
fontSize: [5, 6, null, 7],
// magic number to align with the grid
mt: [null, null, -3],
mt: -3,
lineHeight: [null, null, 1.03],
span: {
WebkitTextStroke: 'currentColor',
Expand All @@ -217,15 +217,22 @@ export default function Page() {
>
<span>The foundation</span> of your nonprofit.
</Heading>
<Text as="p" variant="lead" sx={{ mt: 4, mb: 4 }}>
<Text as="p" variant="lead" sx={{ my: [3, 4] }}>
<Balancer>
Start your nonprofit with{' '}
<strong>our fiscal sponsorship program, HCB</strong>: a 501(c)(3)
legal entity, bank account, automatic taxes & accounting, and
best-in-class app.
best-in-class software.
</Balancer>
</Text>
<Flex sx={{ mt: [3, 4], gap: [3, 4], alignItems: 'center' }}>
<Flex
sx={{
flexDirection: ['column', 'row'],
mt: [3, 4],
gap: [3, 4],
alignItems: ['start', 'center']
}}
>
<Link href="/fiscal-sponsorship/apply" passHref legacyBehavior>
<Button
as="a"
Expand All @@ -250,12 +257,19 @@ export default function Page() {
</Flex>
</Container>
</Box>
<Box id="organizations" as="section" sx={{ py: 5 }}>
<Box id="organizations" as="section" sx={{ py: [4, 5] }}>
<Container sx={{}}>
{/* <Text as="p" variant="headline" sx={{ mt: 0 }}>
Powering nonprofits at every scale
</Text> */}
<Flex wrap sx={{ alignItems: 'end', gap: [4, 5], mb: 4 }}>
<Flex
sx={{
flexWrap: 'wrap',
rowGap: 3,
columnGap: [4, 5],
mb: 4
}}
>
<Stat value="$20M+" label="processed transactions" reversed />
<Stat value="1500+" label="projects" reversed />
<Stat value="2018" label="serving nonprofits since" reversed />
Expand Down Expand Up @@ -345,7 +359,7 @@ export default function Page() {

<Box id="fees" as="section" sx={{ position: 'relative', py: 5 }}>
<Container>
<Grid columns={[null, null, 2]} gap={5}>
<Grid columns={[null, null, 2]} gap={[4, 5]}>
<div>
<Text
variant="title"
Expand Down Expand Up @@ -479,7 +493,7 @@ export default function Page() {
<Grid
columns={[null, null, 2]}
gap={[4, 5]}
sx={{ py: 5, p: { fontSize: 2 } }}
sx={{ py: 5, p: { fontSize: 2, '&:last-child': { mb: 0 } } }}
>
<Link href="https://outernet.hackclub.com/">
<Photo
Expand All @@ -504,9 +518,8 @@ export default function Page() {
<p>
We started HCB in 2018 to support our clubs and hackathons. After
showing it to our educational partners, we knew we had tapped into
something much larger. We designed the tool to remove financial
and legal barriers for anyone trying to do good in their
community.
something much larger. We designed HCB to remove financial and
legal barriers for anyone trying to do good in their community.
</p>
</div>
</Grid>
Expand All @@ -517,7 +530,7 @@ export default function Page() {
id="apply"
sx={{
py: 6,
px: 4,
px: 3,
backgroundImage:
'radial-gradient(ellipse at 5% 5%, #e86494 0%, rgba(232,100,148,0) 75%),radial-gradient(ellipse at 95% 5%, #e86494 0%, rgba(232,100,148,0) 75%),radial-gradient(ellipse at 95% 95%, #baa8d3 0%, rgba(186,168,211,0) 75%),radial-gradient(ellipse at 5% 95%, #fa9f69 0%, rgba(250,159,105,0) 75%)',
position: 'relative'
Expand Down Expand Up @@ -554,8 +567,8 @@ export default function Page() {
bg: 'white',
mixBlendMode: 'screen',
color: 'black !important',
fontSize: [72, 96],
borderRadius: [48, 75],
fontSize: [58, 96],
width: ['100%', 'auto'],
py: 4,
px: [4, null, 6],
lineHeight: 0.9,
Expand All @@ -566,7 +579,7 @@ export default function Page() {
</Button>
</Link>
<Text as="p" variant="lead" sx={{ color: 'white' }}>
<Balancer>No startup fees, no minimum balance.</Balancer>
<Balancer>No startup fees, no&nbsp;minimum balance.</Balancer>
</Text>
</Flex>
</Box>
Expand Down