Skip to content

Commit a3008c9

Browse files
kushjayzkushjayz
authored
Merge branch 'main' into issue-31-Create_match_details_page
2 parents 6d18085 + 8ee88cb commit a3008c9

16 files changed

Lines changed: 411 additions & 33 deletions

File tree

‎client/next.config.mjs‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@ const isWindowsDevContainer = () =>
77

88
/** @type {import('next').NextConfig} */
99
const nextConfig = {
10+
images: {
11+
domains: ["squadrone.com.au"],
12+
},
1013
reactStrictMode: true,
1114
// dumb fix for windows docker
1215
webpack: isWindowsDevContainer()

‎client/package-lock.json‎

Lines changed: 10 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎client/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@
2727
"next": "15.3.3",
2828
"react": "19.1.0",
2929
"react-dom": "19.1.0",
30+
"react-icons": "^5.5.0",
3031
"tailwind-merge": "^3.3.1",
3132
"tailwindcss-animate": "^1.0.7"
3233
},

‎client/public/images/aicode_logo_HD.png‎

194 KB
Loading

‎client/src/components/ui/footer.tsx‎

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
import Image from "next/image";
2+
import Link from "next/link";
3+
import { useRouter } from "next/router";
4+
import * as React from "react";
5+
import { FaFacebookF, FaInstagram } from "react-icons/fa";
6+
7+
export default function Footer() {
8+
const router = useRouter();
9+
type NavLink = {
10+
label: string;
11+
href: string;
12+
};
13+
const navlinks: NavLink[] = [
14+
{ label: "Home", href: "/" },
15+
{ label: "Schedule", href: "/schedule" },
16+
{ label: "Format & Rules", href: "/format-rules" },
17+
{ label: "Guests & Sponsors", href: "/guests-sponsors" },
18+
{ label: "Leaderboard", href: "/leaderboard" },
19+
];
20+
return (
21+
<footer className="bg-dark px-6 py-12 text-light">
22+
<div className="mx-auto max-w-7xl">
23+
{/* Main content with horizontal line */}
24+
<div className="stroke-3 grid w-full grid-cols-1 gap-y-8 border-b border-secondary pb-8 pr-5 sm:grid-cols-2 lg:grid-cols-[35%_20%_30%_15%]">
25+
{/* Logo */}
26+
<div className="pr-10">
27+
<h2 className="ft-subtitle mb-5">Event Organizers</h2>
28+
<Image
29+
className="mb-5 object-contain pr-8"
30+
src="/images/aicode_logo_HD.png"
31+
alt="AICODE Logo"
32+
width={282}
33+
height={55}
34+
/>
35+
<Image
36+
className="mb-5 object-contain pr-8"
37+
src="https://squadrone.com.au/wp-content/uploads/2024/11/squadrone-logo-01-scaled.webp"
38+
alt="Squadrone Logo"
39+
width={160}
40+
height={56}
41+
/>
42+
</div>
43+
44+
{/* Pages */}
45+
<div className="pr-10">
46+
<h3 className="ft-subtitle mb-3">Quick Links</h3>
47+
<ul className="ft-content mb-2 space-y-4">
48+
{navlinks.map((link) => (
49+
<li key={link.label}>
50+
<Link
51+
href={link.href}
52+
className={
53+
router.pathname === link.href
54+
? "nav-link-active"
55+
: "nav-link-footer"
56+
}
57+
>
58+
{link.label}
59+
</Link>
60+
</li>
61+
))}
62+
</ul>
63+
</div>
64+
65+
{/* Contact Info */}
66+
<div className="pr-10">
67+
<h3 className="ft-subtitle mb-3">Contact Info</h3>
68+
<p className="ft-content mb-2 text-light">
69+
Email:
70+
<br />
71+
<a
72+
href="mailto:info@youthdronetournament.com.au"
73+
className="ft-content break-all underline hover:text-primary"
74+
>
75+
info@youthdronetournament.com.au
76+
</a>
77+
</p>
78+
<p className="ft-content mb-2">
79+
Venue:
80+
<br />
81+
Melbourne Convention Centre
82+
<br />
83+
1 Convention Centre Pl
84+
<br />
85+
South Wharf VIC 3006
86+
</p>
87+
</div>
88+
89+
{/* Socials */}
90+
<div className="pr-5">
91+
<h3 className="ft-subtitle mb-5">Follow Us</h3>
92+
<div className="mb-5 flex gap-4">
93+
<a
94+
href="https://www.facebook.com/people/Squadrone/100094782254912/"
95+
className="flex h-10 w-10 items-center justify-center rounded-full border border-white text-white transition hover:border-primary hover:text-primary"
96+
>
97+
<FaFacebookF size={18} />
98+
</a>
99+
<a
100+
href="https://www.instagram.com/au.Squadrone/#"
101+
className="flex h-10 w-10 items-center justify-center rounded-full border border-white text-white transition hover:border-primary hover:text-primary"
102+
>
103+
<FaInstagram size={18} />
104+
</a>
105+
</div>
106+
<p className="ft-content text-sm text-light">
107+
Stay updated with the latest news and highlights from the
108+
tournament
109+
</p>
110+
</div>
111+
</div>
112+
113+
{/* Centered copyright below the line */}
114+
<p className="ft-content pt-2 text-center text-sm text-light">
115+
Copyright © 2025 Australia Youth Drone Tournament. All Rights
116+
Reserved.
117+
</p>
118+
</div>
119+
</footer>
120+
);
121+
}

‎client/src/components/ui/navbar.tsx‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
import Image from "next/image";
2+
import Link from "next/link";
3+
import { useRouter } from "next/router";
4+
import { useState } from "react";
5+
import { FiAlignJustify, FiX } from "react-icons/fi";
6+
7+
export default function Navbar() {
8+
const router = useRouter();
9+
const [menuOpen, setMenuOpen] = useState(false);
10+
type NavLink = {
11+
label: string;
12+
href: string;
13+
};
14+
const navlinks: NavLink[] = [
15+
{ label: "Home", href: "/" },
16+
{ label: "Schedule", href: "/schedule" },
17+
{ label: "Format & Rules", href: "/format-rules" },
18+
{ label: "Guests & Sponsors", href: "/guests-sponsors" },
19+
{ label: "Leaderboard", href: "/leaderboard" },
20+
];
21+
const handleNav = () => {
22+
setMenuOpen(!menuOpen);
23+
};
24+
return (
25+
<div className="fixed left-0 right-0 top-0 h-16 w-full bg-light">
26+
<nav className="medium-sm mx-auto flex h-full max-w-7xl items-center justify-between">
27+
{/* Logo container */}
28+
<div className="relative mx-10 flex h-10 w-28 items-center">
29+
<Image
30+
className="object-contain"
31+
src="https://squadrone.com.au/wp-content/uploads/2024/11/squadrone-logo-01-scaled.webp"
32+
alt="Squadrone Logo"
33+
width={2560}
34+
height={889}
35+
/>
36+
</div>
37+
38+
{/* Navbar options/links container */}
39+
<div className="hidden items-center gap-8 lg:flex">
40+
{navlinks.map((link) => {
41+
if (link.label === "Leaderboard") {
42+
return (
43+
<Link
44+
className="btn-primary mr-10"
45+
key={link.href}
46+
href={link.href}
47+
>
48+
View Leaderboard
49+
</Link>
50+
);
51+
}
52+
return (
53+
<Link
54+
key={link.href}
55+
href={link.href}
56+
className={
57+
router.pathname === link.href ? "nav-link-active" : "nav-link"
58+
}
59+
>
60+
{link.label}
61+
</Link>
62+
);
63+
})}
64+
</div>
65+
{/* Mobile navbar */}
66+
<button onClick={handleNav} className="mr-5 lg:hidden">
67+
<FiAlignJustify size={35} />
68+
</button>
69+
</nav>
70+
<div
71+
className={
72+
menuOpen
73+
? "fixed right-0 top-0 h-screen w-[300px] bg-light p-10 shadow-xl duration-500 ease-out"
74+
: "fixed -right-full h-screen w-[300px] duration-500 ease-in"
75+
}
76+
>
77+
<button onClick={handleNav} className="ml-auto block">
78+
<FiX size={35} />
79+
</button>
80+
<div className="medium-sm flex flex-col gap-4">
81+
{navlinks.map((link) => (
82+
<Link
83+
key={link.href}
84+
href={link.href}
85+
className={
86+
router.pathname === link.href ? "nav-link-active" : "nav-link"
87+
}
88+
>
89+
{link.label}
90+
</Link>
91+
))}
92+
</div>
93+
</div>
94+
</div>
95+
);
96+
}

‎client/src/pages/_app.tsx‎

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,23 @@ import "@/styles/globals.css";
33
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
44
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
55
import type { AppProps } from "next/app";
6-
import { Montserrat, Work_Sans } from "next/font/google";
6+
import { Montserrat, Plus_Jakarta_Sans, Work_Sans } from "next/font/google";
7+
8+
import Footer from "../components/ui/footer";
9+
10+
// import { cn } from "@/lib/utils";
11+
import Navbar from "../components/ui/navbar";
712

813
const fontMontserrat = Montserrat({
914
subsets: ["latin"],
1015
variable: "--font-montserrat",
1116
});
1217

18+
const fontPlusJakartaSans = Plus_Jakarta_Sans({
19+
subsets: ["latin"],
20+
variable: "--font-plus-jakarta",
21+
});
22+
1323
const fontWorkSans = Work_Sans({
1424
subsets: ["latin"],
1525
variable: "--font-worksans",
@@ -19,11 +29,18 @@ const queryClient = new QueryClient();
1929

2030
export default function App({ Component, pageProps }: AppProps) {
2131
return (
22-
<div className={`${fontMontserrat.variable} ${fontWorkSans.variable}`}>
32+
<div
33+
className={`${fontMontserrat.variable} ${fontPlusJakartaSans.variable} ${fontWorkSans.variable}`}
34+
>
2335
<QueryClientProvider client={queryClient}>
2436
<ReactQueryDevtools initialIsOpen={false} />
25-
<Component {...pageProps} />
37+
<div className="w-full">
38+
<main className="mx-auto flex min-h-screen max-w-7xl flex-col items-center gap-4 p-24">
39+
<Component {...pageProps} />
40+
</main>
41+
</div>
2642
</QueryClientProvider>
43+
<Footer />
2744
</div>
2845
);
2946
}

‎client/src/pages/format-rules.tsx‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { useState } from "react";
2+
3+
import { usePings } from "@/hooks/pings";
4+
5+
import { Button } from "../components/ui/button";
6+
7+
export default function Home() {
8+
const [clicked, setClicked] = useState(false);
9+
const { data, isLoading } = usePings({
10+
enabled: clicked,
11+
});
12+
13+
return (
14+
<>
15+
<h1 className="title-large text-dark">Title Test</h1>
16+
<Button onClick={() => setClicked(true)}>
17+
{isLoading ? "Loading" : "Ping"}
18+
</Button>
19+
<p>
20+
Response from server: <span>{data as string}</span>
21+
</p>
22+
</>
23+
);
24+
}

‎client/src/pages/guests-sponsors.tsx‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { useState } from "react";
2+
3+
import { usePings } from "@/hooks/pings";
4+
5+
import { Button } from "../components/ui/button";
6+
7+
export default function Home() {
8+
const [clicked, setClicked] = useState(false);
9+
const { data, isLoading } = usePings({
10+
enabled: clicked,
11+
});
12+
13+
return (
14+
<>
15+
<h1 className="title-large text-dark">Title Test</h1>
16+
<Button onClick={() => setClicked(true)}>
17+
{isLoading ? "Loading" : "Ping"}
18+
</Button>
19+
<p>
20+
Response from server: <span>{data as string}</span>
21+
</p>
22+
</>
23+
);
24+
}

‎client/src/pages/index.tsx‎

Lines changed: 2 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,17 @@
1-
import { Inter as FontSans } from "next/font/google";
21
import { useState } from "react";
32

43
import { usePings } from "@/hooks/pings";
5-
import { cn } from "@/lib/utils";
64

75
import { Button } from "../components/ui/button";
86

9-
const fontSans = FontSans({
10-
subsets: ["latin"],
11-
variable: "--font-sans",
12-
});
13-
147
export default function Home() {
158
const [clicked, setClicked] = useState(false);
169
const { data, isLoading } = usePings({
1710
enabled: clicked,
1811
});
1912

2013
return (
21-
<main
22-
className={cn(
23-
"flex min-h-screen flex-col items-center gap-4 p-24 font-sans",
24-
fontSans.variable,
25-
)}
26-
>
14+
<>
2715
{/* Delete after style testing */}
2816
<p className="subtitle text-primary">subtitle with primary colour</p>
2917
<h1 className="title-large text-dark">Test Title</h1>
@@ -33,6 +21,6 @@ export default function Home() {
3321
<p>
3422
Response from server: <span>{data as string}</span>
3523
</p>
36-
</main>
24+
</>
3725
);
3826
}

0 commit comments

Comments
 (0)