Merge branch 'develop' into 367/matt-userid-donation-relation

GTBitsOfGood · Nov 15, 2020 · e3c3005 · e3c3005
2 parents 213f183 + 8a76659
commit e3c3005
Show file tree

Hide file tree

Showing 42 changed files with 2,274 additions and 1,024 deletions.
diff --git a/.env.local.example b/.env.local.example
@@ -9,3 +9,7 @@ NEXT_PUBLIC_GOOGLE_MAPS_KEY=
 SERVER_GOOGLE_MAPS_KEY=
 ## JWT
 JWT_SECRET=
+## Auth0
+AUTH0_CLIENT_ID=
+AUTH0_CLIENT_SECRET=
+AUTH0_DOMAIN=
diff --git a/components/LocationAutocompleteInput.tsx b/components/LocationAutocompleteInput.tsx
@@ -52,6 +52,7 @@ interface Props extends StyleProps {
   required?: boolean;
   placeholder?: string;
   outlined?: boolean;
+  clearValueOnClose?: boolean;
 }
 
 const LocationAutocompleteInput: React.FC<Props> = ({
@@ -66,7 +67,8 @@ const LocationAutocompleteInput: React.FC<Props> = ({
   label = "",
   required = false,
   placeholder = "",
-  outlined = true
+  outlined = true,
+  clearValueOnClose = false
 }) => {
   const { textStyle, highlightedText, inputAdornmentRoot } = useStyles({
     textVariant
@@ -191,6 +193,7 @@ const LocationAutocompleteInput: React.FC<Props> = ({
         inputValueOnChangeCallbackToUse &&
           inputValueOnChangeCallbackToUse(newInputValue);
       }}
+      onClose={() => void (clearValueOnClose && setValue(null))}
       renderInput={({ InputProps, ...textFieldProps }) => {
         const { inputProps, ...rest } = textFieldProps;
         // @ts-ignore: Material-ui does not include types for this :/

diff --git a/components/core/cards/NonprofitCard.tsx b/components/core/cards/NonprofitCard.tsx
@@ -150,7 +150,7 @@ const NonprofitCard: React.FC<Props> = ({ nonprofitCardData, onClick }) => {
                 Atlanta, GA
               </CoreTypography>
               <Chip
-                label={nonprofitCardData.cause.toLowerCase()}
+                label={"Causes"} //nonprofitCardData.cause.toLowerCase()}
                 className={cause}
               />
             </div>

diff --git a/components/core/footer.tsx b/components/core/footer.tsx
@@ -0,0 +1,243 @@
+import React from "react";
+
+import Container from "@material-ui/core/Container";
+import CssBaseline from "@material-ui/core/CssBaseline";
+import Divider from "@material-ui/core/Divider";
+import Typography from "@material-ui/core/Typography";
+
+/*
+import footerImage1 from "../../public/site/bog-footer.png";
+import * as logo from "../../public/site/bog-logo.png";
+import logo2 from "../../public/site/bog-logo2.png";
+*/
+import CoreButton from "./buttons/CoreButton";
+import CoreTypography from "./typography/CoreTypography";
+
+export default function FixedContainer() {
+  return (
+    <React.Fragment>
+      <CssBaseline />
+      <Container style={{ height: "558px" }}>
+        <Typography component="div" style={{ backgroundColor: "#cfe8fc" }} />
+        <div style={{ marginLeft: "40px", marginTop: "96px", float: "left" }}>
+          {/*
+          <img
+            src={footerImage1}
+            alt="bits of good footer"
+            width="587"
+            height="366"
+          />
+          */}
+        </div>
+        <div
+          style={{ float: "left", marginLeft: "117px", marginTop: "118.5px" }}
+        >
+          <CoreTypography variant="h4">Built by Students</CoreTypography>
+          <div style={{ width: "438px", marginTop: "16px", color: "#999999" }}>
+            <CoreTypography variant="h5">
+              This platform is maintained by a community of student volunteers.
+              In order to continue operating, we rely on the support of our
+              non-profit partners and sponsors.
+            </CoreTypography>
+          </div>
+
+          <CoreButton
+            variant="contained"
+            style={{
+              backgroundColor: "#FD8033",
+              color: "white",
+              height: "45px",
+              width: "133px",
+              marginTop: "36px"
+            }}
+          >
+            <CoreTypography variant="body1">Support Us</CoreTypography>
+          </CoreButton>
+        </div>
+      </Container>
+      <Divider />
+      <Container style={{ height: "337px" }}>
+        <Container
+          style={{ height: "104px", width: "906px", paddingTop: "96px" }}
+        >
+          <CoreTypography variant="h4" style={{ textAlign: "center" }}>
+            Let’s Change the World, One Bit at a Time
+          </CoreTypography>
+          <CoreTypography
+            variant="body1"
+            style={{
+              textAlign: "center",
+              color: "#999999",
+              fontSize: "24px",
+              marginTop: "16px"
+            }}
+          >
+            Select a non-profit today
+          </CoreTypography>
+        </Container>
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center"
+          }}
+        >
+          <CoreButton
+            variant="contained"
+            style={{
+              backgroundColor: "#FD8033",
+              color: "white",
+              height: "45px",
+              width: "203px",
+              marginTop: "140px"
+            }}
+          >
+            <CoreTypography variant="body1">Donate</CoreTypography>
+          </CoreButton>
+
+          <CoreButton
+            variant="contained"
+            style={{
+              backgroundColor: "#FD8033",
+              color: "white",
+              height: "45px",
+              width: "203px",
+              marginTop: "140px",
+              marginLeft: "96px"
+            }}
+          >
+            <CoreTypography variant="body1">Volunteer</CoreTypography>
+          </CoreButton>
+        </div>
+      </Container>
+      <Divider />
+      <Container style={{ height: "445px" }}>
+        <div style={{ marginTop: "72px", marginLeft: "50px", float: "left" }}>
+          {/*
+          <img src={logo} alt="bits of good logo" height="24px" width="133px" /> */}
+          <div style={{ marginTop: "10px", color: "#333333" }}>
+            <CoreTypography variant="body2">@ 2020 Bits of Good</CoreTypography>
+          </div>
+        </div>
+        <div style={{ marginLeft: "219px", marginTop: "72px", float: "left" }}>
+          <CoreTypography variant="overline">
+            <strong>ORGANIZATION</strong>
+          </CoreTypography>
+          <ul style={{ paddingLeft: "0px", listStyle: "none" }}>
+            <li>
+              <CoreTypography variant="caption">About Us</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Our Partners</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Our Sponsors</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Contact Us</CoreTypography>
+            </li>
+          </ul>
+        </div>
+        <div style={{ marginLeft: "121px", marginTop: "72px", float: "left" }}>
+          <CoreTypography variant="overline">
+            <strong>CONTRIBUTE</strong>
+          </CoreTypography>
+          <ul style={{ paddingLeft: "0px", listStyle: "none" }}>
+            <li>
+              <CoreTypography variant="caption">Sponsorship</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Partnership</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Donate</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Open Roles</CoreTypography>
+            </li>
+          </ul>
+        </div>
+        <div style={{ marginLeft: "143px", marginTop: "72px", float: "left" }}>
+          <CoreTypography variant="overline">
+            <strong>SUPPORT</strong>
+          </CoreTypography>
+          <ul style={{ paddingLeft: "0px", listStyle: "none" }}>
+            <li>
+              <CoreTypography variant="caption">Get Help</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Guides</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Give Feedback</CoreTypography>
+            </li>
+          </ul>
+        </div>
+        <div style={{ marginLeft: "166px", marginTop: "72px", float: "left" }}>
+          <CoreTypography variant="overline">
+            <strong>SOCIAL</strong>
+          </CoreTypography>
+          <ul style={{ paddingLeft: "0px", listStyle: "none" }}>
+            <li>
+              <CoreTypography variant="caption">Facebook</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Instagram</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Medium</CoreTypography>
+            </li>
+            <li style={{ marginTop: "16px" }}>
+              <CoreTypography variant="caption">Github</CoreTypography>
+            </li>
+          </ul>
+        </div>
+      </Container>
+      <div style={{ marginLeft: "149px", marginRight: "149px" }}>
+        <Divider />
+        <Container style={{ height: "81px" }}>
+          <div style={{ marginTop: "20px", float: "left" }}>
+            {/*
+            <img
+              src={logo2}
+              alt="bits of good logo"
+              width="213.62px"
+              height="19px"
+            />
+            */}
+          </div>
+          <div
+            style={{
+              float: "left",
+              marginTop: "20px",
+              marginLeft: "720px",
+              color: "#333333"
+            }}
+          >
+            <CoreTypography variant="caption">Terms</CoreTypography>
+          </div>
+          <div
+            style={{
+              float: "left",
+              marginTop: "20px",
+              marginLeft: "24px",
+              color: "#333333"
+            }}
+          >
+            <CoreTypography variant="caption">Privacy</CoreTypography>
+          </div>
+          <div
+            style={{
+              float: "left",
+              marginTop: "20px",
+              marginLeft: "24px",
+              color: "#333333"
+            }}
+          >
+            <CoreTypography variant="caption">Legal</CoreTypography>
+          </div>
+        </Container>
+      </div>
+    </React.Fragment>
+  );
+}
diff --git a/components/core/home/LandingCarousel.tsx b/components/core/home/LandingCarousel.tsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+import CardPaginationList from "@core/list/CoreCardPaginationListNonproftCarousel";
+import config from "config";
+import { NonprofitCardData, PaginatedNonprofitCards } from "utils/types";
+
+import NonprofitCard from ".././cards/NonprofitCard";
+import NonprofitCardGlimmer from "./NonprofitCardGlimmer";
+
+const LandingCarousel = (nonprofitCardData: PaginatedNonprofitCards) => {
+  return (
+    <CardPaginationList
+      paginatedCardsData={nonprofitCardData}
+      cardGlimmer={<NonprofitCardGlimmer />}
+      cardWidth={555}
+      renderCard={(cardData: NonprofitCardData) => (
+        <NonprofitCard
+          nonprofitCardData={cardData}
+          onClick={() => {
+            window.location.replace(config.pages.nonprofit(cardData._id));
+          }}
+        />
+      )}
+    />
+  );
+};
+
+export default LandingCarousel;