Remove hardcoded shapes backgrounds
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Amy 2021-08-26 21:20:28 -04:00
parent 28c45c9475
commit ff98395d9b
5 changed files with 0 additions and 115 deletions

View File

@ -306,33 +306,3 @@ export const mobileShapesConfig = {
},
],
};
// Used for Constitution, Code of Conduct, and Our Supporters desktop pages
export const aboutShapesConfig = {
cross: [
{
top: "calc(400rem / 16)",
right: "90vw",
width: "calc(225rem / 16)",
height: "calc(225rem / 16)",
transform: "rotate(30deg)",
},
],
triangleBig: [
{
bottom: "calc(120rem / 16)",
left: "91vw",
width: "calc(138rem / 16)",
height: "calc(138rem / 16)",
transform: "rotate(-25deg)",
},
],
wavesBig: [
{
top: "calc(-32rem / 16)",
left: "88vw",
width: "calc(296rem / 16)",
height: "calc(254rem / 16)",
},
],
};

View File

@ -2,17 +2,11 @@ import path from "path";
import { createReadAllPage } from "@/components/OrganizedContent/ReadAll";
import { createReadAllGetStaticProps } from "@/components/OrganizedContent/static";
import {
mobileShapesConfig,
aboutShapesConfig,
} from "@/components/ShapesBackground";
export const options = {
title: "Code of Conduct",
image: "images/code-of-conduct.svg",
pagePath: path.join("about", "code-of-conduct"),
getShapesConfig: () =>
window.innerWidth <= 768 ? mobileShapesConfig : aboutShapesConfig,
};
export default createReadAllPage(options);

View File

@ -2,17 +2,11 @@ import path from "path";
import { createReadAllPage } from "@/components/OrganizedContent/ReadAll";
import { createReadAllGetStaticProps } from "@/components/OrganizedContent/static";
import {
mobileShapesConfig,
aboutShapesConfig,
} from "@/components/ShapesBackground";
export const options = {
title: "Constitution",
image: "images/constitution.svg",
pagePath: path.join("about", "constitution"),
getShapesConfig: () =>
window.innerWidth <= 768 ? mobileShapesConfig : aboutShapesConfig,
};
export default createReadAllPage(options);

View File

@ -1,11 +1,6 @@
import React from "react";
import { Image } from "@/components/Image";
import {
GetShapesConfig,
aboutShapesConfig,
mobileShapesConfig,
} from "@/components/ShapesBackground";
import Content from "../../content/about/our-supporters.mdx";
@ -24,7 +19,3 @@ export default function OurSupporters() {
</>
);
}
OurSupporters.getShapesConfig = (() => {
return window.innerWidth <= 768 ? mobileShapesConfig : aboutShapesConfig;
}) as GetShapesConfig;

View File

@ -3,10 +3,6 @@ import React from "react";
import { ConnectWithUs } from "@/components/ConnectWithUs";
import { EmailSignup } from "@/components/EmailSignup";
import { Image } from "@/components/Image";
import {
GetShapesConfig,
mobileShapesConfig,
} from "@/components/ShapesBackground";
import Content from "../content/get-involved.mdx";
@ -37,63 +33,3 @@ export default function GetInvolved() {
</div>
);
}
GetInvolved.getShapesConfig = (() => {
const desktopConfig = {
hash: [
{
top: "calc(860rem / 16)",
right: "90vw",
width: "calc(60rem / 16)",
height: "calc(60rem / 16)",
filter: "var(--teal)",
opacity: "30%",
},
],
plus: [
{
top: "calc(540rem / 16)",
left: "90vw",
width: "calc(48rem / 16)",
height: "calc(48rem / 16)",
filter: "var(--teal)",
opacity: "30%",
},
],
triangle: [
{
top: "calc(280rem / 16)",
right: "86vw",
width: "calc(68rem / 16)",
height: "calc(68rem / 16)",
transform: "rotate(-26deg)",
filter: "var(--teal)",
opacity: "30%",
},
],
waves: [
{
bottom: "calc(580rem / 16)",
left: "88vw",
width: "calc(116rem / 16)",
height: "calc(58rem / 16)",
filter: "var(--teal)",
opacity: "30%",
},
],
wavesBig: [
{
top: "0",
right: "89vw",
width: "calc(234rem / 16)",
height: "calc(115rem / 16)",
transform: "scaleX(-1)",
},
],
};
if (window.innerWidth <= 768) {
return mobileShapesConfig;
}
return desktopConfig;
}) as GetShapesConfig;