Use children for Title
This commit is contained in:
parent
76d0c30a3e
commit
4e6e1c0ddc
|
@ -23,7 +23,7 @@ export interface Props {
|
||||||
export function ArchivePage({ items, type }: Props) {
|
export function ArchivePage({ items, type }: Props) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path={[capitalize(type), "Archive"]} />
|
<Title>{[capitalize(type), "Archive"]}</Title>
|
||||||
<div className={styles.page}>
|
<div className={styles.page}>
|
||||||
<h1>{capitalize(type)} Archive</h1>
|
<h1>{capitalize(type)} Archive</h1>
|
||||||
<ul className={styles.list}>
|
<ul className={styles.list}>
|
||||||
|
|
|
@ -59,7 +59,7 @@ export function createReadAllPage({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path={title} />
|
<Title>{title}</Title>
|
||||||
<Header
|
<Header
|
||||||
title={title}
|
title={title}
|
||||||
image={image}
|
image={image}
|
||||||
|
|
|
@ -33,7 +33,7 @@ export function createSectionPage({
|
||||||
function Page(this: void, { content, sections, current }: Props) {
|
function Page(this: void, { content, sections, current }: Props) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path={[sections[current].title, title]} />
|
<Title>{[sections[current].title, title]}</Title>
|
||||||
<Header
|
<Header
|
||||||
title={title}
|
title={title}
|
||||||
image={image}
|
image={image}
|
||||||
|
|
|
@ -2,17 +2,18 @@ import Head from "next/head";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
path: string | string[];
|
children: string | string[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export function Title(props: Props) {
|
export function Title(props: Props) {
|
||||||
const paths = typeof props.path === "string" ? [props.path] : props.path;
|
const children =
|
||||||
|
typeof props.children === "string" ? [props.children] : props.children;
|
||||||
|
|
||||||
paths.push("UWaterloo Computer Science Club");
|
children.push("UWaterloo Computer Science Club");
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Head>
|
<Head>
|
||||||
<title>{paths.join(" - ")}</title>
|
<title>{children.join(" - ")}</title>
|
||||||
</Head>
|
</Head>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -17,7 +17,7 @@ import styles from "./index.module.css";
|
||||||
export default function AboutUs() {
|
export default function AboutUs() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path="About" />
|
<Title>About</Title>
|
||||||
<div className={styles.titleContainer}>
|
<div className={styles.titleContainer}>
|
||||||
<h1 className={styles.title}>About Us!</h1>
|
<h1 className={styles.title}>About Us!</h1>
|
||||||
<Image src="/images/about-us.svg" className={styles.codey} />
|
<Image src="/images/about-us.svg" className={styles.codey} />
|
||||||
|
|
|
@ -10,7 +10,7 @@ import styles from "./our-supporters.module.css";
|
||||||
export default function OurSupporters() {
|
export default function OurSupporters() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path="Our Supporters" />
|
<Title>Our Supporters</Title>
|
||||||
<div className={styles.headerContainer}>
|
<div className={styles.headerContainer}>
|
||||||
<h1 className={styles.header}>Our Supporters</h1>
|
<h1 className={styles.header}>Our Supporters</h1>
|
||||||
<Image src="images/our-supporters/codey.svg" className={styles.codey} />
|
<Image src="images/our-supporters/codey.svg" className={styles.codey} />
|
||||||
|
|
|
@ -37,7 +37,7 @@ interface Props {
|
||||||
export default function Team({ execs, programme, website, systems }: Props) {
|
export default function Team({ execs, programme, website, systems }: Props) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path="Team" />
|
<Title>Team</Title>
|
||||||
<DefaultLayout>
|
<DefaultLayout>
|
||||||
<div className={styles.headerContainer}>
|
<div className={styles.headerContainer}>
|
||||||
<div className={styles.headerTextContainer}>
|
<div className={styles.headerTextContainer}>
|
||||||
|
|
|
@ -17,7 +17,7 @@ import {
|
||||||
export default function EventInfoPage(props: Props) {
|
export default function EventInfoPage(props: Props) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path={props.event.metadata.name} />
|
<Title>{props.event.metadata.name}</Title>
|
||||||
<EventCard
|
<EventCard
|
||||||
{...props.event.metadata}
|
{...props.event.metadata}
|
||||||
date={new Date(props.event.metadata.date)}
|
date={new Date(props.event.metadata.date)}
|
||||||
|
|
|
@ -55,9 +55,7 @@ export default function Term(props: Props) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.main}>
|
<div className={styles.main}>
|
||||||
<Title
|
<Title>{["Events", `${capitalize(props.term)} ${props.year}`]}</Title>
|
||||||
path={["Events", `${capitalize(props.term)} ${capitalize(props.year)}`]}
|
|
||||||
/>
|
|
||||||
<div className={styles.header}>
|
<div className={styles.header}>
|
||||||
{headerTerms.map((link) => (
|
{headerTerms.map((link) => (
|
||||||
<HeaderLink
|
<HeaderLink
|
||||||
|
|
|
@ -17,7 +17,7 @@ interface Props {
|
||||||
export default function Year(props: Props) {
|
export default function Year(props: Props) {
|
||||||
return (
|
return (
|
||||||
<div className={styles.main}>
|
<div className={styles.main}>
|
||||||
<Title path={["Events", props.year]} />
|
<Title>{["Events", props.year]}</Title>
|
||||||
<h2>
|
<h2>
|
||||||
Events Archive:<span className={styles.blue}>{` ${props.year}`}</span>
|
Events Archive:<span className={styles.blue}>{` ${props.year}`}</span>
|
||||||
</h2>
|
</h2>
|
||||||
|
|
|
@ -12,7 +12,7 @@ import styles from "./get-involved.module.css";
|
||||||
export default function GetInvolved() {
|
export default function GetInvolved() {
|
||||||
return (
|
return (
|
||||||
<div className={styles.page}>
|
<div className={styles.page}>
|
||||||
<Title path="Get Involved" />
|
<Title>Get Involved</Title>
|
||||||
<header>
|
<header>
|
||||||
<div className={styles.headerText}>
|
<div className={styles.headerText}>
|
||||||
<h1>Get Involved!</h1>
|
<h1>Get Involved!</h1>
|
||||||
|
|
|
@ -26,7 +26,7 @@ interface Props {
|
||||||
export default function Home(props: Props) {
|
export default function Home(props: Props) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path={[]} />
|
<Title>{[]}</Title>
|
||||||
<DefaultLayout>
|
<DefaultLayout>
|
||||||
<header className={styles.intro}>
|
<header className={styles.intro}>
|
||||||
<div className={styles.introTop} />
|
<div className={styles.introTop} />
|
||||||
|
|
|
@ -31,7 +31,7 @@ interface Props {
|
||||||
export default function TermNews({ year, term, news }: Props) {
|
export default function TermNews({ year, term, news }: Props) {
|
||||||
return (
|
return (
|
||||||
<div className={styles.page}>
|
<div className={styles.page}>
|
||||||
<Title path={["News", `${capitalize(term)} ${capitalize(year)}`]} />
|
<Title>{["News", `${capitalize(term)} ${capitalize(year)}`]}</Title>
|
||||||
<h1>
|
<h1>
|
||||||
News Archive:{" "}
|
News Archive:{" "}
|
||||||
<span className={styles.term}>
|
<span className={styles.term}>
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { Advice } from "./coop";
|
||||||
export default function AcademicAdvice() {
|
export default function AcademicAdvice() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path="Academic Advice" />
|
<Title>Academic Advice</Title>
|
||||||
<Advice>
|
<Advice>
|
||||||
<Content />
|
<Content />
|
||||||
</Advice>
|
</Advice>
|
||||||
|
|
|
@ -12,7 +12,7 @@ import styles from "./coop.module.css";
|
||||||
export default function CoopAdvice() {
|
export default function CoopAdvice() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path="Co-op Advice" />
|
<Title>Co-op Advice</Title>
|
||||||
<Advice>
|
<Advice>
|
||||||
<Content />
|
<Content />
|
||||||
</Advice>
|
</Advice>
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { Advice } from "./coop";
|
||||||
export default function MiscAdvice() {
|
export default function MiscAdvice() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Title path="Misc Advice" />
|
<Title>Misc Advice</Title>
|
||||||
<Advice>
|
<Advice>
|
||||||
<Content />
|
<Content />
|
||||||
</Advice>
|
</Advice>
|
||||||
|
|
|
@ -20,7 +20,7 @@ interface Props {
|
||||||
export default function TechTalk({ content, metadata }: Props) {
|
export default function TechTalk({ content, metadata }: Props) {
|
||||||
return (
|
return (
|
||||||
<div className={styles.page}>
|
<div className={styles.page}>
|
||||||
<Title path={[metadata.title, "Tech Talks"]} />
|
<Title>{[metadata.title, "Tech Talks"]}</Title>
|
||||||
<Header />
|
<Header />
|
||||||
<TechTalkCard
|
<TechTalkCard
|
||||||
{...metadata}
|
{...metadata}
|
||||||
|
|
|
@ -15,7 +15,7 @@ interface Props {
|
||||||
export default function TechTalks({ talks }: Props) {
|
export default function TechTalks({ talks }: Props) {
|
||||||
return (
|
return (
|
||||||
<div className={styles.page}>
|
<div className={styles.page}>
|
||||||
<Title path="Tech Talks" />
|
<Title>Tech Talks</Title>
|
||||||
<Header />
|
<Header />
|
||||||
<div className={styles.miniCards}>
|
<div className={styles.miniCards}>
|
||||||
{talks.map((talk) => (
|
{talks.map((talk) => (
|
||||||
|
|
|
@ -13,7 +13,7 @@ export default function Themer() {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<main className={styles.page}>
|
<main className={styles.page}>
|
||||||
<Title path="Themer" />
|
<Title>Themer</Title>
|
||||||
<h1>Themer</h1>
|
<h1>Themer</h1>
|
||||||
<form onSubmit={(event) => event.preventDefault()}>
|
<form onSubmit={(event) => event.preventDefault()}>
|
||||||
<div className={styles.controls}>
|
<div className={styles.controls}>
|
||||||
|
|
Loading…
Reference in New Issue