{committeeList.map((member, idx) => (
diff --git a/client/src/pages/artwork/[id].tsx b/client/src/pages/artwork/[id].tsx
index d92927c..2a28de9 100644
--- a/client/src/pages/artwork/[id].tsx
+++ b/client/src/pages/artwork/[id].tsx
@@ -64,7 +64,7 @@ export default function ArtworkPage() {
/>
-
+
(arr: T[]) {
export default function FeaturedArtwork({ carousels = [] }: ArtworksPageProps) {
return (
-
{artwork.name}
diff --git a/client/src/pages/artwork/index.tsx b/client/src/pages/artwork/index.tsx index eaeaf56..c7933d1 100644 --- a/client/src/pages/artwork/index.tsx +++ b/client/src/pages/artwork/index.tsx @@ -35,8 +35,8 @@ function shuffleArray
-
-
+
diff --git a/client/src/pages/events/[id].tsx b/client/src/pages/events/[id].tsx
index 80e8513..97d00a9 100644
--- a/client/src/pages/events/[id].tsx
+++ b/client/src/pages/events/[id].tsx
@@ -58,9 +58,9 @@ export default function EventPage() {
className="mt-4 w-full border-t border-gray-600"
aria-hidden="true"
/>
-
+
+
Featured Artwork
@@ -46,7 +46,7 @@ export default function FeaturedArtwork({ carousels = [] }: ArtworksPageProps) {
-
+
{carousels.map((items, i) => ContinuousCarousel(items, i % 2 === 0))}
Featured Artwork
@@ -46,7 +46,7 @@ export default function FeaturedArtwork({ carousels = [] }: ArtworksPageProps) {
+
{event.location}{" "}
@@ -81,7 +81,7 @@ export default function EventPage() {
)}
+
(
export default function EventsPage() {
const router = useRouter();
- const [page, setPage] = useState(1);
-
const pageSize = 20;
const rawType = useMemo(() => {
@@ -33,6 +31,7 @@ export default function EventsPage() {
}, [router.query.type]);
const type: EventTypeFilter = rawType ?? "upcoming";
+ const page = Number(router.query.page) || 1;
useEffect(() => {
if (!router.isReady) return;
@@ -45,10 +44,6 @@ export default function EventsPage() {
}
}, [router.isReady, rawType, router]);
- useEffect(() => {
- setPage(1);
- }, [type]);
-
const { data, isPending, isError, isFetching } = useEvents({
type,
page,
@@ -118,7 +113,16 @@ export default function EventsPage() {
@@ -203,7 +213,7 @@ export default function EventsPage() {
-
+
{/* Left: Cover Image */}
-
+
{showcase.gameCover ? (
{/* Right: Details */}
-
+
+
+
{/* Title of the game */}
- @@ -100,17 +100,17 @@ export default function HomePage() {
{/* Comments from committes */} -+
{/* double quotes from comments */} {showcase.description}
{eventCards
@@ -204,7 +204,7 @@ export default function Landing() {
*/}
-
diff --git a/client/src/pages/members/[id].tsx b/client/src/pages/members/[id].tsx
index aa13ded..17a209c 100644
--- a/client/src/pages/members/[id].tsx
+++ b/client/src/pages/members/[id].tsx
@@ -86,7 +86,7 @@ export default function MemberPage() {
const initials = initialsFromName(member.name);
return (
<>
-
+
@@ -114,7 +114,7 @@ export default function MemberPage() {
+
{member.name}
-+
{member.social_media && member.social_media.length > 0 && (
diff --git a/client/src/styles/globals.css b/client/src/styles/globals.css
index 4fa93d1..8f26af6 100644
--- a/client/src/styles/globals.css
+++ b/client/src/styles/globals.css
@@ -1,56 +1,54 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
- :root {
- /* Figma Colours */
- --dark-1: hsl(0 0% 0%);
- --dark-2: hsl(236.25, 47.06%, 6.67%);
- --dark-3: hsl(232.5, 48%, 9.8%);
- --dark-alt: hsl(260 52.38% 12.35%);
- --neutral-1: hsl(235.1, 47.57%, 20.2%);
- --neutral-2: hsl(235.38, 47.45%, 26.86%);
- --neutral-3: hsl(234.81, 47.37%, 33.53%);
- --neutral-4: hsl(235.05, 47.32%, 40.2%);
-
- --light-1: hsl(0 0% 100%);
- --light-2: hsl(236.25, 96%, 90.2%);
- --light-3: hsl(235, 96%, 80%);
- --light-alt: hsl(183 100% 79%);
- --logo-blue-1: hsl(236 62% 95%);
-
- /* Colours to be used for components */
- --background: 236 47% 7%;
- --foreground: 0 0% 100%;
-
- --card: 235 47% 20%;
- --card-foreground: 0 0% 100%;
- --landing-card: 232, 50.8%, 12%;
-
- --popover: 235 47% 20%;
- --popover-foreground: 0 0% 100%;
-
- --primary: 235 96% 80%;
- --primary-foreground: 235 47% 20%;
-
- --secondary: 260 68% 69%;
- --secondary-foreground: 235 47% 20%;
-
- --muted: 235 47% 20%;
- --muted-foreground: 236 96% 90%;
-
- --accent: 260 68% 69%;
- --accent-foreground: 235 47% 20%;
-
- --destructive: 0 62.8% 30.6%;
- --destructive-foreground: 0 0% 100%;
+@import "tailwindcss";
+@plugin "tailwindcss-animate";
+
+@theme {
+ /* Figma palette */
+ --color-dark-1: hsl(0 0% 0%);
+ --color-dark-2: hsl(236.25 47.06% 6.67%);
+ --color-dark-3: hsl(232.5 48% 9.8%);
+ --color-dark-alt: hsl(260 52.38% 12.35%);
+ --color-neutral-1: hsl(235.1 47.57% 20.2%);
+ --color-neutral-2: hsl(235.38 47.45% 26.86%);
+ --color-neutral-3: hsl(234.81 47.37% 33.53%);
+ --color-neutral-4: hsl(235.05 47.32% 40.2%);
+ --color-light-1: hsl(0 0% 100%);
+ --color-light-2: hsl(236.25 96% 90.2%);
+ --color-light-3: hsl(235 96% 80%);
+ --color-light-alt: hsl(183 100% 79%);
+ --color-logo-blue-1: hsl(236 62% 95%);
+
+ /* Semantic tokens */
+ --color-background: hsl(236 47% 7%);
+ --color-foreground: hsl(0 0% 100%);
+ --color-card: hsl(235 47% 20%);
+ --color-card-foreground: hsl(0 0% 100%);
+ --color-landing-card: hsl(232 50.8% 12%);
+ --color-popover: hsl(235 47% 20%);
+ --color-popover-foreground: hsl(0 0% 100%);
+ --color-primary: hsl(235 96% 80%);
+ --color-primary-foreground: hsl(235 47% 20%);
+ --color-secondary: hsl(260 68% 69%);
+ --color-secondary-foreground: hsl(235 47% 20%);
+ --color-muted: hsl(235 47% 20%);
+ --color-muted-foreground: hsl(236 96% 90%);
+ --color-accent: hsl(260 68% 69%);
+ --color-accent-foreground: hsl(235 47% 20%);
+ --color-destructive: hsl(0 62.8% 30.6%);
+ --color-destructive-foreground: hsl(0 0% 100%);
+ --color-border: hsl(235 47% 20%);
+ --color-input: hsl(235 47% 20%);
+ --color-ring: hsl(236 47% 7%);
+
+ /* Border radius */
+ --radius-lg: 0.5rem;
+ --radius-md: 0.375rem;
+ --radius-sm: 0.25rem;
+}
- --border: 235 47% 20%;
- --input: 235 47% 20%;
- --ring: 236 47% 7%;
- --radius: 0.5rem;
- }
+@theme inline {
+ /* next/font injects these at runtime — inline keeps them as live var() references */
+ --font-jersey10: var(--font-jersey10);
+ --font-firaCode: var(--font-firaCode);
}
@layer base {
diff --git a/client/tailwind.config.ts b/client/tailwind.config.ts
deleted file mode 100644
index 94e0417..0000000
--- a/client/tailwind.config.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-import type { Config } from "tailwindcss";
-import { fontFamily } from "tailwindcss/defaultTheme";
-import animate from "tailwindcss-animate";
-
-const config = {
- content: [
- "./pages/**/*.{ts,tsx}",
- "./components/**/*.{ts,tsx}",
- "./app/**/*.{ts,tsx}",
- "./src/**/*.{ts,tsx}",
- ],
- prefix: "",
- theme: {
- container: {
- center: true,
- padding: "2rem",
- screens: {
- "2xl": "1400px",
- },
- },
- extend: {
- fontFamily: {
- sans: ["var(--font-sans)", ...fontFamily.sans],
- jersey10: ["var(--font-jersey10)", ...fontFamily.sans],
- firaCode: ["var(--font-firaCode)", ...fontFamily.sans],
- },
-
- colors: {
- border: "hsl(var(--border))",
- input: "hsl(var(--input))",
- ring: "hsl(var(--ring))",
- background: "hsl(var(--background))",
- foreground: "hsl(var(--foreground))",
- primary: {
- DEFAULT: "hsl(var(--primary))",
- foreground: "hsl(var(--primary-foreground))",
- },
- secondary: {
- DEFAULT: "hsl(var(--secondary))",
- foreground: "hsl(var(--secondary-foreground))",
- },
- destructive: {
- DEFAULT: "hsl(var(--destructive))",
- foreground: "hsl(var(--destructive-foreground))",
- },
- landingCard: "hsl(var(--landing-card))",
- muted: {
- DEFAULT: "hsl(var(--muted))",
- foreground: "hsl(var(--muted-foreground))",
- },
- accent: {
- DEFAULT: "hsl(var(--accent))",
- foreground: "hsl(var(--accent-foreground))",
- },
- popover: {
- DEFAULT: "hsl(var(--popover))",
- foreground: "hsl(var(--popover-foreground))",
- },
- card: {
- DEFAULT: "hsl(var(--card))",
- foreground: "hsl(var(--card-foreground))",
- },
- dark_1: "var(--dark-1)",
- dark_2: "var(--dark-2)",
- dark_3: "var(--dark-3)",
- dark_alt: "var(--dark-alt)",
- neutral_1: "var(--neutral-1)",
- neutral_2: "var(--neutral-2)",
- neutral_3: "var(--neutral-3)",
- neutral_4: "var(--neutral-4)",
- light_1: "var(--light-1)",
- light_2: "var(--light-2)",
- light_3: "var(--light-3)",
- },
- borderRadius: {
- lg: "var(--radius)",
- md: "calc(var(--radius) - 2px)",
- sm: "calc(var(--radius) - 4px)",
- },
- keyframes: {
- "accordion-down": {
- from: { height: "0" },
- to: { height: "var(--radix-accordion-content-height)" },
- },
- "accordion-up": {
- from: { height: "var(--radix-accordion-content-height)" },
- to: { height: "0" },
- },
- },
- animation: {
- "accordion-down": "accordion-down 0.2s ease-out",
- "accordion-up": "accordion-up 0.2s ease-out",
- },
- },
- },
- plugins: [animate],
-} satisfies Config;
-
-export default config;
diff --git a/client/tsconfig.json b/client/tsconfig.json
index 5845367..b6346a2 100644
--- a/client/tsconfig.json
+++ b/client/tsconfig.json
@@ -1,6 +1,10 @@
{
"compilerOptions": {
- "lib": ["dom", "dom.iterable", "esnext"],
+ "lib": [
+ "dom",
+ "dom.iterable",
+ "esnext"
+ ],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
@@ -10,13 +14,21 @@
"moduleResolution": "bundler",
"resolveJsonModule": true,
"isolatedModules": true,
- "jsx": "preserve",
+ "jsx": "react-jsx",
"incremental": true,
"paths": {
- "@/*": ["./src/*"]
+ "@/*": [
+ "./src/*"
+ ]
},
"target": "ES2017"
},
- "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
- "exclude": ["node_modules"]
+ "include": [
+ "next-env.d.ts",
+ "**/*.ts",
+ "**/*.tsx"
+ ],
+ "exclude": [
+ "node_modules"
+ ]
}