-
-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: created sponsor DA section on tech pg
- Loading branch information
1 parent
a26f049
commit a968dfb
Showing
3 changed files
with
109 additions
and
16 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,89 @@ | ||
| import { | ||
| Container, | ||
| Flex, | ||
| Box, | ||
| Heading, | ||
| Text, | ||
| Strong, | ||
| Grid, | ||
| Button, | ||
| } from "@radix-ui/themes"; | ||
| import Image from "next/image"; | ||
|
|
||
| const SponsorSection = () => { | ||
| return ( | ||
| <Container size={{ xs: "1", sm: "2", md: "3", lg: "4" }} align="center"> | ||
| <Flex width="100%" direction="column" align="center" justify="center"> | ||
| {/* is there a global title color/theme rather than hard coding it in? */} | ||
| <Heading align={"center"} size={"8"} className="text-[#051E5E]"> | ||
| Sponsor Distribute Aid's Tech Team | ||
| </Heading> | ||
| <Grid | ||
| columns={{ initial: "1", sm: "2" }} | ||
| py={"6"} | ||
| gap={"4"} | ||
| width={"auto"} | ||
| > | ||
| {/* images */} | ||
| <Flex position={"relative"} align={"center"}> | ||
| <Box | ||
| display={{ initial: "none", sm: "block" }} | ||
| ml={"-100%"} | ||
| width={"150%"} | ||
| height={"100%"} | ||
| className="bg-[#1D2F73] rounded-r-[32px]" | ||
| ></Box> | ||
| <Box position={{ sm: "absolute" }} z-index={"1"}> | ||
| <Image | ||
| className="rounded-l-[32px]" | ||
| width={"540"} | ||
| height={"340"} | ||
| src={"/images/tech/Sponsor-DA-Tech.jpg"} | ||
| alt="img of hands coming together" | ||
| ></Image> | ||
| </Box> | ||
| </Flex> | ||
| {/* text + button */} | ||
| <Flex | ||
| direction={"column"} | ||
| align={{ initial: "center", sm: "start" }} | ||
| px={"2"} | ||
| gap={"6"} | ||
| > | ||
| <Text size={"4"}> | ||
| <Strong> | ||
| Our tech team, including Open Source Explorers, runs entirely on | ||
| volunteer work. | ||
| </Strong>{" "} | ||
| Funding allows us to create a stable base for our team, cover the | ||
| cost of the tools we use to do our work and make faster progress | ||
| on the issues we work on. This allows us to better support | ||
| Distribute Aid directly. | ||
| </Text> | ||
|
|
||
| <Text size={"4"}> | ||
| Ultimately, our tech-based solutions allow workers from the entire | ||
| global aid community to act faster and more efficiently. Funding | ||
| also allows us to run more Open Source Explorers cohorts, which | ||
| benefits the OSS ecosystem at large. If you’re interested in | ||
| becoming a sponsor, please get in touch with us. | ||
| </Text> | ||
|
|
||
| <Text size={"4"}> | ||
| <Strong> | ||
| If you’re interested in becoming a sponsor, please get in touch | ||
| with us. | ||
| </Strong>{" "} | ||
| </Text> | ||
|
|
||
| <Button size="4" className=" w-max font-normal cursor-pointer"> | ||
| Become A Sponsor | ||
| </Button> | ||
| </Flex> | ||
| </Grid> | ||
| </Flex> | ||
| </Container> | ||
| ); | ||
| }; | ||
|
|
||
| export default SponsorSection; |