diff --git a/Frontend/bun.lockb b/Frontend/bun.lockb index a93198a..bacd45c 100644 Binary files a/Frontend/bun.lockb and b/Frontend/bun.lockb differ diff --git a/Frontend/package.json b/Frontend/package.json index 744bbdb..fa92606 100644 --- a/Frontend/package.json +++ b/Frontend/package.json @@ -23,6 +23,7 @@ "next-plausible": "^3.12.0", "next-themes": "^0.3.0", "react": "^18", + "react-countup": "^6.5.3", "react-dom": "^18", "react-hook-form": "^7.51.3", "restfulmc-lib": "^1.1.2", diff --git a/Frontend/src/app/(pages)/page.tsx b/Frontend/src/app/(pages)/page.tsx index 72a2237..10f2e0c 100644 --- a/Frontend/src/app/(pages)/page.tsx +++ b/Frontend/src/app/(pages)/page.tsx @@ -1,5 +1,6 @@ import FeaturedContent from "@/components/landing/featured-content"; import Hero from "@/components/landing/hero"; +import StatisticCounters from "@/components/landing/statistic-counters"; /** * The landing page. @@ -10,6 +11,7 @@ const LandingPage = (): JSX.Element => (
+
); export default LandingPage; diff --git a/Frontend/src/app/components/counter.tsx b/Frontend/src/app/components/counter.tsx new file mode 100644 index 0000000..8ef4d7a --- /dev/null +++ b/Frontend/src/app/components/counter.tsx @@ -0,0 +1,49 @@ +"use client"; + +import { minecrafter } from "@/font/fonts"; +import { cn } from "@/lib/utils"; +import CountUp from "react-countup"; + +/** + * Props for the counter. + */ +type CounterProps = { + /** + * The name of the counter. + */ + name: string; + + /** + * The amount to count up to. + */ + amount: number; + + /** + * The optional duration of the count up. + *

+ * Uses the default duration if not provided. + *

+ */ + duration?: number | undefined; +}; + +/** + * A counter component. + * + * @param amount the amount to count up to + * @param duration the optional duration of the count up + * @returns the counter jsx + */ +const Counter = ({ name, amount, duration }: CounterProps): JSX.Element => ( +
+

+ {name} +

+

+ +

+
+); +export default Counter; diff --git a/Frontend/src/app/components/footer.tsx b/Frontend/src/app/components/footer.tsx new file mode 100644 index 0000000..58fc364 --- /dev/null +++ b/Frontend/src/app/components/footer.tsx @@ -0,0 +1,2 @@ +const Footer = (): JSX.Element => ; +export default Footer; diff --git a/Frontend/src/app/components/landing/featured-content.tsx b/Frontend/src/app/components/landing/featured-content.tsx index 2e2aba7..bb8c5ae 100644 --- a/Frontend/src/app/components/landing/featured-content.tsx +++ b/Frontend/src/app/components/landing/featured-content.tsx @@ -10,7 +10,7 @@ import Link from "next/link"; * @returns the featured content jsx */ const FeaturedContent = (): JSX.Element => ( -
+
{config.featuredItems.map((item, index) => ( diff --git a/Frontend/src/app/components/landing/hero.tsx b/Frontend/src/app/components/landing/hero.tsx index 3e56346..47bcb35 100644 --- a/Frontend/src/app/components/landing/hero.tsx +++ b/Frontend/src/app/components/landing/hero.tsx @@ -10,11 +10,11 @@ import Link from "next/link"; * @returns the hero jsx */ const Hero = (): JSX.Element => ( -
+
{/* Title */}

{config.siteName}

diff --git a/Frontend/src/app/components/landing/statistic-counters.tsx b/Frontend/src/app/components/landing/statistic-counters.tsx new file mode 100644 index 0000000..e2b3668 --- /dev/null +++ b/Frontend/src/app/components/landing/statistic-counters.tsx @@ -0,0 +1,18 @@ +import Counter from "@/components/counter"; + +/** + * The statistic counters component. + * + * @returns the counters jsx + */ +const StatisticCounters = (): JSX.Element => ( +
+
+ + + + +
+
+); +export default StatisticCounters; diff --git a/Frontend/src/app/components/player/player-search.tsx b/Frontend/src/app/components/player/player-search.tsx index 764e3c3..46e48ea 100644 --- a/Frontend/src/app/components/player/player-search.tsx +++ b/Frontend/src/app/components/player/player-search.tsx @@ -25,7 +25,7 @@ const PlayerSearch = ({ action={handleRedirect} >
- + {children} +