fix design
continuous-integration/drone/push Build is failing
Details
|
@ -0,0 +1,30 @@
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"name": "Juthika Hoque",
|
||||||
|
"role": "President"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Eric Huang",
|
||||||
|
"role": "Vice President"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Dina Orucevic",
|
||||||
|
"role": "Assistant Vice President"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Eden Chan",
|
||||||
|
"role": "Treasurer"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Raymond Li",
|
||||||
|
"role": "Systems Administrator"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Amy Wang",
|
||||||
|
"role": "Web Master"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Neil Parikh",
|
||||||
|
"role": "Office Manager"
|
||||||
|
}
|
||||||
|
]
|
After Width: | Height: | Size: 52 KiB |
After Width: | Height: | Size: 205 KiB |
After Width: | Height: | Size: 2.2 MiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 1.2 MiB |
After Width: | Height: | Size: 733 KiB |
After Width: | Height: | Size: 461 KiB |
After Width: | Height: | Size: 277 KiB |
After Width: | Height: | Size: 1012 KiB |
After Width: | Height: | Size: 51 KiB |
After Width: | Height: | Size: 177 KiB |
After Width: | Height: | Size: 897 KiB |
After Width: | Height: | Size: 4.6 MiB |
After Width: | Height: | Size: 320 KiB |
10
lib/team.ts
|
@ -96,7 +96,7 @@ export async function getExec(name: string, pos: string, convert = true) {
|
||||||
const raw = await readFile(path.join(EXECS_PATH, `${name}${FILETYPE}`));
|
const raw = await readFile(path.join(EXECS_PATH, `${name}${FILETYPE}`));
|
||||||
({ content, data: metadata } = matter(raw));
|
({ content, data: metadata } = matter(raw));
|
||||||
|
|
||||||
const image = await getMemberImagePath(metadata.name);
|
const image = await getMemberImagePath(metadata.name, true);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
content: convert ? await serialize(content) : content,
|
content: convert ? await serialize(content) : content,
|
||||||
|
@ -114,7 +114,7 @@ export async function getExec(name: string, pos: string, convert = true) {
|
||||||
role: `${posName}`,
|
role: `${posName}`,
|
||||||
};
|
};
|
||||||
|
|
||||||
const image = await getMemberImagePath(metadata.name);
|
const image = await getMemberImagePath(metadata.name, true);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
content: convert ? await serialize(content) : content,
|
content: convert ? await serialize(content) : content,
|
||||||
|
@ -132,8 +132,10 @@ async function getImage(imgPath: string) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getMemberImagePath(name: string) {
|
export async function getMemberImagePath(name: string, currentTeam: boolean) {
|
||||||
const imgPath = path.join("images", "team", name.replace(" ", ""));
|
const imgPath = currentTeam
|
||||||
|
? path.join("images", "team", name.replace(" ", ""))
|
||||||
|
: path.join("images", "execs", name.replace(" ", ""));
|
||||||
const placeholder = path.join(
|
const placeholder = path.join(
|
||||||
"images",
|
"images",
|
||||||
"team",
|
"team",
|
||||||
|
|
|
@ -0,0 +1,98 @@
|
||||||
|
.headerContainer {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
padding-bottom: calc(24rem / 16);
|
||||||
|
border-bottom: calc(1rem / 16) var(--primary-heading);
|
||||||
|
margin-bottom: calc(32rem / 16);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headerTextContainer {
|
||||||
|
margin: auto 0 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
color: var(--primary-heading);
|
||||||
|
font-size: calc(48rem / 16);
|
||||||
|
margin: 0 calc(53rem / 16) 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subheading {
|
||||||
|
color: var(--primary-heading);
|
||||||
|
font-size: calc(36rem / 16);
|
||||||
|
font-weight: 600;
|
||||||
|
padding-bottom: calc(22rem / 16);
|
||||||
|
border-bottom: calc(1rem / 16) solid var(--primary-heading);
|
||||||
|
margin-bottom: calc(32rem / 16);
|
||||||
|
margin-top: calc(46rem / 16);
|
||||||
|
}
|
||||||
|
|
||||||
|
.codey {
|
||||||
|
width: calc(360rem / 16);
|
||||||
|
}
|
||||||
|
|
||||||
|
.members {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(calc(100rem / 16), 1fr));
|
||||||
|
row-gap: calc(43rem / 16);
|
||||||
|
column-gap: calc(53rem / 16);
|
||||||
|
justify-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info {
|
||||||
|
margin: 6rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoSubheading {
|
||||||
|
color: var(--primary-accent);
|
||||||
|
font-size: calc(36rem / 16);
|
||||||
|
font-weight: 600;
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: calc(768rem / 16)) {
|
||||||
|
.headerContainer {
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
margin-top: calc(30rem / 16);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav {
|
||||||
|
margin-top: calc(24rem / 16);
|
||||||
|
margin-bottom: calc(46rem / 16);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.codey {
|
||||||
|
width: calc(140rem / 16);
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
font-size: calc(24rem / 16);
|
||||||
|
margin: calc(10rem / 16) 0 0 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subheading {
|
||||||
|
font-size: calc(24rem / 16);
|
||||||
|
padding-bottom: calc(15rem / 16);
|
||||||
|
}
|
||||||
|
|
||||||
|
.members {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(calc(130rem / 16), 1fr));
|
||||||
|
justify-items: center;
|
||||||
|
column-gap: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoSubheading {
|
||||||
|
font-size: calc(24rem / 16);
|
||||||
|
}
|
||||||
|
}
|
|
@ -12,17 +12,29 @@ import { Metadata, getMemberImagePath } from "@/lib/team";
|
||||||
import F21ExecData from "../../content/past-execs/2021/fall.json";
|
import F21ExecData from "../../content/past-execs/2021/fall.json";
|
||||||
import S21ExecData from "../../content/past-execs/2021/spring.json";
|
import S21ExecData from "../../content/past-execs/2021/spring.json";
|
||||||
import W21ExecData from "../../content/past-execs/2021/winter.json";
|
import W21ExecData from "../../content/past-execs/2021/winter.json";
|
||||||
|
import W22ExecData from "../../content/past-execs/2022/winter.json";
|
||||||
|
|
||||||
import styles from "./team.module.css";
|
import styles from "./executives.module.css";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
F21Exec: Metadata[];
|
F21Exec: Metadata[];
|
||||||
S21Exec: Metadata[];
|
S21Exec: Metadata[];
|
||||||
W21Exec: Metadata[];
|
W21Exec: Metadata[];
|
||||||
|
W22Exec: Metadata[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function Team({ F21Exec, S21Exec, W21Exec }: Props) {
|
export default function Executives({
|
||||||
|
F21Exec,
|
||||||
|
S21Exec,
|
||||||
|
W21Exec,
|
||||||
|
W22Exec,
|
||||||
|
}: Props) {
|
||||||
const teams = [
|
const teams = [
|
||||||
|
{
|
||||||
|
id: "W22Exec",
|
||||||
|
name: "Winter 2022",
|
||||||
|
members: W22Exec,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "F21Exec",
|
id: "F21Exec",
|
||||||
name: "Fall 2021",
|
name: "Fall 2021",
|
||||||
|
@ -63,9 +75,9 @@ export default function Team({ F21Exec, S21Exec, W21Exec }: Props) {
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</DefaultLayout>
|
</DefaultLayout>
|
||||||
<div className={styles.elections}>
|
<div className={styles.info}>
|
||||||
<Bubble>
|
<Bubble>
|
||||||
<h2 className={styles.electionSubheading}>More information</h2>
|
<h2 className={styles.infoSubheading}>More information</h2>
|
||||||
To learn more about our past executives, see our{" "}
|
To learn more about our past executives, see our{" "}
|
||||||
<Link href="https://wiki.csclub.uwaterloo.ca/Past_Executive">
|
<Link href="https://wiki.csclub.uwaterloo.ca/Past_Executive">
|
||||||
Wikipedia
|
Wikipedia
|
||||||
|
@ -77,7 +89,7 @@ export default function Team({ F21Exec, S21Exec, W21Exec }: Props) {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
Team.Layout = function TeamLayout(props: { children: React.ReactNode }) {
|
Executives.Layout = function TeamLayout(props: { children: React.ReactNode }) {
|
||||||
return <div>{props.children}</div>;
|
return <div>{props.children}</div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -100,7 +112,8 @@ type TeamMember = Omit<Metadata, "image"> & { image?: string };
|
||||||
async function getTeamWithImages(team: TeamMember[]) {
|
async function getTeamWithImages(team: TeamMember[]) {
|
||||||
return await Promise.all(
|
return await Promise.all(
|
||||||
team.map(async (member) => {
|
team.map(async (member) => {
|
||||||
const image = member.image ?? (await getMemberImagePath(member.name));
|
const image =
|
||||||
|
member.image ?? (await getMemberImagePath(member.name, false));
|
||||||
return {
|
return {
|
||||||
...member,
|
...member,
|
||||||
image,
|
image,
|
||||||
|
@ -110,10 +123,11 @@ async function getTeamWithImages(team: TeamMember[]) {
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getStaticProps: GetStaticProps<Props> = async () => {
|
export const getStaticProps: GetStaticProps<Props> = async () => {
|
||||||
const [F21Exec, S21Exec, W21Exec] = await Promise.all([
|
const [F21Exec, S21Exec, W21Exec, W22Exec] = await Promise.all([
|
||||||
getTeamWithImages(F21ExecData),
|
getTeamWithImages(F21ExecData),
|
||||||
getTeamWithImages(S21ExecData),
|
getTeamWithImages(S21ExecData),
|
||||||
getTeamWithImages(W21ExecData),
|
getTeamWithImages(W21ExecData),
|
||||||
|
getTeamWithImages(W22ExecData),
|
||||||
]);
|
]);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
@ -121,6 +135,7 @@ export const getStaticProps: GetStaticProps<Props> = async () => {
|
||||||
F21Exec,
|
F21Exec,
|
||||||
S21Exec,
|
S21Exec,
|
||||||
W21Exec,
|
W21Exec,
|
||||||
|
W22Exec,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
|
@ -103,4 +103,4 @@
|
||||||
.electionSubheading {
|
.electionSubheading {
|
||||||
font-size: calc(24rem / 16);
|
font-size: calc(24rem / 16);
|
||||||
}
|
}
|
||||||
}
|
}
|