diff --git a/client/public/assets/graphics/DurhackLogo.svg b/client/public/assets/graphics/DurhackLogo.svg new file mode 100644 index 00000000..05cbda0a --- /dev/null +++ b/client/public/assets/graphics/DurhackLogo.svg @@ -0,0 +1,4 @@ + + + + diff --git a/client/src/app/(home)/page.tsx b/client/src/app/(home)/page.tsx index 33349e61..a798cd07 100644 --- a/client/src/app/(home)/page.tsx +++ b/client/src/app/(home)/page.tsx @@ -50,7 +50,7 @@ export default function HomePage() { {/* Medium */}
-

Medium

+

Medium TEST ESTTEUHEUFHE

{/* Footer - temporarily using the dashboard one */} diff --git a/client/src/components/footer.tsx b/client/src/components/footer.tsx index 16d3ef0f..61c45e16 100644 --- a/client/src/components/footer.tsx +++ b/client/src/components/footer.tsx @@ -1,48 +1,102 @@ import Link from "next/link" +import { CloudsFooterGraphic } from "./graphics/clouds-footer" +import { cn } from "@/lib/utils" +import Image from "next/image"; +import { patrickHand, spaceGrotesk } from "@/lib/google-fonts" +import { siteConfig } from "@/config/site"; -export function Footer() { +function SocialsBar() { + return ( +
+ {siteConfig.socials.map((social) => { + const Icon = social.icon; + return ( + + + + ); + })} +
+ ); +} + +export function Footer ({ className, ...props }: React.HTMLAttributes) { const mlhCodeOfConduct = ( - + MLH Code of Conduct ) - const compsoc = ( - + const CompSoc = ( + compsoc.tech ) - const durhamStudentsUnion = ( - + const StudentUnion = ( + durhamsu.com ) - const durhamStudentsUnionCompany = ( - - 07689815 - - ) - const durhamStudentsUnionCharity = ( - - 1145400 - - ) +
+ +
- return ( - + ) } diff --git a/client/src/components/graphics/clouds-footer.tsx b/client/src/components/graphics/clouds-footer.tsx new file mode 100644 index 00000000..bde66aa4 --- /dev/null +++ b/client/src/components/graphics/clouds-footer.tsx @@ -0,0 +1,31 @@ +import type * as React from "react" + +export function CloudsFooterGraphic({ ...props }: React.ComponentProps<"svg">) { + return ( + + + + + + + + + + ) +} diff --git a/client/src/components/icons.tsx b/client/src/components/icons.tsx index 4cfac9cf..c50fc9b8 100644 --- a/client/src/components/icons.tsx +++ b/client/src/components/icons.tsx @@ -73,3 +73,16 @@ export function GitHubIcon(props: IconProps) { ) } + + +/** + * @see https://simpleicons.org/?q=medium + */ +export function MediumIcon(props: IconProps) { + return ( + + Medium + + + ) +} \ No newline at end of file diff --git a/client/src/config/site.ts b/client/src/config/site.ts index df554439..971e03ad 100644 --- a/client/src/config/site.ts +++ b/client/src/config/site.ts @@ -1,6 +1,6 @@ import type * as React from "react" -import { FacebookIcon, GitHubIcon, InstagramIcon, LinkedInIcon, TikTokIcon, XIcon } from "@/components/icons" +import { FacebookIcon, GitHubIcon, InstagramIcon, LinkedInIcon, MediumIcon, TikTokIcon, XIcon } from "@/components/icons" import { isDevelopment, isStaging, noLocalServer } from "@/lib/environment" type socialLink = { key: string; href: string; icon: React.FC } @@ -21,6 +21,7 @@ export const siteConfig = { { key: "tiktok", href: "https://www.tiktok.com/@durhack", icon: TikTokIcon }, { key: "linkedin", href: "https://www.linkedin.com/company/durhack/mycompany/", icon: LinkedInIcon }, { key: "x", href: "https://x.com/durhackevent", icon: XIcon }, + { key: "medium", href: "https://medium.com/@DurHack_press", icon: MediumIcon }, ] as const satisfies readonly socialLink[], sessionCookieName: "__Secure-durhack-session", } diff --git a/client/src/lib/google-fonts.ts b/client/src/lib/google-fonts.ts index 2875aecf..75f00ebb 100644 --- a/client/src/lib/google-fonts.ts +++ b/client/src/lib/google-fonts.ts @@ -1,6 +1,7 @@ -import { Audiowide, Darker_Grotesque, Electrolize, Space_Grotesk } from "next/font/google" +import { Audiowide, Darker_Grotesque, Electrolize, Space_Grotesk, Patrick_Hand } from "next/font/google" export const spaceGrotesk = Space_Grotesk({ subsets: ["latin"] }) export const audiowide = Audiowide({ weight: "400", subsets: ["latin"], fallback: ["sans-serif"] }) export const electrolize = Electrolize({ weight: "400", subsets: ["latin"] }) export const darkerGrotesk = Darker_Grotesque({ weight: "variable", subsets: ["latin"] }) +export const patrickHand = Patrick_Hand({ weight: "400", subsets: ["latin"] })