pr fixes yay
continuous-integration/drone/push Build is failing
Details
continuous-integration/drone/push Build is failing
Details
This commit is contained in:
parent
bc27350e9d
commit
aa47644d41
|
@ -4,9 +4,7 @@
|
|||
"eslint.codeActionsOnSave.mode": "all",
|
||||
"[css]": {
|
||||
"editor.suggest.insertMode": "replace",
|
||||
"gitlens.codeLens.scopes": [
|
||||
"document"
|
||||
],
|
||||
"gitlens.codeLens.scopes": ["document"],
|
||||
"editor.formatOnSave": true
|
||||
},
|
||||
"[javascript]": {
|
||||
|
@ -38,5 +36,6 @@
|
|||
"files.exclude": {
|
||||
"node_modules": true
|
||||
},
|
||||
"editor.tabSize": 2
|
||||
}
|
||||
"editor.tabSize": 2,
|
||||
"files.eol": "\n"
|
||||
}
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
import React from "react";
|
||||
|
||||
import { Image } from "./Image";
|
||||
|
||||
import styles from "./TeamMember.module.css";
|
||||
|
||||
interface TeamMemberProps {
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
import React, { useState } from "react";
|
||||
|
||||
import { useWindowDimension } from "@/hooks/useWindowDimension";
|
||||
|
||||
import { Image } from "./Image";
|
||||
import { useWindowDimension } from "../hooks/useWindowDimension";
|
||||
|
||||
import styles from "./TeamMemberCard.module.css";
|
||||
|
||||
export interface TeamMemberCardProps {
|
||||
|
@ -10,6 +13,35 @@ export interface TeamMemberCardProps {
|
|||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
interface TeamMemberInfoProps extends TeamMemberCardProps {
|
||||
isPopup?: boolean;
|
||||
}
|
||||
|
||||
function TeamMemberInfo({
|
||||
name,
|
||||
role,
|
||||
image,
|
||||
children,
|
||||
isPopup = false,
|
||||
}: TeamMemberInfoProps) {
|
||||
return (
|
||||
<>
|
||||
<div className={styles.picture}>
|
||||
<Image
|
||||
className={isPopup ? styles.popupImage : styles.image}
|
||||
src={image}
|
||||
alt={`Picture of ${name}`}
|
||||
/>
|
||||
</div>
|
||||
<h1 className={isPopup ? styles.popupName : styles.name}>{name}</h1>
|
||||
<h2 className={isPopup ? styles.popupRole : styles.role}>{role}</h2>
|
||||
<div className={isPopup ? styles.popupDescription : styles.description}>
|
||||
{children}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export function TeamMemberCard({
|
||||
name,
|
||||
role,
|
||||
|
@ -26,17 +58,9 @@ export function TeamMemberCard({
|
|||
return (
|
||||
<>
|
||||
<article className={styles.card} onClick={handleClick}>
|
||||
<div className={styles.picture}>
|
||||
<Image
|
||||
className={styles.image}
|
||||
src={image}
|
||||
alt={`Picture of ${name}`}
|
||||
/>
|
||||
</div>
|
||||
<h1 className={styles.name}>{name}</h1>
|
||||
<h2 className={styles.role}>{role}</h2>
|
||||
<div className={styles.description}>{children}</div>
|
||||
<TeamMemberInfo {...{ name, role, image }}>{children}</TeamMemberInfo>
|
||||
</article>
|
||||
|
||||
{isOpen && (
|
||||
<ExecPopup
|
||||
name={name}
|
||||
|
@ -64,16 +88,9 @@ function ExecPopup({ name, role, image, children, handleClick }: Propup) {
|
|||
<Image src="images/team/popup-close.svg" />
|
||||
</button>
|
||||
<div className={styles.popupContent}>
|
||||
<div className={styles.picture}>
|
||||
<Image
|
||||
className={styles.popupImage}
|
||||
src={image}
|
||||
alt={`Picture of ${name}`}
|
||||
/>
|
||||
</div>
|
||||
<h1 className={styles.popupName}>{name}</h1>
|
||||
<h2 className={styles.popupRole}>{role}</h2>
|
||||
<div className={styles.popupDescription}>{children}</div>
|
||||
<TeamMemberInfo {...{ name, role, image }} isPopup={true}>
|
||||
{children}
|
||||
</TeamMemberInfo>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
|
|
@ -162,16 +162,16 @@ export function TeamMemberDemo() {
|
|||
</div>
|
||||
<hr />
|
||||
<div className={styles.teamMembers}>
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
<TeamMember {...dogeMetadata} image="/images/playground/doge.jpg" />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@ -180,7 +180,7 @@ export function TeamMemberDemo() {
|
|||
export function TeamMemberCardDemo() {
|
||||
return (
|
||||
<div className={styles.teamMemberCardDemo}>
|
||||
<TeamMemberCard {...codeyMetadata}>
|
||||
<TeamMemberCard {...codeyMetadata} image="/images/playground/doge.jpg">
|
||||
<CodeyInfo />
|
||||
</TeamMemberCard>
|
||||
</div>
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
import { readFile, readdir, access } from "fs/promises";
|
||||
import { serialize } from "next-mdx-remote/serialize";
|
||||
import path from "path";
|
||||
|
||||
import matter from "gray-matter";
|
||||
import { serialize } from "next-mdx-remote/serialize";
|
||||
|
||||
const EXECS_PATH = path.join("content", "meet-the-team", "execs");
|
||||
const fileType = ".md";
|
||||
|
|
|
@ -50,18 +50,14 @@
|
|||
}
|
||||
|
||||
.elections {
|
||||
margin-top: 6rem;
|
||||
margin: 6rem 0;
|
||||
}
|
||||
|
||||
.electionSubheading {
|
||||
color: var(--primary-accent);
|
||||
font-size: calc(36rem / 16);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.elections > p {
|
||||
margin: 0;
|
||||
line-height: 1.875;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: calc(768rem / 16)) {
|
||||
|
@ -95,14 +91,12 @@
|
|||
padding-bottom: calc(15rem / 16);
|
||||
}
|
||||
|
||||
.execs, .members {
|
||||
.execs,
|
||||
.members {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(calc(130rem / 16), 1fr));
|
||||
justify-items: center;
|
||||
}
|
||||
|
||||
.elections {
|
||||
padding: 2rem;
|
||||
column-gap: 0;
|
||||
}
|
||||
|
||||
.electionSubheading {
|
||||
|
|
|
@ -1,24 +1,27 @@
|
|||
import { GetStaticProps } from "next";
|
||||
import { MDXRemote, MDXRemoteSerializeResult } from "next-mdx-remote";
|
||||
import React from "react";
|
||||
|
||||
import { Bubble } from "@/components/Bubble";
|
||||
import { DefaultLayout } from "@/components/DefaultLayout";
|
||||
import { Image } from "@/components/Image";
|
||||
import { Link } from "@/components/Link";
|
||||
import { TeamMember } from "@/components/TeamMember";
|
||||
import { TeamMemberCard } from "@/components/TeamMemberCard";
|
||||
import {
|
||||
getExec,
|
||||
getExecNames,
|
||||
Metadata,
|
||||
getMemberImagePath,
|
||||
} from "../../lib/team";
|
||||
import { MDXRemote, MDXRemoteSerializeResult } from "next-mdx-remote";
|
||||
import { GetStaticProps } from "next";
|
||||
import { Image } from "../../components/Image";
|
||||
import { TeamMemberCard } from "../../components/TeamMemberCard";
|
||||
import { TeamMember } from "../../components/TeamMember";
|
||||
import { Link } from "../../components/Link";
|
||||
import { Bubble } from "../../components/Bubble";
|
||||
} from "@/lib/team";
|
||||
|
||||
import programmeData from "../../content/meet-the-team/programme-committee.json";
|
||||
import websiteData from "../../content/meet-the-team/website-committee.json";
|
||||
import systemsData from "../../content/meet-the-team/systems-committee.json";
|
||||
import websiteData from "../../content/meet-the-team/website-committee.json";
|
||||
|
||||
import styles from "./team.module.css";
|
||||
|
||||
// TODO: fix hotdog for elections
|
||||
// change News link in elections to point to News page
|
||||
// TODO: link News page in Elections
|
||||
|
||||
interface SerializedExec {
|
||||
content: MDXRemoteSerializeResult;
|
||||
|
@ -35,60 +38,66 @@ interface Props {
|
|||
export default function Team({ execs, programme, website, systems }: Props) {
|
||||
return (
|
||||
<>
|
||||
<div className={styles.headerContainer}>
|
||||
<div className={styles.headerTextContainer}>
|
||||
<h1 className={styles.header}>Meet the Team!</h1>
|
||||
<div className={styles.nav}>
|
||||
<Link href="#execs">The Executives</Link>
|
||||
<Link href="#programme">Programme Committee</Link>
|
||||
<Link href="#website">Website Committee</Link>
|
||||
<Link href="#system">Systems Committee</Link>
|
||||
</div>
|
||||
<h2
|
||||
className={styles.subheading}
|
||||
style={{ borderBottom: "none", margin: 0, padding: 0 }}
|
||||
>
|
||||
The Executives
|
||||
</h2>
|
||||
</div>
|
||||
<Image src="images/team/team-codey.svg" className={styles.codey} />
|
||||
</div>
|
||||
<div className={styles.execs} id="execs">
|
||||
{execs.map((exec) => {
|
||||
return (
|
||||
<div key={exec.metadata.name}>
|
||||
<TeamMemberCard {...exec.metadata}>
|
||||
<MDXRemote {...exec.content} />
|
||||
</TeamMemberCard>
|
||||
<DefaultLayout>
|
||||
<div className={styles.headerContainer}>
|
||||
<div className={styles.headerTextContainer}>
|
||||
<h1 className={styles.header}>Meet the Team!</h1>
|
||||
<div className={styles.nav}>
|
||||
<Link href="#execs">The Executives</Link>
|
||||
<Link href="#programme">Programme Committee</Link>
|
||||
<Link href="#website">Website Committee</Link>
|
||||
<Link href="#system">Systems Committee</Link>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<div id="programme">
|
||||
<h2 className={styles.subheading}>Programme Committee</h2>
|
||||
<MembersList team={programme} />
|
||||
</div>
|
||||
<div id="website">
|
||||
<h2 className={styles.subheading}>Website Committee</h2>
|
||||
<MembersList team={website} />
|
||||
</div>
|
||||
<div id="system">
|
||||
<h2 className={styles.subheading}>Systems Committee</h2>
|
||||
<MembersList team={systems} />
|
||||
</div>
|
||||
<Bubble>
|
||||
<div className={styles.elections}>
|
||||
<h2
|
||||
className={styles.subheading}
|
||||
style={{ borderBottom: "none", margin: 0, padding: 0 }}
|
||||
>
|
||||
The Executives
|
||||
</h2>
|
||||
</div>
|
||||
<Image src="images/team/team-codey.svg" className={styles.codey} />
|
||||
</div>
|
||||
<div className={styles.execs} id="execs">
|
||||
{execs.map((exec) => {
|
||||
return (
|
||||
<div key={exec.metadata.name}>
|
||||
<TeamMemberCard {...exec.metadata}>
|
||||
<MDXRemote {...exec.content} />
|
||||
</TeamMemberCard>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<div id="programme">
|
||||
<h2 className={styles.subheading}>Programme Committee</h2>
|
||||
<MembersList team={programme} />
|
||||
</div>
|
||||
<div id="website">
|
||||
<h2 className={styles.subheading}>Website Committee</h2>
|
||||
<MembersList team={website} />
|
||||
</div>
|
||||
<div id="system">
|
||||
<h2 className={styles.subheading}>Systems Committee</h2>
|
||||
<MembersList team={systems} />
|
||||
</div>
|
||||
</DefaultLayout>
|
||||
<div className={styles.elections}>
|
||||
<Bubble>
|
||||
<h2 className={styles.electionSubheading}>Elections</h2>
|
||||
To find out when and where the next elections will be held, keep an
|
||||
eye on on the <Link href="">News</Link>. <br />
|
||||
For details on the elections, read our
|
||||
<Link href="/about/constitution"> Constitution</Link>
|
||||
</div>
|
||||
</Bubble>
|
||||
</Bubble>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Team.Layout = function TeamLayout(props: { children: React.ReactNode }) {
|
||||
return <div>{props.children}</div>;
|
||||
};
|
||||
|
||||
interface MembersProps {
|
||||
team: Metadata[];
|
||||
}
|
||||
|
@ -103,7 +112,7 @@ function MembersList(props: MembersProps) {
|
|||
);
|
||||
}
|
||||
|
||||
async function getMemberImage(team: Omit<Metadata, "image">[]) {
|
||||
async function getTeamWithImages(team: Omit<Metadata, "image">[]) {
|
||||
return await Promise.all(
|
||||
team.map(async (member) => {
|
||||
const image = await getMemberImagePath(member.name);
|
||||
|
@ -120,9 +129,11 @@ export const getStaticProps: GetStaticProps<Props> = async () => {
|
|||
const execs = (await Promise.all(
|
||||
execNames.map((name) => getExec(name))
|
||||
)) as SerializedExec[];
|
||||
const programme = await getMemberImage(programmeData);
|
||||
const website = await getMemberImage(websiteData);
|
||||
const systems = await getMemberImage(systemsData);
|
||||
const [programme, website, systems] = await Promise.all([
|
||||
getTeamWithImages(programmeData),
|
||||
getTeamWithImages(websiteData),
|
||||
getTeamWithImages(systemsData),
|
||||
]);
|
||||
|
||||
return {
|
||||
props: { execs, programme, website, systems },
|
||||
|
|
|
@ -2,11 +2,7 @@
|
|||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"target": "es5",
|
||||
"lib": [
|
||||
"dom",
|
||||
"dom.iterable",
|
||||
"esnext"
|
||||
],
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": false,
|
||||
|
@ -26,16 +22,10 @@
|
|||
"strictFunctionTypes": true,
|
||||
"paths": {
|
||||
"@/components/*": ["components/*"],
|
||||
"@/lib/*": ["lib/*"]
|
||||
"@/lib/*": ["lib/*"],
|
||||
"@/hooks/*": ["hooks/*"]
|
||||
}
|
||||
},
|
||||
"include": [
|
||||
"next-env.d.ts",
|
||||
"types.d.ts",
|
||||
"**/*.ts",
|
||||
"**/*.tsx"
|
||||
],
|
||||
"exclude": [
|
||||
"node_modules"
|
||||
]
|
||||
"include": ["next-env.d.ts", "types.d.ts", "**/*.ts", "**/*.tsx"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue